@greenbone/ui-lib 1.5.0 → 1.5.1-alpha0

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 (255) hide show
  1. package/lib/cjs/api/error/libs.js.map +1 -1
  2. package/lib/cjs/components/Accordion/Accordion.js +1 -1
  3. package/lib/cjs/components/Accordion/Accordion.js.map +1 -1
  4. package/lib/cjs/components/Alert/Alert.js +1 -1
  5. package/lib/cjs/components/Alert/Alert.js.map +1 -1
  6. package/lib/cjs/components/Badge/Badge.js.map +1 -1
  7. package/lib/cjs/components/BadgeIconHoverCard/BadgeIconHoverCard.js.map +1 -1
  8. package/lib/cjs/components/Breadcrumbs/Breadcrumbs.js.map +1 -1
  9. package/lib/cjs/components/ConfirmationDialog/ConfirmationDialog.js +1 -1
  10. package/lib/cjs/components/ConfirmationDialog/ConfirmationDialog.js.map +1 -1
  11. package/lib/cjs/components/DateInline/DateInline.js.map +1 -1
  12. package/lib/cjs/components/Drawer/Drawer.js +1 -1
  13. package/lib/cjs/components/Drawer/Drawer.js.map +1 -1
  14. package/lib/cjs/components/Filter/TermContainer/Term/TermBadge.js +1 -1
  15. package/lib/cjs/components/Filter/TermContainer/Term/TermBadge.js.map +1 -1
  16. package/lib/cjs/components/Filter/TermContainer/index.js +1 -1
  17. package/lib/cjs/components/Filter/TermContainer/index.js.map +1 -1
  18. package/lib/cjs/components/Filter/persistence/FilterPersistent.js +1 -1
  19. package/lib/cjs/components/Filter/persistence/FilterPersistent.js.map +1 -1
  20. package/lib/cjs/components/Filter/utils/FilterSelect.js +1 -1
  21. package/lib/cjs/components/Filter/utils/FilterSelect.js.map +1 -1
  22. package/lib/cjs/components/Filter/utils/Select.js +1 -1
  23. package/lib/cjs/components/Filter/utils/Select.js.map +1 -1
  24. package/lib/cjs/components/Form/Button/Button.js +1 -1
  25. package/lib/cjs/components/Form/Button/Button.js.map +1 -1
  26. package/lib/cjs/components/Form/Checkbox/Checkbox.js +1 -1
  27. package/lib/cjs/components/Form/Checkbox/Checkbox.js.map +1 -1
  28. package/lib/cjs/components/Form/DateTimePicker/DateTimePicker.js +1 -1
  29. package/lib/cjs/components/Form/DateTimePicker/DateTimePicker.js.map +1 -1
  30. package/lib/cjs/components/Form/DateTimePicker/TimePicker.js +1 -1
  31. package/lib/cjs/components/Form/DateTimePicker/TimePicker.js.map +1 -1
  32. package/lib/cjs/components/Form/FileInput/FileInput.js +1 -1
  33. package/lib/cjs/components/Form/FileInput/FileInput.js.map +1 -1
  34. package/lib/cjs/components/Form/Form/Form.js +1 -1
  35. package/lib/cjs/components/Form/Form/Form.js.map +1 -1
  36. package/lib/cjs/components/Form/FormItemGroup.js.map +1 -1
  37. package/lib/cjs/components/Form/Input/Input.js +1 -1
  38. package/lib/cjs/components/Form/Input/Input.js.map +1 -1
  39. package/lib/cjs/components/Form/Labels/InfoLabel.js.map +1 -1
  40. package/lib/cjs/components/Form/Labels/LabelWithIcon.js.map +1 -1
  41. package/lib/cjs/components/Form/MenuButton/index.js +1 -1
  42. package/lib/cjs/components/Form/MenuButton/index.js.map +1 -1
  43. package/lib/cjs/components/Form/PasswordInput/PasswordInput.js +1 -1
  44. package/lib/cjs/components/Form/PasswordInput/PasswordInput.js.map +1 -1
  45. package/lib/cjs/components/Form/RadioButton/RadioButton.js +1 -1
  46. package/lib/cjs/components/Form/RadioButton/RadioButton.js.map +1 -1
  47. package/lib/cjs/components/Form/Select/Cascade/CascadeMenu.js +1 -1
  48. package/lib/cjs/components/Form/Select/Cascade/CascadeMenu.js.map +1 -1
  49. package/lib/cjs/components/Form/Select/Cascade/CascadeOption.js +1 -1
  50. package/lib/cjs/components/Form/Select/Cascade/CascadeOption.js.map +1 -1
  51. package/lib/cjs/components/Form/Select/Cascade/index.js +1 -1
  52. package/lib/cjs/components/Form/Select/Cascade/index.js.map +1 -1
  53. package/lib/cjs/components/Form/Select/CreatableSelect.js +1 -1
  54. package/lib/cjs/components/Form/Select/CreatableSelect.js.map +1 -1
  55. package/lib/cjs/components/Form/Select/Select.js +1 -1
  56. package/lib/cjs/components/Form/Select/Select.js.map +1 -1
  57. package/lib/cjs/components/Form/Switch/Switch.js +1 -1
  58. package/lib/cjs/components/Form/Switch/Switch.js.map +1 -1
  59. package/lib/cjs/components/Form/Textarea/Textarea.js +1 -1
  60. package/lib/cjs/components/Form/Textarea/Textarea.js.map +1 -1
  61. package/lib/cjs/components/HighlightBox/HighlightBox.js +2 -0
  62. package/lib/cjs/components/HighlightBox/HighlightBox.js.map +1 -0
  63. package/lib/cjs/components/HighlightBox/HighlightBox.module.css +1 -0
  64. package/lib/cjs/components/HighlightBox/index.js +2 -0
  65. package/lib/cjs/components/HighlightBox/index.js.map +1 -0
  66. package/lib/cjs/components/HoverCard/HoverCard.js.map +1 -1
  67. package/lib/cjs/components/Icon/Icon.js +1 -1
  68. package/lib/cjs/components/Icon/Icon.js.map +1 -1
  69. package/lib/cjs/components/InfoTip/InfoTip.js +1 -1
  70. package/lib/cjs/components/InfoTip/InfoTip.js.map +1 -1
  71. package/lib/cjs/components/InformationList/InformationList.js +1 -1
  72. package/lib/cjs/components/InformationList/InformationList.js.map +1 -1
  73. package/lib/cjs/components/Layout/AppHeader/AppHeader.js +1 -1
  74. package/lib/cjs/components/Layout/AppHeader/AppHeader.js.map +1 -1
  75. package/lib/cjs/components/Layout/AppHeader/TimeZone.js.map +1 -1
  76. package/lib/cjs/components/Layout/AppHeader/languageSwitch/LanguageSwitch.js.map +1 -1
  77. package/lib/cjs/components/Layout/AppHeader/manual/Manual.js.map +1 -1
  78. package/lib/cjs/components/Layout/AppHeader/themeSwitch/ThemeSwitch.js.map +1 -1
  79. package/lib/cjs/components/Layout/AppHeader/userNav/NavItem.js +1 -1
  80. package/lib/cjs/components/Layout/AppHeader/userNav/NavItem.js.map +1 -1
  81. package/lib/cjs/components/Layout/AppHeader/userNav/UserNav.js.map +1 -1
  82. package/lib/cjs/components/Layout/AppNavigation/AppNavigationLink.js +1 -1
  83. package/lib/cjs/components/Layout/AppNavigation/AppNavigationLink.js.map +1 -1
  84. package/lib/cjs/components/Layout/SimplePageLayout/SimpleGrid.js +1 -1
  85. package/lib/cjs/components/Layout/SimplePageLayout/SimpleGrid.js.map +1 -1
  86. package/lib/cjs/components/Layout/SimplePageLayout/index.js +1 -1
  87. package/lib/cjs/components/Layout/SimplePageLayout/index.js.map +1 -1
  88. package/lib/cjs/components/Modal/Modal.js +1 -1
  89. package/lib/cjs/components/Modal/Modal.js.map +1 -1
  90. package/lib/cjs/components/Notification/notifications.js +1 -1
  91. package/lib/cjs/components/Notification/notifications.js.map +1 -1
  92. package/lib/cjs/components/Table/TableClientSide/TableClientSidePersistent/index.js +1 -1
  93. package/lib/cjs/components/Table/TableClientSide/TableClientSidePersistent/index.js.map +1 -1
  94. package/lib/cjs/components/Table/TableServerSide/TableServerSidePersistent/index.js +1 -1
  95. package/lib/cjs/components/Table/TableServerSide/TableServerSidePersistent/index.js.map +1 -1
  96. package/lib/cjs/components/Table/components/ActionMenu/ActionMenu.js +1 -1
  97. package/lib/cjs/components/Table/components/ActionMenu/ActionMenu.js.map +1 -1
  98. package/lib/cjs/components/Tag/Tag.js +1 -1
  99. package/lib/cjs/components/Tag/Tag.js.map +1 -1
  100. package/lib/cjs/components/TextWithTooltip/TextWithTooltip.js.map +1 -1
  101. package/lib/cjs/components/TimeZoneInfo/index.js +1 -1
  102. package/lib/cjs/components/TimeZoneInfo/index.js.map +1 -1
  103. package/lib/cjs/components/Tooltip/Tooltip.js +1 -1
  104. package/lib/cjs/components/Tooltip/Tooltip.js.map +1 -1
  105. package/lib/cjs/components/Typo/Typo.js +1 -1
  106. package/lib/cjs/components/Typo/Typo.js.map +1 -1
  107. package/lib/cjs/icons/StatusIcon/StatusIcon.js +1 -1
  108. package/lib/cjs/icons/StatusIcon/StatusIcon.js.map +1 -1
  109. package/lib/cjs/index.js +1 -1
  110. package/lib/cjs/index.js.map +1 -1
  111. package/lib/esm/api/error/libs.js.map +1 -1
  112. package/lib/esm/components/Accordion/Accordion.js +1 -1
  113. package/lib/esm/components/Accordion/Accordion.js.map +1 -1
  114. package/lib/esm/components/Alert/Alert.js +1 -1
  115. package/lib/esm/components/Alert/Alert.js.map +1 -1
  116. package/lib/esm/components/Badge/Badge.js.map +1 -1
  117. package/lib/esm/components/BadgeIconHoverCard/BadgeIconHoverCard.js.map +1 -1
  118. package/lib/esm/components/Breadcrumbs/Breadcrumbs.js.map +1 -1
  119. package/lib/esm/components/ConfirmationDialog/ConfirmationDialog.js +1 -1
  120. package/lib/esm/components/ConfirmationDialog/ConfirmationDialog.js.map +1 -1
  121. package/lib/esm/components/DateInline/DateInline.js.map +1 -1
  122. package/lib/esm/components/Drawer/Drawer.js +1 -1
  123. package/lib/esm/components/Drawer/Drawer.js.map +1 -1
  124. package/lib/esm/components/Filter/TermContainer/Term/TermBadge.js +1 -1
  125. package/lib/esm/components/Filter/TermContainer/Term/TermBadge.js.map +1 -1
  126. package/lib/esm/components/Filter/TermContainer/index.js +1 -1
  127. package/lib/esm/components/Filter/TermContainer/index.js.map +1 -1
  128. package/lib/esm/components/Filter/persistence/FilterPersistent.js +1 -1
  129. package/lib/esm/components/Filter/persistence/FilterPersistent.js.map +1 -1
  130. package/lib/esm/components/Filter/utils/FilterSelect.js +1 -1
  131. package/lib/esm/components/Filter/utils/FilterSelect.js.map +1 -1
  132. package/lib/esm/components/Filter/utils/Select.js +1 -1
  133. package/lib/esm/components/Filter/utils/Select.js.map +1 -1
  134. package/lib/esm/components/Form/Button/Button.js +1 -1
  135. package/lib/esm/components/Form/Button/Button.js.map +1 -1
  136. package/lib/esm/components/Form/Checkbox/Checkbox.js +1 -1
  137. package/lib/esm/components/Form/Checkbox/Checkbox.js.map +1 -1
  138. package/lib/esm/components/Form/DateTimePicker/DateTimePicker.js +1 -1
  139. package/lib/esm/components/Form/DateTimePicker/DateTimePicker.js.map +1 -1
  140. package/lib/esm/components/Form/DateTimePicker/TimePicker.js +1 -1
  141. package/lib/esm/components/Form/DateTimePicker/TimePicker.js.map +1 -1
  142. package/lib/esm/components/Form/FileInput/FileInput.js +1 -1
  143. package/lib/esm/components/Form/FileInput/FileInput.js.map +1 -1
  144. package/lib/esm/components/Form/Form/Form.js +1 -1
  145. package/lib/esm/components/Form/Form/Form.js.map +1 -1
  146. package/lib/esm/components/Form/FormItemGroup.js.map +1 -1
  147. package/lib/esm/components/Form/Input/Input.js +1 -1
  148. package/lib/esm/components/Form/Input/Input.js.map +1 -1
  149. package/lib/esm/components/Form/Labels/InfoLabel.js.map +1 -1
  150. package/lib/esm/components/Form/Labels/LabelWithIcon.js.map +1 -1
  151. package/lib/esm/components/Form/MenuButton/index.js +1 -1
  152. package/lib/esm/components/Form/MenuButton/index.js.map +1 -1
  153. package/lib/esm/components/Form/PasswordInput/PasswordInput.js +1 -1
  154. package/lib/esm/components/Form/PasswordInput/PasswordInput.js.map +1 -1
  155. package/lib/esm/components/Form/RadioButton/RadioButton.js +1 -1
  156. package/lib/esm/components/Form/RadioButton/RadioButton.js.map +1 -1
  157. package/lib/esm/components/Form/Select/Cascade/CascadeMenu.js +1 -1
  158. package/lib/esm/components/Form/Select/Cascade/CascadeMenu.js.map +1 -1
  159. package/lib/esm/components/Form/Select/Cascade/CascadeOption.js +1 -1
  160. package/lib/esm/components/Form/Select/Cascade/CascadeOption.js.map +1 -1
  161. package/lib/esm/components/Form/Select/Cascade/index.js +1 -1
  162. package/lib/esm/components/Form/Select/Cascade/index.js.map +1 -1
  163. package/lib/esm/components/Form/Select/CreatableSelect.js +1 -1
  164. package/lib/esm/components/Form/Select/CreatableSelect.js.map +1 -1
  165. package/lib/esm/components/Form/Select/Select.js +1 -1
  166. package/lib/esm/components/Form/Select/Select.js.map +1 -1
  167. package/lib/esm/components/Form/Switch/Switch.js +1 -1
  168. package/lib/esm/components/Form/Switch/Switch.js.map +1 -1
  169. package/lib/esm/components/Form/Textarea/Textarea.js +1 -1
  170. package/lib/esm/components/Form/Textarea/Textarea.js.map +1 -1
  171. package/lib/esm/components/HighlightBox/HighlightBox.js +2 -0
  172. package/lib/esm/components/HighlightBox/HighlightBox.js.map +1 -0
  173. package/lib/esm/components/HighlightBox/HighlightBox.module.css +1 -0
  174. package/lib/esm/components/HighlightBox/index.js +2 -0
  175. package/lib/esm/components/HighlightBox/index.js.map +1 -0
  176. package/lib/esm/components/HoverCard/HoverCard.js.map +1 -1
  177. package/lib/esm/components/Icon/Icon.js +1 -1
  178. package/lib/esm/components/Icon/Icon.js.map +1 -1
  179. package/lib/esm/components/InfoTip/InfoTip.js +1 -1
  180. package/lib/esm/components/InfoTip/InfoTip.js.map +1 -1
  181. package/lib/esm/components/InformationList/InformationList.js +1 -1
  182. package/lib/esm/components/InformationList/InformationList.js.map +1 -1
  183. package/lib/esm/components/Layout/AppHeader/AppHeader.js +1 -1
  184. package/lib/esm/components/Layout/AppHeader/AppHeader.js.map +1 -1
  185. package/lib/esm/components/Layout/AppHeader/TimeZone.js.map +1 -1
  186. package/lib/esm/components/Layout/AppHeader/languageSwitch/LanguageSwitch.js.map +1 -1
  187. package/lib/esm/components/Layout/AppHeader/manual/Manual.js.map +1 -1
  188. package/lib/esm/components/Layout/AppHeader/themeSwitch/ThemeSwitch.js.map +1 -1
  189. package/lib/esm/components/Layout/AppHeader/userNav/NavItem.js +1 -1
  190. package/lib/esm/components/Layout/AppHeader/userNav/NavItem.js.map +1 -1
  191. package/lib/esm/components/Layout/AppHeader/userNav/UserNav.js.map +1 -1
  192. package/lib/esm/components/Layout/AppNavigation/AppNavigationLink.js +1 -1
  193. package/lib/esm/components/Layout/AppNavigation/AppNavigationLink.js.map +1 -1
  194. package/lib/esm/components/Layout/SimplePageLayout/SimpleGrid.js +1 -1
  195. package/lib/esm/components/Layout/SimplePageLayout/SimpleGrid.js.map +1 -1
  196. package/lib/esm/components/Layout/SimplePageLayout/index.js +1 -1
  197. package/lib/esm/components/Layout/SimplePageLayout/index.js.map +1 -1
  198. package/lib/esm/components/Modal/Modal.js +1 -1
  199. package/lib/esm/components/Modal/Modal.js.map +1 -1
  200. package/lib/esm/components/Notification/notifications.js +1 -1
  201. package/lib/esm/components/Notification/notifications.js.map +1 -1
  202. package/lib/esm/components/Table/TableClientSide/TableClientSidePersistent/index.js +1 -1
  203. package/lib/esm/components/Table/TableClientSide/TableClientSidePersistent/index.js.map +1 -1
  204. package/lib/esm/components/Table/TableServerSide/TableServerSidePersistent/index.js +1 -1
  205. package/lib/esm/components/Table/TableServerSide/TableServerSidePersistent/index.js.map +1 -1
  206. package/lib/esm/components/Table/components/ActionMenu/ActionMenu.js +1 -1
  207. package/lib/esm/components/Table/components/ActionMenu/ActionMenu.js.map +1 -1
  208. package/lib/esm/components/Tag/Tag.js +1 -1
  209. package/lib/esm/components/Tag/Tag.js.map +1 -1
  210. package/lib/esm/components/TextWithTooltip/TextWithTooltip.js.map +1 -1
  211. package/lib/esm/components/TimeZoneInfo/index.js +1 -1
  212. package/lib/esm/components/TimeZoneInfo/index.js.map +1 -1
  213. package/lib/esm/components/Tooltip/Tooltip.js +1 -1
  214. package/lib/esm/components/Tooltip/Tooltip.js.map +1 -1
  215. package/lib/esm/components/Typo/Typo.js +1 -1
  216. package/lib/esm/components/Typo/Typo.js.map +1 -1
  217. package/lib/esm/icons/StatusIcon/StatusIcon.js +1 -1
  218. package/lib/esm/icons/StatusIcon/StatusIcon.js.map +1 -1
  219. package/lib/esm/index.js +1 -1
  220. package/lib/esm/index.js.map +1 -1
  221. package/package.json +1 -1
  222. package/types/src/api/error/libs.d.ts.map +1 -1
  223. package/types/src/components/Alert/Alert.d.ts.map +1 -1
  224. package/types/src/components/Badge/Badge.d.ts +0 -1
  225. package/types/src/components/Badge/Badge.d.ts.map +1 -1
  226. package/types/src/components/BadgeIconHoverCard/BadgeIconHoverCard.d.ts.map +1 -1
  227. package/types/src/components/Breadcrumbs/Breadcrumbs.d.ts.map +1 -1
  228. package/types/src/components/DateInline/DateInline.d.ts.map +1 -1
  229. package/types/src/components/Drawer/Drawer.d.ts.map +1 -1
  230. package/types/src/components/Form/Button/Button.d.ts.map +1 -1
  231. package/types/src/components/Form/Checkbox/Checkbox.d.ts.map +1 -1
  232. package/types/src/components/Form/DateTimePicker/DateTimePicker.d.ts.map +1 -1
  233. package/types/src/components/Form/DateTimePicker/TimePicker.d.ts.map +1 -1
  234. package/types/src/components/Form/FileInput/FileInput.d.ts.map +1 -1
  235. package/types/src/components/Form/FormItemGroup.d.ts.map +1 -1
  236. package/types/src/components/Form/Labels/InfoLabel.d.ts.map +1 -1
  237. package/types/src/components/Form/Labels/LabelWithIcon.d.ts.map +1 -1
  238. package/types/src/components/Form/MenuButton/index.d.ts.map +1 -1
  239. package/types/src/components/Form/RadioButton/RadioButton.d.ts.map +1 -1
  240. package/types/src/components/HighlightBox/HighlightBox.d.ts +3 -0
  241. package/types/src/components/HighlightBox/HighlightBox.d.ts.map +1 -0
  242. package/types/src/components/HighlightBox/index.d.ts +2 -0
  243. package/types/src/components/HighlightBox/index.d.ts.map +1 -0
  244. package/types/src/components/HoverCard/HoverCard.d.ts.map +1 -1
  245. package/types/src/components/Icon/Icon.d.ts.map +1 -1
  246. package/types/src/components/InformationList/InformationList.d.ts.map +1 -1
  247. package/types/src/components/Layout/AppHeader/AppHeader.d.ts.map +1 -1
  248. package/types/src/components/Layout/AppHeader/TimeZone.d.ts.map +1 -1
  249. package/types/src/components/Layout/AppHeader/languageSwitch/LanguageSwitch.d.ts.map +1 -1
  250. package/types/src/components/Layout/AppHeader/manual/Manual.d.ts.map +1 -1
  251. package/types/src/components/Layout/AppHeader/themeSwitch/ThemeSwitch.d.ts.map +1 -1
  252. package/types/src/components/Layout/AppHeader/userNav/NavItem.d.ts.map +1 -1
  253. package/types/src/components/Layout/AppHeader/userNav/UserNav.d.ts.map +1 -1
  254. package/types/src/index.d.ts +1 -0
  255. package/types/src/index.d.ts.map +1 -1
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:true});function _export(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:true,get:Object.getOwnPropertyDescriptor(all,name).get})}_export(exports,{get FormPasswordInput(){return FormPasswordInput},get PasswordInput(){return PasswordInput}});const _jsxruntime=require("react/jsx-runtime");const _core=require("@mantine/core");const _sharedStyles=require("../sharedStyles");const _react=/*#__PURE__*/_interop_require_wildcard(require("react"));const _Form=require("../Form");const _FormErrors=require("../Form/FormErrors");const _lucidereact=require("lucide-react");const _PasswordInputmodulecss=/*#__PURE__*/_interop_require_default(require("./PasswordInput.module.css"));const _theme=require("../../../theme");function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap;var cacheNodeInterop=new WeakMap;return(_getRequireWildcardCache=function(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop})(nodeInterop)}function _interop_require_wildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj}}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj)}var newObj={__proto__:null};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc)}else{newObj[key]=obj[key]}}}newObj.default=obj;if(cache){cache.set(obj,newObj)}return newObj}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}const useStyles=()=>{const defaultStyles=(0,_sharedStyles.getDefaultFormStyles)();return _object_spread_props(_object_spread({innerInput:_PasswordInputmodulecss.default["inner-input"]},defaultStyles),{root:`${defaultStyles.root} ${_PasswordInputmodulecss.default.root}`})};const PasswordToggleIcon=props=>{const theme=(0,_core.useMantineTheme)();const Icon=props.reveal?_lucidereact.Eye:_lucidereact.EyeOff;return(0,_jsxruntime.jsx)(Icon,{size:_theme.ICON_SIZES.MEDIUM,color:theme.colors.gray[5]})};const PasswordInputRaw=(_param,ref)=>{var{size="md"}=_param,props=_object_without_properties(_param,["size"]);const classes=useStyles();return(0,_jsxruntime.jsx)(_core.PasswordInput,_object_spread({ref:ref,classNames:{root:classes.root,label:classes.label,input:classes.input,innerInput:classes.innerInput,error:classes.error},size:size,visibilityToggleIcon:PasswordToggleIcon},props))};const PasswordInput=(0,_react.forwardRef)(PasswordInputRaw);PasswordInput.displayName="PasswordInput";const FormPasswordInput=_param=>{var{name,validation={},min,max,minLength,maxLength}=_param,inputProps=_object_without_properties(_param,["name","validation","min","max","minLength","maxLength"]);const{register,formState}=(0,_Form.useFormContext)();const errorContext=(0,_Form.useErrorContext)();const formError=formState.errors[name];const fetchErrors=errorContext.errors[name];const errors=[formError===null||formError===void 0?void 0:formError.message,fetchErrors].flat().filter(ent=>ent);return(0,_jsxruntime.jsx)(PasswordInput,_object_spread_props(_object_spread({},inputProps,register(name,{validate:validation,min,max,minLength,maxLength})),{error:errors.length>0&&(0,_jsxruntime.jsx)(_FormErrors.FormErrors,{errors:errors})}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:true});function _export(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:true,get:Object.getOwnPropertyDescriptor(all,name).get})}_export(exports,{get FormPasswordInput(){return FormPasswordInput},get PasswordInput(){return PasswordInput}});const _jsxruntime=require("react/jsx-runtime");const _core=require("@mantine/core");const _sharedStyles=require("../sharedStyles");const _react=/*#__PURE__*/_interop_require_wildcard(require("react"));const _Form=require("../Form");const _FormErrors=require("../Form/FormErrors");const _lucidereact=require("lucide-react");const _PasswordInputmodulecss=/*#__PURE__*/_interop_require_default(require("./PasswordInput.module.css"));const _theme=require("../../../theme");function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap;var cacheNodeInterop=new WeakMap;return(_getRequireWildcardCache=function(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop})(nodeInterop)}function _interop_require_wildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj}}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj)}var newObj={__proto__:null};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc)}else{newObj[key]=obj[key]}}}newObj.default=obj;if(cache){cache.set(obj,newObj)}return newObj}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target={},sourceKeys,key,i;if(typeof Reflect!=="undefined"&&Reflect.ownKeys){sourceKeys=Reflect.ownKeys(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}target=_object_without_properties_loose(source,excluded);if(Object.getOwnPropertySymbols){sourceKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.getOwnPropertyNames(source),key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}const useStyles=()=>{const defaultStyles=(0,_sharedStyles.getDefaultFormStyles)();return _object_spread_props(_object_spread({innerInput:_PasswordInputmodulecss.default["inner-input"]},defaultStyles),{root:`${defaultStyles.root} ${_PasswordInputmodulecss.default.root}`})};const PasswordToggleIcon=props=>{const theme=(0,_core.useMantineTheme)();const Icon=props.reveal?_lucidereact.Eye:_lucidereact.EyeOff;return(0,_jsxruntime.jsx)(Icon,{size:_theme.ICON_SIZES.MEDIUM,color:theme.colors.gray[5]})};const PasswordInputRaw=(_0,_1)=>{let _ref=[_0,_1],[_ref1,..._rest]=_ref,{size="md"}=_ref1,props=_object_without_properties(_ref1,["size"]),[ref]=_rest;const classes=useStyles();return(0,_jsxruntime.jsx)(_core.PasswordInput,_object_spread({ref:ref,classNames:{root:classes.root,label:classes.label,input:classes.input,innerInput:classes.innerInput,error:classes.error},size:size,visibilityToggleIcon:PasswordToggleIcon},props))};const PasswordInput=(0,_react.forwardRef)(PasswordInputRaw);PasswordInput.displayName="PasswordInput";const FormPasswordInput=_0=>{let{name,validation={},min,max,minLength,maxLength}=_0,inputProps=_object_without_properties(_0,["name","validation","min","max","minLength","maxLength"]);const{register,formState}=(0,_Form.useFormContext)();const errorContext=(0,_Form.useErrorContext)();const formError=formState.errors[name];const fetchErrors=errorContext.errors[name];const errors=[formError===null||formError===void 0?void 0:formError.message,fetchErrors].flat().filter(ent=>ent);return(0,_jsxruntime.jsx)(PasswordInput,_object_spread_props(_object_spread({},inputProps,register(name,{validate:validation,min,max,minLength,maxLength})),{error:errors.length>0&&(0,_jsxruntime.jsx)(_FormErrors.FormErrors,{errors:errors})}))};
2
2
  //# sourceMappingURL=PasswordInput.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/Form/PasswordInput/PasswordInput.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport {\n PasswordInput as PasswordInputMantine,\n PasswordInputProps,\n MantineSize,\n useMantineTheme,\n} from \"@mantine/core\"\nimport { getDefaultFormStyles } from \"../sharedStyles\"\nimport React, { ForwardedRef, forwardRef } from \"react\"\nimport { TFormControl } from \"../Form\"\nimport { useErrorContext, useFormContext } from \"../Form\"\nimport { FormErrors } from \"../Form/FormErrors\"\nimport { Eye, EyeOff } from \"lucide-react\"\nimport classes from \"./PasswordInput.module.css\"\nimport { ICON_SIZES } from \"../../../theme\"\n\nconst useStyles = () => {\n const defaultStyles = getDefaultFormStyles()\n return {\n innerInput: classes[\"inner-input\"],\n ...defaultStyles,\n root: `${defaultStyles.root} ${classes.root}`,\n }\n}\n\ntype TInput = Modify<\n PasswordInputProps,\n {\n size?: MantineSize\n }\n>\n\nconst PasswordToggleIcon = (props: { reveal?: boolean }) => {\n const theme = useMantineTheme()\n const Icon = props.reveal ? Eye : EyeOff\n\n return <Icon size={ICON_SIZES.MEDIUM} color={theme.colors.gray[5]} />\n}\n\nconst PasswordInputRaw = (\n { size = \"md\", ...props }: TInput,\n ref?: ForwardedRef<HTMLInputElement>\n) => {\n const classes = useStyles()\n\n return (\n <PasswordInputMantine\n ref={ref}\n classNames={{\n root: classes.root,\n label: classes.label,\n input: classes.input,\n innerInput: classes.innerInput,\n error: classes.error,\n }}\n size={size}\n visibilityToggleIcon={PasswordToggleIcon}\n {...props}\n />\n )\n}\n\nconst PasswordInput = forwardRef(PasswordInputRaw)\nPasswordInput.displayName = \"PasswordInput\"\nexport { PasswordInput }\n\n/**\n * **Form** wrapper for a PasswordInput component that automagically registers the input to the current form context (from **Form**).\n * It also connects to the error-context from **ConnectedForm** to show server-side validation errors.\n * @param name Name of the input\n * @param validation Validation rules for this field's client-side validation\n * @param min Quick validation for numbers\n * @param max Quick validation for numbers\n * @param minLength Quick validation for strings\n * @param maxLength Quick validation for strings\n * @param inputProps Props passed to input component\n */\nexport const FormPasswordInput: React.FC<TInput & TFormControl<HTMLInputElement>> = ({\n name,\n validation = {},\n min,\n max,\n minLength,\n maxLength,\n ...inputProps\n}) => {\n const { register, formState } = useFormContext()\n const errorContext = useErrorContext()\n const formError = formState.errors[name]\n const fetchErrors = errorContext.errors[name]\n const errors = [formError?.message as string, fetchErrors].flat().filter((ent) => ent)\n\n return (\n <PasswordInput\n {...inputProps}\n {...register(name, {\n validate: validation,\n min,\n max,\n minLength,\n maxLength,\n })}\n error={errors.length > 0 && <FormErrors errors={errors} />}\n />\n )\n}\n"],"names":["FormPasswordInput","PasswordInput","useStyles","defaultStyles","getDefaultFormStyles","innerInput","classes","root","PasswordToggleIcon","props","theme","useMantineTheme","Icon","reveal","Eye","EyeOff","size","ICON_SIZES","MEDIUM","color","colors","gray","PasswordInputRaw","ref","PasswordInputMantine","classNames","label","input","error","visibilityToggleIcon","forwardRef","displayName","name","validation","min","max","minLength","maxLength","inputProps","register","formState","useFormContext","errorContext","useErrorContext","formError","errors","fetchErrors","message","flat","filter","ent","validate","length","FormErrors"],"mappings":"mPAgFaA,2BAAAA,uBAbJC,uBAAAA,oFA1DF,6CAC8B,+EACW,8BAEA,qCACrB,iDACC,4FACR,oDACO,6/FAE3B,MAAMC,UAAY,KAChB,MAAMC,cAAgBC,GAAAA,kCAAoB,IAC1C,OAAO,qCACLC,WAAYC,+BAAO,CAAC,cAAc,EAC/BH,gBACHI,KAAM,CAAC,EAAEJ,cAAcI,IAAI,CAAC,CAAC,EAAED,+BAAO,CAACC,IAAI,CAAC,CAAC,EAEjD,EASA,MAAMC,mBAAqB,AAACC,QAC1B,MAAMC,MAAQC,GAAAA,qBAAe,IAC7B,MAAMC,KAAOH,MAAMI,MAAM,CAAGC,gBAAG,CAAGC,mBAAM,CAExC,MAAO,oBAACH,MAAKI,KAAMC,iBAAU,CAACC,MAAM,CAAEC,MAAOT,MAAMU,MAAM,CAACC,IAAI,CAAC,EAAE,EACnE,EAEA,MAAMC,iBAAmB,QAEvBC,UADA,CAAEP,KAAO,IAAI,CAAoB,QAAfP,yCAAhBO,SAGF,MAAMV,QAAUJ,YAEhB,MACE,oBAACsB,mBAAoB,iBACnBD,IAAKA,IACLE,WAAY,CACVlB,KAAMD,QAAQC,IAAI,CAClBmB,MAAOpB,QAAQoB,KAAK,CACpBC,MAAOrB,QAAQqB,KAAK,CACpBtB,WAAYC,QAAQD,UAAU,CAC9BuB,MAAOtB,QAAQsB,KAAK,AACtB,EACAZ,KAAMA,KACNa,qBAAsBrB,oBAClBC,OAGV,EAEA,MAAMR,cAAgB6B,GAAAA,iBAAU,EAACR,iBACjCrB,CAAAA,cAAc8B,WAAW,CAAG,gBAcrB,MAAM/B,kBAAuE,YAAC,CACnFgC,IAAI,CACJC,WAAa,CAAC,CAAC,CACfC,GAAG,CACHC,GAAG,CACHC,SAAS,CACTC,SAAS,CAEV,QADIC,8CANHN,OACAC,aACAC,MACAC,MACAC,YACAC,cAGA,KAAM,CAAEE,QAAQ,CAAEC,SAAS,CAAE,CAAGC,GAAAA,oBAAc,IAC9C,MAAMC,aAAeC,GAAAA,qBAAe,IACpC,MAAMC,UAAYJ,UAAUK,MAAM,CAACb,KAAK,CACxC,MAAMc,YAAcJ,aAAaG,MAAM,CAACb,KAAK,CAC7C,MAAMa,OAAS,CAACD,kBAAAA,0BAAAA,UAAWG,OAAO,CAAYD,YAAY,CAACE,IAAI,GAAGC,MAAM,CAAC,AAACC,KAAQA,KAElF,MACE,oBAACjD,qDACKqC,WACAC,SAASP,KAAM,CACjBmB,SAAUlB,WACVC,IACAC,IACAC,UACAC,SACF,KACAT,MAAOiB,OAAOO,MAAM,CAAG,GAAK,oBAACC,sBAAU,EAACR,OAAQA,WAGtD"}
1
+ {"version":3,"sources":["../../../../../src/components/Form/PasswordInput/PasswordInput.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport {\n PasswordInput as PasswordInputMantine,\n PasswordInputProps,\n MantineSize,\n useMantineTheme,\n} from \"@mantine/core\"\nimport { getDefaultFormStyles } from \"../sharedStyles\"\nimport React, { ForwardedRef, forwardRef } from \"react\"\nimport { TFormControl } from \"../Form\"\nimport { useErrorContext, useFormContext } from \"../Form\"\nimport { FormErrors } from \"../Form/FormErrors\"\nimport { Eye, EyeOff } from \"lucide-react\"\nimport classes from \"./PasswordInput.module.css\"\nimport { ICON_SIZES } from \"../../../theme\"\n\nconst useStyles = () => {\n const defaultStyles = getDefaultFormStyles()\n return {\n innerInput: classes[\"inner-input\"],\n ...defaultStyles,\n root: `${defaultStyles.root} ${classes.root}`,\n }\n}\n\ntype TInput = Modify<\n PasswordInputProps,\n {\n size?: MantineSize\n }\n>\n\nconst PasswordToggleIcon = (props: { reveal?: boolean }) => {\n const theme = useMantineTheme()\n const Icon = props.reveal ? Eye : EyeOff\n\n return <Icon size={ICON_SIZES.MEDIUM} color={theme.colors.gray[5]} />\n}\n\nconst PasswordInputRaw = (\n { size = \"md\", ...props }: TInput,\n ref?: ForwardedRef<HTMLInputElement>\n) => {\n const classes = useStyles()\n\n return (\n <PasswordInputMantine\n ref={ref}\n classNames={{\n root: classes.root,\n label: classes.label,\n input: classes.input,\n innerInput: classes.innerInput,\n error: classes.error,\n }}\n size={size}\n visibilityToggleIcon={PasswordToggleIcon}\n {...props}\n />\n )\n}\n\nconst PasswordInput = forwardRef(PasswordInputRaw)\nPasswordInput.displayName = \"PasswordInput\"\nexport { PasswordInput }\n\n/**\n * **Form** wrapper for a PasswordInput component that automagically registers the input to the current form context (from **Form**).\n * It also connects to the error-context from **ConnectedForm** to show server-side validation errors.\n * @param name Name of the input\n * @param validation Validation rules for this field's client-side validation\n * @param min Quick validation for numbers\n * @param max Quick validation for numbers\n * @param minLength Quick validation for strings\n * @param maxLength Quick validation for strings\n * @param inputProps Props passed to input component\n */\nexport const FormPasswordInput: React.FC<TInput & TFormControl<HTMLInputElement>> = ({\n name,\n validation = {},\n min,\n max,\n minLength,\n maxLength,\n ...inputProps\n}) => {\n const { register, formState } = useFormContext()\n const errorContext = useErrorContext()\n const formError = formState.errors[name]\n const fetchErrors = errorContext.errors[name]\n const errors = [formError?.message as string, fetchErrors].flat().filter((ent) => ent)\n\n return (\n <PasswordInput\n {...inputProps}\n {...register(name, {\n validate: validation,\n min,\n max,\n minLength,\n maxLength,\n })}\n error={errors.length > 0 && <FormErrors errors={errors} />}\n />\n )\n}\n"],"names":["FormPasswordInput","PasswordInput","useStyles","defaultStyles","getDefaultFormStyles","innerInput","classes","root","PasswordToggleIcon","props","theme","useMantineTheme","Icon","reveal","Eye","EyeOff","size","ICON_SIZES","MEDIUM","color","colors","gray","PasswordInputRaw","ref","PasswordInputMantine","classNames","label","input","error","visibilityToggleIcon","forwardRef","displayName","name","validation","min","max","minLength","maxLength","inputProps","register","formState","useFormContext","errorContext","useErrorContext","formError","errors","fetchErrors","message","flat","filter","ent","validate","length","FormErrors"],"mappings":"mPAgFaA,2BAAAA,uBAbJC,uBAAAA,oFA1DF,6CAC8B,+EACW,8BAEA,qCACrB,iDACC,4FACR,oDACO,01GAE3B,MAAMC,UAAY,KAChB,MAAMC,cAAgBC,GAAAA,kCAAoB,IAC1C,OAAO,qCACLC,WAAYC,+BAAO,CAAC,cAAc,EAC/BH,gBACHI,KAAM,CAAC,EAAEJ,cAAcI,IAAI,CAAC,CAAC,EAAED,+BAAO,CAACC,IAAI,CAAC,CAAC,EAEjD,EASA,MAAMC,mBAAqB,AAACC,QAC1B,MAAMC,MAAQC,GAAAA,qBAAe,IAC7B,MAAMC,KAAOH,MAAMI,MAAM,CAAGC,gBAAG,CAAGC,mBAAM,CAExC,MAAO,oBAACH,MAAKI,KAAMC,iBAAU,CAACC,MAAM,CAAEC,MAAOT,MAAMU,MAAM,CAACC,IAAI,CAAC,EAAE,EACnE,EAEA,MAAMC,iBAAmB,iDACvB,CAAEN,KAAO,IAAI,CAAoB,OAAfP,kDAClBc,WAEA,MAAMjB,QAAUJ,YAEhB,MACE,oBAACsB,mBAAoB,iBACnBD,IAAKA,IACLE,WAAY,CACVlB,KAAMD,QAAQC,IAAI,CAClBmB,MAAOpB,QAAQoB,KAAK,CACpBC,MAAOrB,QAAQqB,KAAK,CACpBtB,WAAYC,QAAQD,UAAU,CAC9BuB,MAAOtB,QAAQsB,KAAK,AACtB,EACAZ,KAAMA,KACNa,qBAAsBrB,oBAClBC,OAGV,EAEA,MAAMR,cAAgB6B,GAAAA,iBAAU,EAACR,iBACjCrB,CAAAA,cAAc8B,WAAW,CAAG,gBAcrB,MAAM/B,kBAAuE,QAAC,CACnFgC,IAAI,CACJC,WAAa,CAAC,CAAC,CACfC,GAAG,CACHC,GAAG,CACHC,SAAS,CACTC,SAAS,CAEV,IADIC,oGAEH,KAAM,CAAEC,QAAQ,CAAEC,SAAS,CAAE,CAAGC,GAAAA,oBAAc,IAC9C,MAAMC,aAAeC,GAAAA,qBAAe,IACpC,MAAMC,UAAYJ,UAAUK,MAAM,CAACb,KAAK,CACxC,MAAMc,YAAcJ,aAAaG,MAAM,CAACb,KAAK,CAC7C,MAAMa,OAAS,CAACD,kBAAAA,0BAAAA,UAAWG,OAAO,CAAYD,YAAY,CAACE,IAAI,GAAGC,MAAM,CAAC,AAACC,KAAQA,KAElF,MACE,oBAACjD,qDACKqC,WACAC,SAASP,KAAM,CACjBmB,SAAUlB,WACVC,IACAC,IACAC,UACAC,SACF,KACAT,MAAOiB,OAAOO,MAAM,CAAG,GAAK,oBAACC,sBAAU,EAACR,OAAQA,WAGtD"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:true});function _export(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:true,get:Object.getOwnPropertyDescriptor(all,name).get})}_export(exports,{get FormRadioButton(){return FormRadioButton},get RadioButton(){return RadioButton}});const _jsxruntime=require("react/jsx-runtime");const _core=require("@mantine/core");const _sharedStyles=require("../sharedStyles");const _Form=require("../Form/Form");const _react=/*#__PURE__*/_interop_require_wildcard(require("react"));const _RadioButtonmodulecss=/*#__PURE__*/_interop_require_default(require("./RadioButton.module.css"));function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key]}}}return target};return _extends.apply(this,arguments)}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap;var cacheNodeInterop=new WeakMap;return(_getRequireWildcardCache=function(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop})(nodeInterop)}function _interop_require_wildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj}}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj)}var newObj={__proto__:null};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc)}else{newObj[key]=obj[key]}}}newObj.default=obj;if(cache){cache.set(obj,newObj)}return newObj}function _object_destructuring_empty(o){if(o===null||o===void 0)throw new TypeError("Cannot destructure "+o);return o}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}const useStyles=()=>{const defaultFormStyles=(0,_sharedStyles.getDefaultFormStyles)();return _object_spread_props(_object_spread({},defaultFormStyles),{label:`${defaultFormStyles.label} ${_RadioButtonmodulecss.default.label}`})};const RadioButton=(0,_react.forwardRef)((_param,ref)=>{var props=_extends({},_object_destructuring_empty(_param));const classes=useStyles();return(0,_jsxruntime.jsx)(_core.Radio,_object_spread({ref:ref,classNames:_object_spread({root:classes.root,label:classes.label},props.classNames)},props))});const FormRadioButton=_param=>{var{name}=_param,props=_object_without_properties(_param,["name"]);const{register}=(0,_Form.useFormContext)();return(0,_jsxruntime.jsx)(RadioButton,_object_spread({},props,register(name)))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:true});function _export(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:true,get:Object.getOwnPropertyDescriptor(all,name).get})}_export(exports,{get FormRadioButton(){return FormRadioButton},get RadioButton(){return RadioButton}});const _jsxruntime=require("react/jsx-runtime");const _core=require("@mantine/core");const _sharedStyles=require("../sharedStyles");const _Form=require("../Form/Form");const _react=/*#__PURE__*/_interop_require_wildcard(require("react"));const _RadioButtonmodulecss=/*#__PURE__*/_interop_require_default(require("./RadioButton.module.css"));function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key]}}}return target};return _extends.apply(this,arguments)}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap;var cacheNodeInterop=new WeakMap;return(_getRequireWildcardCache=function(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop})(nodeInterop)}function _interop_require_wildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj}}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj)}var newObj={__proto__:null};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc)}else{newObj[key]=obj[key]}}}newObj.default=obj;if(cache){cache.set(obj,newObj)}return newObj}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target={},sourceKeys,key,i;if(typeof Reflect!=="undefined"&&Reflect.ownKeys){sourceKeys=Reflect.ownKeys(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}target=_object_without_properties_loose(source,excluded);if(Object.getOwnPropertySymbols){sourceKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.getOwnPropertyNames(source),key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}const useStyles=()=>{const defaultFormStyles=(0,_sharedStyles.getDefaultFormStyles)();return _object_spread_props(_object_spread({},defaultFormStyles),{label:`${defaultFormStyles.label} ${_RadioButtonmodulecss.default.label}`})};const RadioButton=(0,_react.forwardRef)((_0,_1)=>{let _ref=[_0,_1],[_ref1,..._rest]=_ref,{}=_ref1,props=_extends({},_ref1),[ref]=_rest;const classes=useStyles();return(0,_jsxruntime.jsx)(_core.Radio,_object_spread({ref:ref,classNames:_object_spread({root:classes.root,label:classes.label},props.classNames)},props))});const FormRadioButton=_0=>{let{name}=_0,props=_object_without_properties(_0,["name"]);const{register}=(0,_Form.useFormContext)();return(0,_jsxruntime.jsx)(RadioButton,_object_spread({},props,register(name)))};
2
2
  //# sourceMappingURL=RadioButton.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/Form/RadioButton/RadioButton.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport { Radio, RadioProps } from \"@mantine/core\"\nimport { getDefaultFormStyles } from \"../sharedStyles\"\nimport { useFormContext } from \"../Form/Form\"\nimport { TFormControl } from \"../Form/types\"\nimport React, { forwardRef } from \"react\"\nimport classes from \"./RadioButton.module.css\"\n\nconst useStyles = () => {\n const defaultFormStyles = getDefaultFormStyles()\n return {\n ...defaultFormStyles,\n label: `${defaultFormStyles.label} ${classes.label}`,\n }\n}\n\n// eslint-disable-next-line react/display-name\nexport const RadioButton = forwardRef<HTMLInputElement, RadioProps>(({ ...props }, ref) => {\n const classes = useStyles()\n return (\n <Radio\n ref={ref}\n classNames={{\n root: classes.root,\n label: classes.label,\n ...props.classNames,\n }}\n {...props}\n />\n )\n})\n\nexport const FormRadioButton: React.FC<RadioProps & TFormControl<HTMLInputElement>> = ({\n name,\n ...props\n}) => {\n const { register } = useFormContext()\n\n return <RadioButton {...props} {...register(name)} />\n}\n"],"names":["FormRadioButton","RadioButton","useStyles","defaultFormStyles","getDefaultFormStyles","label","classes","forwardRef","ref","props","Radio","classNames","root","name","register","useFormContext"],"mappings":"mPAmCaA,yBAAAA,qBAfAC,qBAAAA,kFAhBqB,6CACG,uCACN,4EAEG,oFACd,k5GAEpB,MAAMC,UAAY,KAChB,MAAMC,kBAAoBC,GAAAA,kCAAoB,IAC9C,OAAO,uCACFD,oBACHE,MAAO,CAAC,EAAEF,kBAAkBE,KAAK,CAAC,CAAC,EAAEC,6BAAO,CAACD,KAAK,CAAC,CAAC,EAExD,EAGO,MAAMJ,YAAcM,GAAAA,iBAAU,EAA+B,QAAeC,WAATC,uDACxE,MAAMH,QAAUJ,YAChB,MACE,oBAACQ,WAAK,iBACJF,IAAKA,IACLG,WAAY,gBACVC,KAAMN,QAAQM,IAAI,CAClBP,MAAOC,QAAQD,KAAK,EACjBI,MAAME,UAAU,GAEjBF,OAGV,GAEO,MAAMT,gBAAyE,YAAC,CACrFa,IAAI,CAEL,QADIJ,yCADHI,SAGA,KAAM,CAAEC,QAAQ,CAAE,CAAGC,GAAAA,oBAAc,IAEnC,MAAO,oBAACd,8BAAgBQ,MAAWK,SAASD,OAC9C"}
1
+ {"version":3,"sources":["../../../../../src/components/Form/RadioButton/RadioButton.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport { Radio, RadioProps } from \"@mantine/core\"\nimport { getDefaultFormStyles } from \"../sharedStyles\"\nimport { useFormContext } from \"../Form/Form\"\nimport { TFormControl } from \"../Form/types\"\nimport React, { forwardRef } from \"react\"\nimport classes from \"./RadioButton.module.css\"\n\nconst useStyles = () => {\n const defaultFormStyles = getDefaultFormStyles()\n return {\n ...defaultFormStyles,\n label: `${defaultFormStyles.label} ${classes.label}`,\n }\n}\n\n/**\n * Provides a RadioButton\n * @param props Additional props as defined by Mantine\n */\n// eslint-disable-next-line react/display-name\nexport const RadioButton = forwardRef<HTMLInputElement, RadioProps>(({ ...props }, ref) => {\n const classes = useStyles()\n return (\n <Radio\n ref={ref}\n classNames={{\n root: classes.root,\n label: classes.label,\n ...props.classNames,\n }}\n {...props}\n />\n )\n})\n/**\n * **Form** wrapper for a RadioButton component that automagically registers the input to the current form context (from **Form**).\n * @param name Name of the input as identification in the form\n * @param props Additional props as defined by Mantine to be used in RadioButton\n */\nexport const FormRadioButton: React.FC<RadioProps & TFormControl<HTMLInputElement>> = ({\n name,\n ...props\n}) => {\n const { register } = useFormContext()\n\n return <RadioButton {...props} {...register(name)} />\n}\n"],"names":["FormRadioButton","RadioButton","useStyles","defaultFormStyles","getDefaultFormStyles","label","classes","forwardRef","props","ref","Radio","classNames","root","name","register","useFormContext"],"mappings":"mPA2CaA,yBAAAA,qBAnBAC,qBAAAA,kFApBqB,6CACG,uCACN,4EAEG,oFACd,ynHAEpB,MAAMC,UAAY,KAChB,MAAMC,kBAAoBC,GAAAA,kCAAoB,IAC9C,OAAO,uCACFD,oBACHE,MAAO,CAAC,EAAEF,kBAAkBE,KAAK,CAAC,CAAC,EAAEC,6BAAO,CAACD,KAAK,CAAC,CAAC,EAExD,EAOO,MAAMJ,YAAcM,GAAAA,iBAAU,EAA+B,iDAAC,EAAY,OAAPC,0BAASC,WACjF,MAAMH,QAAUJ,YAChB,MACE,oBAACQ,WAAK,iBACJD,IAAKA,IACLE,WAAY,gBACVC,KAAMN,QAAQM,IAAI,CAClBP,MAAOC,QAAQD,KAAK,EACjBG,MAAMG,UAAU,GAEjBH,OAGV,GAMO,MAAMR,gBAAyE,QAAC,CACrFa,IAAI,CAEL,IADIL,8CAEH,KAAM,CAAEM,QAAQ,CAAE,CAAGC,GAAAA,oBAAc,IAEnC,MAAO,oBAACd,8BAAgBO,MAAWM,SAASD,OAC9C"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:true});function _export(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:true,get:Object.getOwnPropertyDescriptor(all,name).get})}_export(exports,{get CascadeMenuBase(){return CascadeMenuBase},get CascadeMenuBaseRaw(){return CascadeMenuBaseRaw},get CascadeMenuOpener(){return CascadeMenuOpener},get CascadeMenuOpenerRaw(){return CascadeMenuOpenerRaw}});const _jsxruntime=require("react/jsx-runtime");const _react=require("react");const _reactdom=require("react-dom");const _reactselect=require("react-select");const _CascadeOption=require("./CascadeOption");const _CascadeMenumodulecss=/*#__PURE__*/_interop_require_default(require("./CascadeMenu.module.css"));const _cx=require("../../../../helper/cx");function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}function shouldIncreasePaddingBecauseOfScrollbarBehaviourBasedOnBrowser(){if((navigator.userAgent.indexOf("Opera")||navigator.userAgent.indexOf("OPR"))!=-1){return true}else if(navigator.userAgent.indexOf("Edg")!=-1){return true}else if(navigator.userAgent.indexOf("Chrome")!=-1){return true}else if(navigator.userAgent.indexOf("Safari")!=-1){return false}else if(navigator.userAgent.indexOf("Firefox")!=-1){return false}else if(navigator.userAgent.indexOf("MSIE")!=-1||!!document.documentMode){return true}else{return false}}function CascadeMenuBaseRaw(_param,ref){var{isInitiallyOpen,openerMenuRef}=_param,props=_object_without_properties(_param,["isInitiallyOpen","openerMenuRef"]);var _props_openerOptionNode,_props_menuPortalTarget,_props_openerOptionNode1,_props_index;const innerMenuRef=(0,_react.useRef)(null);const[open,setOpen]=(0,_react.useState)(isInitiallyOpen||false);const showScrollbar=value=>{if(innerMenuRef.current){innerMenuRef.current.style.overflowY=value?"auto":"hidden"}};const handleMouseExit=()=>{showScrollbar(false);props.setFocusList([])};const handleMouseEnter=()=>{showScrollbar(true)};let isScrolling=false;const handleScroll=()=>{if(isScrolling)return;for(const node of props.nodes){var _node_cascadeOptionForwardRef_current;(_node_cascadeOptionForwardRef_current=node.cascadeOptionForwardRef.current)===null||_node_cascadeOptionForwardRef_current===void 0?void 0:_node_cascadeOptionForwardRef_current.setFocused(false)}isScrolling=true};const handleScrollEnd=()=>{isScrolling=false};(0,_react.useEffect)(()=>{var _innerMenuRef_current,_innerMenuRef_current1,_innerMenuRef_current2,_innerMenuRef_current3;(_innerMenuRef_current=innerMenuRef.current)===null||_innerMenuRef_current===void 0?void 0:_innerMenuRef_current.addEventListener("mouseleave",handleMouseExit);(_innerMenuRef_current1=innerMenuRef.current)===null||_innerMenuRef_current1===void 0?void 0:_innerMenuRef_current1.addEventListener("mouseenter",handleMouseEnter);(_innerMenuRef_current2=innerMenuRef.current)===null||_innerMenuRef_current2===void 0?void 0:_innerMenuRef_current2.addEventListener("wheel",handleScroll);(_innerMenuRef_current3=innerMenuRef.current)===null||_innerMenuRef_current3===void 0?void 0:_innerMenuRef_current3.addEventListener("scrollend",handleScrollEnd);return()=>{var _innerMenuRef_current,_innerMenuRef_current1,_innerMenuRef_current2,_innerMenuRef_current3;(_innerMenuRef_current=innerMenuRef.current)===null||_innerMenuRef_current===void 0?void 0:_innerMenuRef_current.removeEventListener("mouseleave",handleMouseExit);(_innerMenuRef_current1=innerMenuRef.current)===null||_innerMenuRef_current1===void 0?void 0:_innerMenuRef_current1.removeEventListener("mouseenter",handleMouseEnter);(_innerMenuRef_current2=innerMenuRef.current)===null||_innerMenuRef_current2===void 0?void 0:_innerMenuRef_current2.removeEventListener("wheel",handleScroll);(_innerMenuRef_current3=innerMenuRef.current)===null||_innerMenuRef_current3===void 0?void 0:_innerMenuRef_current3.removeEventListener("scrollend",handleScrollEnd)}},[]);const setMenuOpen=value=>{setOpen(value)};(0,_react.useImperativeHandle)(ref,()=>({setOpen:value=>setMenuOpen(value)}));const relocateMenu=()=>{var _props_openerOptionNode,_refable_current,_props_openerOptionNode1,_props_openerOptionNode2,_document_scrollingElement;const refable=props.openerOptionNode?(_props_openerOptionNode=props.openerOptionNode)===null||_props_openerOptionNode===void 0?void 0:_props_openerOptionNode.elementRef:props.openerOptionElementRef;const rect=refable===null||refable===void 0?void 0:(_refable_current=refable.current)===null||_refable_current===void 0?void 0:_refable_current.getBoundingClientRect();if(!rect){return}const isScrollable=openerMenuRef&&openerMenuRef.current&&openerMenuRef.current.offsetHeight<openerMenuRef.current.scrollHeight;const xOffset=shouldIncreasePaddingBecauseOfScrollbarBehaviourBasedOnBrowser()&&isScrollable?7:0;const width=((_props_openerOptionNode1=props.openerOptionNode)===null||_props_openerOptionNode1===void 0?void 0:_props_openerOptionNode1.level)?rect.width+xOffset:0;const height=((_props_openerOptionNode2=props.openerOptionNode)===null||_props_openerOptionNode2===void 0?void 0:_props_openerOptionNode2.level)?-8:rect.height;updatePosition(rect.top+height+(((_document_scrollingElement=document.scrollingElement)===null||_document_scrollingElement===void 0?void 0:_document_scrollingElement.scrollTop)||0),rect.left+width)};(0,_react.useEffect)(()=>{relocateMenu()});const updatePosition=(yPixel,xPixel)=>{if(!innerMenuRef.current)return;innerMenuRef.current.style.top=yPixel+"px";innerMenuRef.current.style.left=xPixel+"px"};return(0,_jsxruntime.jsx)(_jsxruntime.Fragment,{children:(0,_jsxruntime.jsx)("div",{className:(0,_cx.cx)(_CascadeMenumodulecss.default["menu-container"]),"data-testid":`cascade-menu-for-${((_props_openerOptionNode=props.openerOptionNode)===null||_props_openerOptionNode===void 0?void 0:_props_openerOptionNode.id)||"root"}`,children:(0,_reactdom.createPortal)((0,_jsxruntime.jsx)(_reactselect.components.Menu,_object_spread_props(_object_spread({},props.menuProps),{innerRef:innerMenuRef,className:(0,_cx.cx)(_CascadeMenumodulecss.default.menu,(props.openerOptionNode?props.openerOptionNode.focused:true)||open?_CascadeMenumodulecss.default["menu-open"]:_CascadeMenumodulecss.default["menu-hidden"]),style:{zIndex:props.level},isLoading:false,placement:"bottom",minMenuHeight:200,maxMenuHeight:200,menuPlacement:"bottom",menuPosition:"fixed",menuShouldScrollIntoView:true,children:props.options.map((op,index)=>(0,_react.createElement)(_CascadeOption.CascadeOption,_object_spread_props(_object_spread({},props),{level:props.level+1,index:index,OptionComponent:props.OptionComponent,onSelect:value=>{props.onSelect(value)},option:op,key:op.value,openerMenuRef:innerMenuRef})))})),((_props_menuPortalTarget=props.menuPortalTarget)===null||_props_menuPortalTarget===void 0?void 0:_props_menuPortalTarget.current)||document.body,((_props_openerOptionNode1=props.openerOptionNode)===null||_props_openerOptionNode1===void 0?void 0:_props_openerOptionNode1.id)||((_props_index=props.index)===null||_props_index===void 0?void 0:_props_index.toString()))})})}const CascadeMenuBase=(0,_react.forwardRef)(CascadeMenuBaseRaw);function CascadeMenuOpenerRaw(props,ref){return(0,_jsxruntime.jsxs)(_jsxruntime.Fragment,{children:[props.children,(0,_jsxruntime.jsx)(CascadeMenuBase,_object_spread_props(_object_spread({},props),{ref:ref}))]})}const CascadeMenuOpener=(0,_react.forwardRef)(CascadeMenuOpenerRaw);
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:true});function _export(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:true,get:Object.getOwnPropertyDescriptor(all,name).get})}_export(exports,{get CascadeMenuBase(){return CascadeMenuBase},get CascadeMenuBaseRaw(){return CascadeMenuBaseRaw},get CascadeMenuOpener(){return CascadeMenuOpener},get CascadeMenuOpenerRaw(){return CascadeMenuOpenerRaw}});const _jsxruntime=require("react/jsx-runtime");const _react=require("react");const _reactdom=require("react-dom");const _reactselect=require("react-select");const _CascadeOption=require("./CascadeOption");const _CascadeMenumodulecss=/*#__PURE__*/_interop_require_default(require("./CascadeMenu.module.css"));const _cx=require("../../../../helper/cx");function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target={},sourceKeys,key,i;if(typeof Reflect!=="undefined"&&Reflect.ownKeys){sourceKeys=Reflect.ownKeys(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}target=_object_without_properties_loose(source,excluded);if(Object.getOwnPropertySymbols){sourceKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.getOwnPropertyNames(source),key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}function shouldIncreasePaddingBecauseOfScrollbarBehaviourBasedOnBrowser(){if((navigator.userAgent.indexOf("Opera")||navigator.userAgent.indexOf("OPR"))!=-1){return true}else if(navigator.userAgent.indexOf("Edg")!=-1){return true}else if(navigator.userAgent.indexOf("Chrome")!=-1){return true}else if(navigator.userAgent.indexOf("Safari")!=-1){return false}else if(navigator.userAgent.indexOf("Firefox")!=-1){return false}else if(navigator.userAgent.indexOf("MSIE")!=-1||!!document.documentMode){return true}else{return false}}function CascadeMenuBaseRaw(_0,_1){let _ref=[_0,_1],[_ref1,..._rest]=_ref,{isInitiallyOpen,openerMenuRef}=_ref1,props=_object_without_properties(_ref1,["isInitiallyOpen","openerMenuRef"]),[ref]=_rest;var _props_openerOptionNode,_props_menuPortalTarget,_props_openerOptionNode1,_props_index;const innerMenuRef=(0,_react.useRef)(null);const[open,setOpen]=(0,_react.useState)(isInitiallyOpen||false);const showScrollbar=value=>{if(innerMenuRef.current){innerMenuRef.current.style.overflowY=value?"auto":"hidden"}};const handleMouseExit=()=>{showScrollbar(false);props.setFocusList([])};const handleMouseEnter=()=>{showScrollbar(true)};let isScrolling=false;const handleScroll=()=>{if(isScrolling)return;for(const node of props.nodes){var _node_cascadeOptionForwardRef_current;(_node_cascadeOptionForwardRef_current=node.cascadeOptionForwardRef.current)===null||_node_cascadeOptionForwardRef_current===void 0?void 0:_node_cascadeOptionForwardRef_current.setFocused(false)}isScrolling=true};const handleScrollEnd=()=>{isScrolling=false};(0,_react.useEffect)(()=>{var _innerMenuRef_current,_innerMenuRef_current1,_innerMenuRef_current2,_innerMenuRef_current3;(_innerMenuRef_current=innerMenuRef.current)===null||_innerMenuRef_current===void 0?void 0:_innerMenuRef_current.addEventListener("mouseleave",handleMouseExit);(_innerMenuRef_current1=innerMenuRef.current)===null||_innerMenuRef_current1===void 0?void 0:_innerMenuRef_current1.addEventListener("mouseenter",handleMouseEnter);(_innerMenuRef_current2=innerMenuRef.current)===null||_innerMenuRef_current2===void 0?void 0:_innerMenuRef_current2.addEventListener("wheel",handleScroll);(_innerMenuRef_current3=innerMenuRef.current)===null||_innerMenuRef_current3===void 0?void 0:_innerMenuRef_current3.addEventListener("scrollend",handleScrollEnd);return()=>{var _innerMenuRef_current,_innerMenuRef_current1,_innerMenuRef_current2,_innerMenuRef_current3;(_innerMenuRef_current=innerMenuRef.current)===null||_innerMenuRef_current===void 0?void 0:_innerMenuRef_current.removeEventListener("mouseleave",handleMouseExit);(_innerMenuRef_current1=innerMenuRef.current)===null||_innerMenuRef_current1===void 0?void 0:_innerMenuRef_current1.removeEventListener("mouseenter",handleMouseEnter);(_innerMenuRef_current2=innerMenuRef.current)===null||_innerMenuRef_current2===void 0?void 0:_innerMenuRef_current2.removeEventListener("wheel",handleScroll);(_innerMenuRef_current3=innerMenuRef.current)===null||_innerMenuRef_current3===void 0?void 0:_innerMenuRef_current3.removeEventListener("scrollend",handleScrollEnd)}},[]);const setMenuOpen=value=>{setOpen(value)};(0,_react.useImperativeHandle)(ref,()=>({setOpen:value=>setMenuOpen(value)}));const relocateMenu=()=>{var _props_openerOptionNode,_refable_current,_props_openerOptionNode1,_props_openerOptionNode2,_document_scrollingElement;const refable=props.openerOptionNode?(_props_openerOptionNode=props.openerOptionNode)===null||_props_openerOptionNode===void 0?void 0:_props_openerOptionNode.elementRef:props.openerOptionElementRef;const rect=refable===null||refable===void 0?void 0:(_refable_current=refable.current)===null||_refable_current===void 0?void 0:_refable_current.getBoundingClientRect();if(!rect){return}const isScrollable=openerMenuRef&&openerMenuRef.current&&openerMenuRef.current.offsetHeight<openerMenuRef.current.scrollHeight;const xOffset=shouldIncreasePaddingBecauseOfScrollbarBehaviourBasedOnBrowser()&&isScrollable?7:0;const width=((_props_openerOptionNode1=props.openerOptionNode)===null||_props_openerOptionNode1===void 0?void 0:_props_openerOptionNode1.level)?rect.width+xOffset:0;const height=((_props_openerOptionNode2=props.openerOptionNode)===null||_props_openerOptionNode2===void 0?void 0:_props_openerOptionNode2.level)?-8:rect.height;updatePosition(rect.top+height+(((_document_scrollingElement=document.scrollingElement)===null||_document_scrollingElement===void 0?void 0:_document_scrollingElement.scrollTop)||0),rect.left+width)};(0,_react.useEffect)(()=>{relocateMenu()});const updatePosition=(yPixel,xPixel)=>{if(!innerMenuRef.current)return;innerMenuRef.current.style.top=yPixel+"px";innerMenuRef.current.style.left=xPixel+"px"};return(0,_jsxruntime.jsx)(_jsxruntime.Fragment,{children:(0,_jsxruntime.jsx)("div",{className:(0,_cx.cx)(_CascadeMenumodulecss.default["menu-container"]),"data-testid":`cascade-menu-for-${((_props_openerOptionNode=props.openerOptionNode)===null||_props_openerOptionNode===void 0?void 0:_props_openerOptionNode.id)||"root"}`,children:(0,_reactdom.createPortal)((0,_jsxruntime.jsx)(_reactselect.components.Menu,_object_spread_props(_object_spread({},props.menuProps),{innerRef:innerMenuRef,className:(0,_cx.cx)(_CascadeMenumodulecss.default.menu,(props.openerOptionNode?props.openerOptionNode.focused:true)||open?_CascadeMenumodulecss.default["menu-open"]:_CascadeMenumodulecss.default["menu-hidden"]),style:{zIndex:props.level},isLoading:false,placement:"bottom",minMenuHeight:200,maxMenuHeight:200,menuPlacement:"bottom",menuPosition:"fixed",menuShouldScrollIntoView:true,children:props.options.map((op,index)=>(0,_react.createElement)(_CascadeOption.CascadeOption,_object_spread_props(_object_spread({},props),{level:props.level+1,index:index,OptionComponent:props.OptionComponent,onSelect:value=>{props.onSelect(value)},option:op,key:op.value,openerMenuRef:innerMenuRef})))})),((_props_menuPortalTarget=props.menuPortalTarget)===null||_props_menuPortalTarget===void 0?void 0:_props_menuPortalTarget.current)||document.body,((_props_openerOptionNode1=props.openerOptionNode)===null||_props_openerOptionNode1===void 0?void 0:_props_openerOptionNode1.id)||((_props_index=props.index)===null||_props_index===void 0?void 0:_props_index.toString()))})})}const CascadeMenuBase=(0,_react.forwardRef)(CascadeMenuBaseRaw);function CascadeMenuOpenerRaw(props,ref){return(0,_jsxruntime.jsxs)(_jsxruntime.Fragment,{children:[props.children,(0,_jsxruntime.jsx)(CascadeMenuBase,_object_spread_props(_object_spread({},props),{ref:ref}))]})}const CascadeMenuOpener=(0,_react.forwardRef)(CascadeMenuOpenerRaw);
2
2
  //# sourceMappingURL=CascadeMenu.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../src/components/Form/Select/Cascade/CascadeMenu.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport {\n ForwardedRef,\n forwardRef,\n PropsWithChildren,\n ReactElement,\n RefObject,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\"\nimport { TNode } from \"./utils\"\nimport { createPortal } from \"react-dom\"\nimport { components } from \"react-select\"\nimport { TCascadeMenuForwardRef, TMeta, TStylingProps } from \"./index\"\nimport { CascadeOption, TCascadeOption, TCascadeOptionProps } from \"./CascadeOption\"\nimport classes from \"./CascadeMenu.module.css\"\nimport { cx } from \"../../../../helper/cx\"\n\ntype TCascadeMenuProps<Meta extends TMeta> = Omit<TCascadeOptionProps<Meta>, \"option\"> &\n TStylingProps & {\n options: TCascadeOption<Meta>[]\n isInitiallyOpen?: boolean\n openerOptionNode?: TNode\n openerOptionElementRef?: RefObject<HTMLDivElement>\n openerMenuRef?: RefObject<HTMLDivElement>\n }\n\n// This function is necessary to \"correctly\" display the cascade menus as each browser's scrollbar styling differs\nfunction shouldIncreasePaddingBecauseOfScrollbarBehaviourBasedOnBrowser(): boolean {\n if ((navigator.userAgent.indexOf(\"Opera\") || navigator.userAgent.indexOf(\"OPR\")) != -1) {\n return true\n } else if (navigator.userAgent.indexOf(\"Edg\") != -1) {\n return true\n } else if (navigator.userAgent.indexOf(\"Chrome\") != -1) {\n return true\n } else if (navigator.userAgent.indexOf(\"Safari\") != -1) {\n return false\n } else if (navigator.userAgent.indexOf(\"Firefox\") != -1) {\n return false\n } else if (navigator.userAgent.indexOf(\"MSIE\") != -1 || !!(document as any).documentMode) {\n //IF IE > 10\n return true\n } else {\n return false\n }\n}\n\n/**\n * The raw CascadeMenu. It opens a menu filled with **CascadeOptions**.\n * The menu can optionally be rendered in a portal to escape visual restrictions.\n *\n * @param options Cascade Options\n * @param isInitiallyOpen boolean if it is opened initially\n * @param openerOptionNode A reference to the opener **Node**\n * @param openerOptionElementRef? RefObject to the opener **CascadeOption**\n * @param openerMenuRef? RefObject to the **CascadeMenu** containing the *openerOptionElement*\n * @param ref ForwardRef for:\n * - setOpen(boolean) Toggles the menus open state\n */\nexport function CascadeMenuBaseRaw<Meta extends TMeta = object>(\n { isInitiallyOpen, openerMenuRef, ...props }: TCascadeMenuProps<Meta>,\n ref: ForwardedRef<TCascadeMenuForwardRef>\n) {\n const innerMenuRef = useRef<HTMLDivElement>(null)\n const [open, setOpen] = useState<boolean>(isInitiallyOpen || false)\n\n const showScrollbar = (value: boolean) => {\n if (innerMenuRef.current) {\n innerMenuRef.current.style.overflowY = value ? \"auto\" : \"hidden\"\n }\n }\n const handleMouseExit = () => {\n // Ensure focus list is cleared when leaving a menu\n // When also entering another menu, the event is fired closely after and sets the focus list again\n showScrollbar(false)\n props.setFocusList([])\n }\n\n const handleMouseEnter = () => {\n showScrollbar(true)\n }\n\n let isScrolling = false // temporary variable to reduce called scroll events to one\n const handleScroll = () => {\n // Unfocus all children on scroll\n if (isScrolling) return\n for (const node of props.nodes) {\n node.cascadeOptionForwardRef.current?.setFocused(false)\n }\n isScrolling = true\n }\n\n const handleScrollEnd = () => {\n isScrolling = false\n }\n\n useEffect(() => {\n // (Un)/Register events\n innerMenuRef.current?.addEventListener(\"mouseleave\", handleMouseExit)\n innerMenuRef.current?.addEventListener(\"mouseenter\", handleMouseEnter)\n innerMenuRef.current?.addEventListener(\"wheel\", handleScroll)\n innerMenuRef.current?.addEventListener(\"scrollend\", handleScrollEnd)\n return () => {\n innerMenuRef.current?.removeEventListener(\"mouseleave\", handleMouseExit)\n innerMenuRef.current?.removeEventListener(\"mouseenter\", handleMouseEnter)\n innerMenuRef.current?.removeEventListener(\"wheel\", handleScroll)\n innerMenuRef.current?.removeEventListener(\"scrollend\", handleScrollEnd)\n }\n }, [])\n\n const setMenuOpen = (value: boolean) => {\n setOpen(value)\n }\n\n // Register ref controls for state handling via NodeTree\n useImperativeHandle(ref, () => ({\n setOpen: (value) => setMenuOpen(value),\n }))\n\n /**\n * Relocates the menu based on the opener position\n */\n const relocateMenu = () => {\n const refable = props.openerOptionNode\n ? props.openerOptionNode?.elementRef\n : props.openerOptionElementRef\n const rect = refable?.current?.getBoundingClientRect()\n if (!rect) {\n return\n }\n\n const isScrollable =\n openerMenuRef &&\n openerMenuRef.current &&\n openerMenuRef.current.offsetHeight < openerMenuRef.current.scrollHeight\n\n const xOffset =\n shouldIncreasePaddingBecauseOfScrollbarBehaviourBasedOnBrowser() && isScrollable ? 7 : 0\n\n const width = props.openerOptionNode?.level ? rect.width + xOffset : 0\n const height = props.openerOptionNode?.level ? -8 : rect.height //padding\n // Might get an optional property as the scrollTop offset target so the menu can adapt to the page scroll\n updatePosition(\n rect.top + height + (document.scrollingElement?.scrollTop || 0),\n rect.left + width\n )\n }\n\n useEffect(() => {\n // Update position of current menu\n // First Menu (when select is clicked) does not have an openerOptionNode\n relocateMenu()\n })\n\n const updatePosition = (yPixel: number, xPixel?: number) => {\n if (!innerMenuRef.current) return\n innerMenuRef.current.style.top = yPixel + \"px\"\n innerMenuRef.current.style.left = xPixel + \"px\"\n }\n\n return (\n <>\n <div\n className={cx(classes[\"menu-container\"])}\n data-testid={`cascade-menu-for-${props.openerOptionNode?.id || \"root\"}`}\n >\n {createPortal(\n <components.Menu\n {...(props.menuProps as any)}\n innerRef={innerMenuRef}\n className={cx(\n classes.menu,\n (props.openerOptionNode ? props.openerOptionNode.focused : true) || open\n ? classes[\"menu-open\"]\n : classes[\"menu-hidden\"]\n )}\n style={{\n zIndex: props.level,\n }}\n isLoading={false}\n placement={\"bottom\"}\n minMenuHeight={200}\n maxMenuHeight={200}\n menuPlacement={\"bottom\"}\n menuPosition={\"fixed\"}\n menuShouldScrollIntoView={true}\n >\n {props.options.map((op, index) => (\n <CascadeOption\n {...props}\n level={props.level + 1}\n index={index}\n OptionComponent={props.OptionComponent}\n onSelect={(value) => {\n props.onSelect(value)\n }}\n option={op}\n key={op.value}\n openerMenuRef={innerMenuRef}\n ></CascadeOption>\n ))}\n </components.Menu>,\n props.menuPortalTarget?.current || document.body,\n props.openerOptionNode?.id || props.index?.toString()\n )}\n </div>\n </>\n )\n}\n\n/**\n * ForwardRef for CascadeMenuBase\n */\nexport const CascadeMenuBase = forwardRef(CascadeMenuBaseRaw) as <Meta extends TMeta = object>({\n isInitiallyOpen,\n ...props\n}: TCascadeMenuProps<Meta> & {\n ref?: ForwardedRef<TCascadeMenuForwardRef>\n}) => ReactElement\n\n/**\n * This is used as a wrapper for **CascadeOptions** that lets the option open another menu when selected\n * @param options Cascade Options\n * @param isInitiallyOpen boolean if it is opened initially\n * @param openerOptionNode A reference to the opener **Node**\n * @param openerOptionElementRef? RefObject to the opener **CascadeOption**\n * @param openerMenuRef? RefObject to the **CascadeMenu** containing the *openerOptionElement*\n * @param ref ForwardRef for:\n * - setOpen(boolean) Toggles the menus open state */\nexport function CascadeMenuOpenerRaw<Meta extends TMeta = object>(\n props: PropsWithChildren<TCascadeMenuProps<Meta>>,\n ref: React.ForwardedRef<TCascadeMenuForwardRef>\n) {\n return (\n <>\n {props.children}\n <CascadeMenuBase<Meta> {...props} ref={ref} />\n </>\n )\n}\n\nexport const CascadeMenuOpener = forwardRef(CascadeMenuOpenerRaw) as <Meta extends TMeta = object>(\n props: PropsWithChildren<TCascadeMenuProps<Meta>> & {\n ref?: ForwardedRef<TCascadeMenuForwardRef>\n }\n) => ReactElement\n"],"names":["CascadeMenuBase","CascadeMenuBaseRaw","CascadeMenuOpener","CascadeMenuOpenerRaw","shouldIncreasePaddingBecauseOfScrollbarBehaviourBasedOnBrowser","navigator","userAgent","indexOf","document","documentMode","ref","isInitiallyOpen","openerMenuRef","props","innerMenuRef","useRef","open","setOpen","useState","showScrollbar","value","current","style","overflowY","handleMouseExit","setFocusList","handleMouseEnter","isScrolling","handleScroll","node","nodes","cascadeOptionForwardRef","setFocused","handleScrollEnd","useEffect","addEventListener","removeEventListener","setMenuOpen","useImperativeHandle","relocateMenu","refable","openerOptionNode","elementRef","openerOptionElementRef","rect","getBoundingClientRect","isScrollable","offsetHeight","scrollHeight","xOffset","width","level","height","updatePosition","top","scrollingElement","scrollTop","left","yPixel","xPixel","div","className","cx","classes","data-testid","id","createPortal","components","Menu","menuProps","innerRef","menu","focused","zIndex","isLoading","placement","minMenuHeight","maxMenuHeight","menuPlacement","menuPosition","menuShouldScrollIntoView","options","map","op","index","CascadeOption","OptionComponent","onSelect","option","key","menuPortalTarget","body","toString","forwardRef","children"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../../../src/components/Form/Select/Cascade/CascadeMenu.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport {\n ForwardedRef,\n forwardRef,\n PropsWithChildren,\n ReactElement,\n RefObject,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\"\nimport { TNode } from \"./utils\"\nimport { createPortal } from \"react-dom\"\nimport { components } from \"react-select\"\nimport { TCascadeMenuForwardRef, TMeta, TStylingProps } from \"./index\"\nimport { CascadeOption, TCascadeOption, TCascadeOptionProps } from \"./CascadeOption\"\nimport classes from \"./CascadeMenu.module.css\"\nimport { cx } from \"../../../../helper/cx\"\n\ntype TCascadeMenuProps<Meta extends TMeta> = Omit<TCascadeOptionProps<Meta>, \"option\"> &\n TStylingProps & {\n options: TCascadeOption<Meta>[]\n isInitiallyOpen?: boolean\n openerOptionNode?: TNode\n openerOptionElementRef?: RefObject<HTMLDivElement>\n openerMenuRef?: RefObject<HTMLDivElement>\n }\n\n// This function is necessary to \"correctly\" display the cascade menus as each browser's scrollbar styling differs\nfunction shouldIncreasePaddingBecauseOfScrollbarBehaviourBasedOnBrowser(): boolean {\n if ((navigator.userAgent.indexOf(\"Opera\") || navigator.userAgent.indexOf(\"OPR\")) != -1) {\n return true\n } else if (navigator.userAgent.indexOf(\"Edg\") != -1) {\n return true\n } else if (navigator.userAgent.indexOf(\"Chrome\") != -1) {\n return true\n } else if (navigator.userAgent.indexOf(\"Safari\") != -1) {\n return false\n } else if (navigator.userAgent.indexOf(\"Firefox\") != -1) {\n return false\n } else if (navigator.userAgent.indexOf(\"MSIE\") != -1 || !!(document as any).documentMode) {\n //IF IE > 10\n return true\n } else {\n return false\n }\n}\n\n/**\n * The raw CascadeMenu. It opens a menu filled with **CascadeOptions**.\n * The menu can optionally be rendered in a portal to escape visual restrictions.\n *\n * @param options Cascade Options\n * @param isInitiallyOpen boolean if it is opened initially\n * @param openerOptionNode A reference to the opener **Node**\n * @param openerOptionElementRef? RefObject to the opener **CascadeOption**\n * @param openerMenuRef? RefObject to the **CascadeMenu** containing the *openerOptionElement*\n * @param ref ForwardRef for:\n * - setOpen(boolean) Toggles the menus open state\n */\nexport function CascadeMenuBaseRaw<Meta extends TMeta = object>(\n { isInitiallyOpen, openerMenuRef, ...props }: TCascadeMenuProps<Meta>,\n ref: ForwardedRef<TCascadeMenuForwardRef>\n) {\n const innerMenuRef = useRef<HTMLDivElement>(null)\n const [open, setOpen] = useState<boolean>(isInitiallyOpen || false)\n\n const showScrollbar = (value: boolean) => {\n if (innerMenuRef.current) {\n innerMenuRef.current.style.overflowY = value ? \"auto\" : \"hidden\"\n }\n }\n const handleMouseExit = () => {\n // Ensure focus list is cleared when leaving a menu\n // When also entering another menu, the event is fired closely after and sets the focus list again\n showScrollbar(false)\n props.setFocusList([])\n }\n\n const handleMouseEnter = () => {\n showScrollbar(true)\n }\n\n let isScrolling = false // temporary variable to reduce called scroll events to one\n const handleScroll = () => {\n // Unfocus all children on scroll\n if (isScrolling) return\n for (const node of props.nodes) {\n node.cascadeOptionForwardRef.current?.setFocused(false)\n }\n isScrolling = true\n }\n\n const handleScrollEnd = () => {\n isScrolling = false\n }\n\n useEffect(() => {\n // (Un)/Register events\n innerMenuRef.current?.addEventListener(\"mouseleave\", handleMouseExit)\n innerMenuRef.current?.addEventListener(\"mouseenter\", handleMouseEnter)\n innerMenuRef.current?.addEventListener(\"wheel\", handleScroll)\n innerMenuRef.current?.addEventListener(\"scrollend\", handleScrollEnd)\n return () => {\n innerMenuRef.current?.removeEventListener(\"mouseleave\", handleMouseExit)\n innerMenuRef.current?.removeEventListener(\"mouseenter\", handleMouseEnter)\n innerMenuRef.current?.removeEventListener(\"wheel\", handleScroll)\n innerMenuRef.current?.removeEventListener(\"scrollend\", handleScrollEnd)\n }\n }, [])\n\n const setMenuOpen = (value: boolean) => {\n setOpen(value)\n }\n\n // Register ref controls for state handling via NodeTree\n useImperativeHandle(ref, () => ({\n setOpen: (value) => setMenuOpen(value),\n }))\n\n /**\n * Relocates the menu based on the opener position\n */\n const relocateMenu = () => {\n const refable = props.openerOptionNode\n ? props.openerOptionNode?.elementRef\n : props.openerOptionElementRef\n const rect = refable?.current?.getBoundingClientRect()\n if (!rect) {\n return\n }\n\n const isScrollable =\n openerMenuRef &&\n openerMenuRef.current &&\n openerMenuRef.current.offsetHeight < openerMenuRef.current.scrollHeight\n\n const xOffset =\n shouldIncreasePaddingBecauseOfScrollbarBehaviourBasedOnBrowser() && isScrollable ? 7 : 0\n\n const width = props.openerOptionNode?.level ? rect.width + xOffset : 0\n const height = props.openerOptionNode?.level ? -8 : rect.height //padding\n // Might get an optional property as the scrollTop offset target so the menu can adapt to the page scroll\n updatePosition(\n rect.top + height + (document.scrollingElement?.scrollTop || 0),\n rect.left + width\n )\n }\n\n useEffect(() => {\n // Update position of current menu\n // First Menu (when select is clicked) does not have an openerOptionNode\n relocateMenu()\n })\n\n const updatePosition = (yPixel: number, xPixel?: number) => {\n if (!innerMenuRef.current) return\n innerMenuRef.current.style.top = yPixel + \"px\"\n innerMenuRef.current.style.left = xPixel + \"px\"\n }\n\n return (\n <>\n <div\n className={cx(classes[\"menu-container\"])}\n data-testid={`cascade-menu-for-${props.openerOptionNode?.id || \"root\"}`}\n >\n {createPortal(\n <components.Menu\n {...(props.menuProps as any)}\n innerRef={innerMenuRef}\n className={cx(\n classes.menu,\n (props.openerOptionNode ? props.openerOptionNode.focused : true) || open\n ? classes[\"menu-open\"]\n : classes[\"menu-hidden\"]\n )}\n style={{\n zIndex: props.level,\n }}\n isLoading={false}\n placement={\"bottom\"}\n minMenuHeight={200}\n maxMenuHeight={200}\n menuPlacement={\"bottom\"}\n menuPosition={\"fixed\"}\n menuShouldScrollIntoView={true}\n >\n {props.options.map((op, index) => (\n <CascadeOption\n {...props}\n level={props.level + 1}\n index={index}\n OptionComponent={props.OptionComponent}\n onSelect={(value) => {\n props.onSelect(value)\n }}\n option={op}\n key={op.value}\n openerMenuRef={innerMenuRef}\n ></CascadeOption>\n ))}\n </components.Menu>,\n props.menuPortalTarget?.current || document.body,\n props.openerOptionNode?.id || props.index?.toString()\n )}\n </div>\n </>\n )\n}\n\n/**\n * ForwardRef for CascadeMenuBase\n */\nexport const CascadeMenuBase = forwardRef(CascadeMenuBaseRaw) as <Meta extends TMeta = object>({\n isInitiallyOpen,\n ...props\n}: TCascadeMenuProps<Meta> & {\n ref?: ForwardedRef<TCascadeMenuForwardRef>\n}) => ReactElement\n\n/**\n * This is used as a wrapper for **CascadeOptions** that lets the option open another menu when selected\n * @param options Cascade Options\n * @param isInitiallyOpen boolean if it is opened initially\n * @param openerOptionNode A reference to the opener **Node**\n * @param openerOptionElementRef? RefObject to the opener **CascadeOption**\n * @param openerMenuRef? RefObject to the **CascadeMenu** containing the *openerOptionElement*\n * @param ref ForwardRef for:\n * - setOpen(boolean) Toggles the menus open state */\nexport function CascadeMenuOpenerRaw<Meta extends TMeta = object>(\n props: PropsWithChildren<TCascadeMenuProps<Meta>>,\n ref: React.ForwardedRef<TCascadeMenuForwardRef>\n) {\n return (\n <>\n {props.children}\n <CascadeMenuBase<Meta> {...props} ref={ref} />\n </>\n )\n}\n\nexport const CascadeMenuOpener = forwardRef(CascadeMenuOpenerRaw) as <Meta extends TMeta = object>(\n props: PropsWithChildren<TCascadeMenuProps<Meta>> & {\n ref?: ForwardedRef<TCascadeMenuForwardRef>\n }\n) => ReactElement\n"],"names":["CascadeMenuBase","CascadeMenuBaseRaw","CascadeMenuOpener","CascadeMenuOpenerRaw","shouldIncreasePaddingBecauseOfScrollbarBehaviourBasedOnBrowser","navigator","userAgent","indexOf","document","documentMode","ref","isInitiallyOpen","openerMenuRef","props","innerMenuRef","useRef","open","setOpen","useState","showScrollbar","value","current","style","overflowY","handleMouseExit","setFocusList","handleMouseEnter","isScrolling","handleScroll","node","nodes","cascadeOptionForwardRef","setFocused","handleScrollEnd","useEffect","addEventListener","removeEventListener","setMenuOpen","useImperativeHandle","relocateMenu","refable","openerOptionNode","elementRef","openerOptionElementRef","rect","getBoundingClientRect","isScrollable","offsetHeight","scrollHeight","xOffset","width","level","height","updatePosition","top","scrollingElement","scrollTop","left","yPixel","xPixel","div","className","cx","classes","data-testid","id","createPortal","components","Menu","menuProps","innerRef","menu","focused","zIndex","isLoading","placement","minMenuHeight","maxMenuHeight","menuPlacement","menuPosition","menuShouldScrollIntoView","options","map","op","index","CascadeOption","OptionComponent","onSelect","option","key","menuPortalTarget","body","toString","forwardRef","children"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"CascadeOption",{enumerable:true,get:function(){return CascadeOption}});const _jsxruntime=require("react/jsx-runtime");const _react=require("react");const _utils=require("./utils");const _CascadeMenu=require("./CascadeMenu");const _useCascadeOptionState=require("./hooks/useCascadeOptionState");const _lucidereact=require("lucide-react");const _TextWithTooltip=require("../../../TextWithTooltip");const _CascadeOptionmodulecss=/*#__PURE__*/_interop_require_default(require("./CascadeOption.module.css"));const _theme=require("../../../../theme");const _cx=require("../../../../helper/cx");function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}function CascadeSelectOption(props){const optionRef=(0,_react.createRef)();const Tooltippable=()=>(0,_jsxruntime.jsxs)(_jsxruntime.Fragment,{children:[(0,_jsxruntime.jsx)(_TextWithTooltip.TextWithTooltip,{text:props.option.label,typoType:"body",tooltipProps:{multiline:true,style:{width:300},withinPortal:true},classNameTooltip:_CascadeOptionmodulecss.default.tooltip}),props.isOpener&&(0,_jsxruntime.jsx)(_lucidereact.ChevronRight,{size:_theme.ICON_SIZES.SMALL})]});return(0,_jsxruntime.jsx)("div",{ref:optionRef,className:(0,_cx.cx)(_CascadeOptionmodulecss.default.option,props.className),children:props.component?(0,_jsxruntime.jsx)(props.component,{option:props.option}):(0,_jsxruntime.jsx)(Tooltippable,{})})}function CascadeOption(_param){var{menuProps}=_param,props=_object_without_properties(_param,["menuProps"]);var _props_classNames,_props_components,_props_classNames1,_props_components1;const index=props.index||0;const activeNode=props.nodes[index];const{setFocused}=(0,_useCascadeOptionState.useCascadeOptionState)({activeNode:activeNode,nodes:props.allNodes,setFocusedList:props.setFocusList,activeClass:_CascadeOptionmodulecss.default["active-class"],inActiveClass:_CascadeOptionmodulecss.default["inactive-class"]});(0,_react.useImperativeHandle)(activeNode.cascadeOptionForwardRef,()=>({setFocused}));return(0,_jsxruntime.jsx)("div",{className:(0,_cx.cx)(_CascadeOptionmodulecss.default.opener),onClick:e=>{e.nativeEvent.stopImmediatePropagation();e.stopPropagation();if(!props.openerSelectable&&activeNode._option.options)return;const nodesToRoot=(0,_utils.nodeHelper)(props.allNodes).getTraceBackToFirstColumn(activeNode)||[];props.onSelect((0,_utils.nodeHelper)(props.allNodes).transformOneDimensionalNodesArrayIntoValues(nodesToRoot))},ref:activeNode.elementRef,"data-testid":`cascade-menu-option-${activeNode.id}`,tabIndex:0,children:!props.option.options?(0,_jsxruntime.jsx)(CascadeSelectOption,{className:(0,_cx.cx)(_CascadeOptionmodulecss.default["option-clickable"],(_props_classNames=props.classNames)===null||_props_classNames===void 0?void 0:_props_classNames.option),isOpener:false,option:props.option,component:(_props_components=props.components)===null||_props_components===void 0?void 0:_props_components.option}):(0,_jsxruntime.jsx)(_CascadeMenu.CascadeMenuOpener,_object_spread_props(_object_spread({},props),{openerOptionNode:activeNode,openerOptionElementRef:activeNode.elementRef,ref:activeNode.menuForwardRef,nodes:activeNode.children,index:index,onSelect:value=>props.onSelect(value),options:props.option.options,menuProps:menuProps,children:(0,_jsxruntime.jsx)(CascadeSelectOption,{option:props.option,isOpener:true,className:(0,_cx.cx)((_props_classNames1=props.classNames)===null||_props_classNames1===void 0?void 0:_props_classNames1.openerOption,props.openerSelectable?_CascadeOptionmodulecss.default["option-clickable"]:""),component:(_props_components1=props.components)===null||_props_components1===void 0?void 0:_props_components1.openerOption})}))})}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"CascadeOption",{enumerable:true,get:function(){return CascadeOption}});const _jsxruntime=require("react/jsx-runtime");const _react=require("react");const _utils=require("./utils");const _CascadeMenu=require("./CascadeMenu");const _useCascadeOptionState=require("./hooks/useCascadeOptionState");const _lucidereact=require("lucide-react");const _TextWithTooltip=require("../../../TextWithTooltip");const _CascadeOptionmodulecss=/*#__PURE__*/_interop_require_default(require("./CascadeOption.module.css"));const _theme=require("../../../../theme");const _cx=require("../../../../helper/cx");function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target={},sourceKeys,key,i;if(typeof Reflect!=="undefined"&&Reflect.ownKeys){sourceKeys=Reflect.ownKeys(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}target=_object_without_properties_loose(source,excluded);if(Object.getOwnPropertySymbols){sourceKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.getOwnPropertyNames(source),key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}function CascadeSelectOption(props){const optionRef=(0,_react.createRef)();const Tooltippable=()=>(0,_jsxruntime.jsxs)(_jsxruntime.Fragment,{children:[(0,_jsxruntime.jsx)(_TextWithTooltip.TextWithTooltip,{text:props.option.label,typoType:"body",tooltipProps:{multiline:true,style:{width:300},withinPortal:true},classNameTooltip:_CascadeOptionmodulecss.default.tooltip}),props.isOpener&&(0,_jsxruntime.jsx)(_lucidereact.ChevronRight,{size:_theme.ICON_SIZES.SMALL})]});return(0,_jsxruntime.jsx)("div",{ref:optionRef,className:(0,_cx.cx)(_CascadeOptionmodulecss.default.option,props.className),children:props.component?(0,_jsxruntime.jsx)(props.component,{option:props.option}):(0,_jsxruntime.jsx)(Tooltippable,{})})}function CascadeOption(_0){let{menuProps}=_0,props=_object_without_properties(_0,["menuProps"]);var _props_classNames,_props_components,_props_classNames1,_props_components1;const index=props.index||0;const activeNode=props.nodes[index];const{setFocused}=(0,_useCascadeOptionState.useCascadeOptionState)({activeNode:activeNode,nodes:props.allNodes,setFocusedList:props.setFocusList,activeClass:_CascadeOptionmodulecss.default["active-class"],inActiveClass:_CascadeOptionmodulecss.default["inactive-class"]});(0,_react.useImperativeHandle)(activeNode.cascadeOptionForwardRef,()=>({setFocused}));return(0,_jsxruntime.jsx)("div",{className:(0,_cx.cx)(_CascadeOptionmodulecss.default.opener),onClick:e=>{e.nativeEvent.stopImmediatePropagation();e.stopPropagation();if(!props.openerSelectable&&activeNode._option.options)return;const nodesToRoot=(0,_utils.nodeHelper)(props.allNodes).getTraceBackToFirstColumn(activeNode)||[];props.onSelect((0,_utils.nodeHelper)(props.allNodes).transformOneDimensionalNodesArrayIntoValues(nodesToRoot))},ref:activeNode.elementRef,"data-testid":`cascade-menu-option-${activeNode.id}`,tabIndex:0,children:!props.option.options?(0,_jsxruntime.jsx)(CascadeSelectOption,{className:(0,_cx.cx)(_CascadeOptionmodulecss.default["option-clickable"],(_props_classNames=props.classNames)===null||_props_classNames===void 0?void 0:_props_classNames.option),isOpener:false,option:props.option,component:(_props_components=props.components)===null||_props_components===void 0?void 0:_props_components.option}):(0,_jsxruntime.jsx)(_CascadeMenu.CascadeMenuOpener,_object_spread_props(_object_spread({},props),{openerOptionNode:activeNode,openerOptionElementRef:activeNode.elementRef,ref:activeNode.menuForwardRef,nodes:activeNode.children,index:index,onSelect:value=>props.onSelect(value),options:props.option.options,menuProps:menuProps,children:(0,_jsxruntime.jsx)(CascadeSelectOption,{option:props.option,isOpener:true,className:(0,_cx.cx)((_props_classNames1=props.classNames)===null||_props_classNames1===void 0?void 0:_props_classNames1.openerOption,props.openerSelectable?_CascadeOptionmodulecss.default["option-clickable"]:""),component:(_props_components1=props.components)===null||_props_components1===void 0?void 0:_props_components1.openerOption})}))})}
2
2
  //# sourceMappingURL=CascadeOption.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../src/components/Form/Select/Cascade/CascadeOption.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport { createRef, FC, PropsWithChildren, RefObject, useImperativeHandle } from \"react\"\nimport { nodeHelper, TNode } from \"./utils\"\nimport { TMeta, TStylingProps, TValue } from \"./index\"\nimport { MenuProps } from \"@mantine/core\"\nimport { CascadeMenuOpener } from \"./CascadeMenu\"\nimport { useCascadeOptionState } from \"./hooks/useCascadeOptionState\"\nimport { ChevronRight } from \"lucide-react\"\nimport { TextWithTooltip } from \"../../../TextWithTooltip\"\nimport classes from \"./CascadeOption.module.css\"\nimport { ICON_SIZES } from \"../../../../theme\"\nimport { cx } from \"../../../../helper/cx\"\n\nexport type TCascadeOptionProps<Meta extends TMeta = object> = PropsWithChildren &\n TStylingProps & {\n nodes: TNode<Meta>[]\n openerSelectable?: boolean\n setFocusList: (nodes: TNode<Meta>[]) => void\n focusedList: RefObject<TNode<Meta>[]>\n allNodes: TNode<Meta>[]\n level: number\n OptionComponent?: FC<{ option: TValue }>\n option: TCascadeOption<Meta>\n menuProps: MenuProps\n openerMenuRef?: RefObject<HTMLDivElement>\n onSelect: (value: Omit<TCascadeOption<Meta>, \"options\">[]) => void\n index?: number\n menuPortalTarget?: RefObject<HTMLDivElement>\n }\n\ntype TCascadeSelectOptionProps<Meta extends Record<string, any>> = {\n option: Omit<TCascadeOption<Meta>, \"options\">\n className?: string\n component?: FC<{ option: TCascadeOption<Meta> }>\n isOpener: boolean\n}\n\n/**\n * The actual selectable **Option**\n @param option option properties for this option\n label The label\n value The Value\n options? Children. If given, the option is automatically an opener\n meta? Meta information for this option to pass state to the cascades onSelect listener\n @param isOpener flag if this option can open\n @param className Extra classname\n @param component.option Extra Option component to overwrite existing look\n */\nfunction CascadeSelectOption<Meta extends TMeta = object>(props: TCascadeSelectOptionProps<Meta>) {\n const optionRef = createRef<HTMLDivElement>()\n // Remounting Tooltippale on purpose to trigger re-evaluation of whether tooltip is shown or not in TextWithTooltip\n const Tooltippable = () => (\n <>\n <TextWithTooltip\n text={props.option.label}\n typoType={\"body\"}\n tooltipProps={{\n multiline: true,\n style: {\n width: 300,\n },\n withinPortal: true,\n }}\n classNameTooltip={classes.tooltip}\n />\n {props.isOpener && <ChevronRight size={ICON_SIZES.SMALL} />}\n </>\n )\n return (\n <div ref={optionRef} className={cx(classes.option, props.className)}>\n {props.component ? <props.component option={props.option} /> : <Tooltippable />}\n </div>\n )\n}\n\nexport type TCascadeOptionForwardRef = {\n setFocused: (val: boolean) => void\n}\n\n/**\n *\n * @param nodes All current nodes on the current level\n * @param openerSelectable flag if this option should be clickable if it has children\n * @param setFocusList Callback to set the focused list\n * @param focusedList Focused list\n * @param allNodes All nodes\n * @param level Level\n * @param OptionComponent Custom component for this option\n * @constructor\n */\n\nexport function CascadeOption<Meta extends Record<string, any>>({\n menuProps,\n ...props\n}: TCascadeOptionProps<Meta>) {\n const index = props.index || 0\n const activeNode = props.nodes[index]\n const { setFocused } = useCascadeOptionState({\n activeNode: activeNode,\n nodes: props.allNodes,\n setFocusedList: props.setFocusList,\n activeClass: classes[\"active-class\"],\n inActiveClass: classes[\"inactive-class\"],\n })\n useImperativeHandle(activeNode.cascadeOptionForwardRef, () => ({\n setFocused,\n }))\n\n return (\n <div\n className={cx(classes.opener)}\n onClick={(e) => {\n e.nativeEvent.stopImmediatePropagation()\n e.stopPropagation()\n if (!props.openerSelectable && activeNode._option.options) return\n const nodesToRoot = nodeHelper(props.allNodes).getTraceBackToFirstColumn(activeNode) || []\n\n props.onSelect(\n nodeHelper(props.allNodes).transformOneDimensionalNodesArrayIntoValues(nodesToRoot)\n )\n }}\n ref={activeNode.elementRef}\n data-testid={`cascade-menu-option-${activeNode.id}`}\n tabIndex={0}\n >\n {!props.option.options ? (\n <CascadeSelectOption\n className={cx(classes[\"option-clickable\"], props.classNames?.option)}\n isOpener={false}\n option={props.option}\n component={props.components?.option}\n />\n ) : (\n <CascadeMenuOpener\n {...props}\n openerOptionNode={activeNode}\n openerOptionElementRef={activeNode.elementRef}\n ref={activeNode.menuForwardRef}\n nodes={activeNode.children}\n index={index}\n onSelect={(value) => props.onSelect(value)}\n options={props.option.options}\n menuProps={menuProps}\n >\n <CascadeSelectOption\n option={props.option}\n isOpener={true}\n className={cx(\n props.classNames?.openerOption,\n props.openerSelectable ? classes[\"option-clickable\"] : \"\"\n )}\n component={props.components?.openerOption}\n />\n </CascadeMenuOpener>\n )}\n </div>\n )\n}\n\nexport type TCascadeOption<Meta extends TMeta = object> = {\n label: string\n value: string\n options?: Array<TCascadeOption<Meta>>\n meta?: Meta\n}\n"],"names":["CascadeOption","CascadeSelectOption","props","optionRef","createRef","Tooltippable","TextWithTooltip","text","option","label","typoType","tooltipProps","multiline","style","width","withinPortal","classNameTooltip","classes","tooltip","isOpener","ChevronRight","size","ICON_SIZES","SMALL","div","ref","className","cx","component","menuProps","index","activeNode","nodes","setFocused","useCascadeOptionState","allNodes","setFocusedList","setFocusList","activeClass","inActiveClass","useImperativeHandle","cascadeOptionForwardRef","opener","onClick","e","nativeEvent","stopImmediatePropagation","stopPropagation","openerSelectable","_option","options","nodesToRoot","nodeHelper","getTraceBackToFirstColumn","onSelect","transformOneDimensionalNodesArrayIntoValues","elementRef","data-testid","id","tabIndex","classNames","components","CascadeMenuOpener","openerOptionNode","openerOptionElementRef","menuForwardRef","children","value","openerOption"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../../../src/components/Form/Select/Cascade/CascadeOption.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport { createRef, FC, PropsWithChildren, RefObject, useImperativeHandle } from \"react\"\nimport { nodeHelper, TNode } from \"./utils\"\nimport { TMeta, TStylingProps, TValue } from \"./index\"\nimport { MenuProps } from \"@mantine/core\"\nimport { CascadeMenuOpener } from \"./CascadeMenu\"\nimport { useCascadeOptionState } from \"./hooks/useCascadeOptionState\"\nimport { ChevronRight } from \"lucide-react\"\nimport { TextWithTooltip } from \"../../../TextWithTooltip\"\nimport classes from \"./CascadeOption.module.css\"\nimport { ICON_SIZES } from \"../../../../theme\"\nimport { cx } from \"../../../../helper/cx\"\n\nexport type TCascadeOptionProps<Meta extends TMeta = object> = PropsWithChildren &\n TStylingProps & {\n nodes: TNode<Meta>[]\n openerSelectable?: boolean\n setFocusList: (nodes: TNode<Meta>[]) => void\n focusedList: RefObject<TNode<Meta>[]>\n allNodes: TNode<Meta>[]\n level: number\n OptionComponent?: FC<{ option: TValue }>\n option: TCascadeOption<Meta>\n menuProps: MenuProps\n openerMenuRef?: RefObject<HTMLDivElement>\n onSelect: (value: Omit<TCascadeOption<Meta>, \"options\">[]) => void\n index?: number\n menuPortalTarget?: RefObject<HTMLDivElement>\n }\n\ntype TCascadeSelectOptionProps<Meta extends Record<string, any>> = {\n option: Omit<TCascadeOption<Meta>, \"options\">\n className?: string\n component?: FC<{ option: TCascadeOption<Meta> }>\n isOpener: boolean\n}\n\n/**\n * The actual selectable **Option**\n @param option option properties for this option\n label The label\n value The Value\n options? Children. If given, the option is automatically an opener\n meta? Meta information for this option to pass state to the cascades onSelect listener\n @param isOpener flag if this option can open\n @param className Extra classname\n @param component.option Extra Option component to overwrite existing look\n */\nfunction CascadeSelectOption<Meta extends TMeta = object>(props: TCascadeSelectOptionProps<Meta>) {\n const optionRef = createRef<HTMLDivElement>()\n // Remounting Tooltippale on purpose to trigger re-evaluation of whether tooltip is shown or not in TextWithTooltip\n const Tooltippable = () => (\n <>\n <TextWithTooltip\n text={props.option.label}\n typoType={\"body\"}\n tooltipProps={{\n multiline: true,\n style: {\n width: 300,\n },\n withinPortal: true,\n }}\n classNameTooltip={classes.tooltip}\n />\n {props.isOpener && <ChevronRight size={ICON_SIZES.SMALL} />}\n </>\n )\n return (\n <div ref={optionRef} className={cx(classes.option, props.className)}>\n {props.component ? <props.component option={props.option} /> : <Tooltippable />}\n </div>\n )\n}\n\nexport type TCascadeOptionForwardRef = {\n setFocused: (val: boolean) => void\n}\n\n/**\n *\n * @param nodes All current nodes on the current level\n * @param openerSelectable flag if this option should be clickable if it has children\n * @param setFocusList Callback to set the focused list\n * @param focusedList Focused list\n * @param allNodes All nodes\n * @param level Level\n * @param OptionComponent Custom component for this option\n * @constructor\n */\n\nexport function CascadeOption<Meta extends Record<string, any>>({\n menuProps,\n ...props\n}: TCascadeOptionProps<Meta>) {\n const index = props.index || 0\n const activeNode = props.nodes[index]\n const { setFocused } = useCascadeOptionState({\n activeNode: activeNode,\n nodes: props.allNodes,\n setFocusedList: props.setFocusList,\n activeClass: classes[\"active-class\"],\n inActiveClass: classes[\"inactive-class\"],\n })\n useImperativeHandle(activeNode.cascadeOptionForwardRef, () => ({\n setFocused,\n }))\n\n return (\n <div\n className={cx(classes.opener)}\n onClick={(e) => {\n e.nativeEvent.stopImmediatePropagation()\n e.stopPropagation()\n if (!props.openerSelectable && activeNode._option.options) return\n const nodesToRoot = nodeHelper(props.allNodes).getTraceBackToFirstColumn(activeNode) || []\n\n props.onSelect(\n nodeHelper(props.allNodes).transformOneDimensionalNodesArrayIntoValues(nodesToRoot)\n )\n }}\n ref={activeNode.elementRef}\n data-testid={`cascade-menu-option-${activeNode.id}`}\n tabIndex={0}\n >\n {!props.option.options ? (\n <CascadeSelectOption\n className={cx(classes[\"option-clickable\"], props.classNames?.option)}\n isOpener={false}\n option={props.option}\n component={props.components?.option}\n />\n ) : (\n <CascadeMenuOpener\n {...props}\n openerOptionNode={activeNode}\n openerOptionElementRef={activeNode.elementRef}\n ref={activeNode.menuForwardRef}\n nodes={activeNode.children}\n index={index}\n onSelect={(value) => props.onSelect(value)}\n options={props.option.options}\n menuProps={menuProps}\n >\n <CascadeSelectOption\n option={props.option}\n isOpener={true}\n className={cx(\n props.classNames?.openerOption,\n props.openerSelectable ? classes[\"option-clickable\"] : \"\"\n )}\n component={props.components?.openerOption}\n />\n </CascadeMenuOpener>\n )}\n </div>\n )\n}\n\nexport type TCascadeOption<Meta extends TMeta = object> = {\n label: string\n value: string\n options?: Array<TCascadeOption<Meta>>\n meta?: Meta\n}\n"],"names":["CascadeOption","CascadeSelectOption","props","optionRef","createRef","Tooltippable","TextWithTooltip","text","option","label","typoType","tooltipProps","multiline","style","width","withinPortal","classNameTooltip","classes","tooltip","isOpener","ChevronRight","size","ICON_SIZES","SMALL","div","ref","className","cx","component","menuProps","index","activeNode","nodes","setFocused","useCascadeOptionState","allNodes","setFocusedList","setFocusList","activeClass","inActiveClass","useImperativeHandle","cascadeOptionForwardRef","opener","onClick","e","nativeEvent","stopImmediatePropagation","stopPropagation","openerSelectable","_option","options","nodesToRoot","nodeHelper","getTraceBackToFirstColumn","onSelect","transformOneDimensionalNodesArrayIntoValues","elementRef","data-testid","id","tabIndex","classNames","components","CascadeMenuOpener","openerOptionNode","openerOptionElementRef","menuForwardRef","children","value","openerOption"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"Cascade",{enumerable:true,get:function(){return Cascade}});const _jsxruntime=require("react/jsx-runtime");const _react=require("react");const _utils=require("./utils");const _creatable=/*#__PURE__*/_interop_require_default(require("react-select/creatable"));const _useCascadeKeyDown=require("./hooks/useCascadeKeyDown");const _CascadeMenu=require("./CascadeMenu");const _useFocusedList=require("./hooks/useFocusedList");const _core=require("@mantine/core");function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}function Cascade(_param){var{separator=" > "}=_param,props=_object_without_properties(_param,["separator"]);const selectRef=(0,_react.useRef)(null);const containerRef=(0,_react.useRef)(null);const[filteredOptions,setFilteredOptions]=(0,_react.useState)(props.options);const theme=(0,_core.useMantineTheme)();const nodes=(0,_utils.buildNodeTree)(filteredOptions);const[selectedValue,setSelectedValue]=(0,_react.useState)();const focusedListState=(0,_useFocusedList.useFocusedList)(nodes);(0,_react.useEffect)(()=>{focusedListState.setFirstOptionsActive()},[focusedListState.setFirstOptionsActive,nodes]);const{colorScheme}=(0,_core.useMantineColorScheme)();const isDarkScheme=colorScheme==="dark";const{handleKeyDown}=(0,_useCascadeKeyDown.useCascadeKeyDown)({focusedListState:focusedListState,filteredOptions,onApply:nodes=>handleApply(nodes.map(n=>n._option)),openerSelectable:props.openerSelectable});const handleApply=values=>{focusedListState.setFocusedList([]);setSelectedValue(values);props.onSelect(values)};const inputStyles={width:"100%",color:`${isDarkScheme?theme.white:theme.black}`,backgroundColor:`${isDarkScheme?theme.colors.gray[8]:theme.white}`,"&:focus":{backgroundColor:`${isDarkScheme?theme.colors.gray[8]:theme.white}`}};return(0,_jsxruntime.jsx)("div",{onClick:e=>{e.nativeEvent.stopImmediatePropagation();e.stopPropagation()},ref:containerRef,"data-testid":"cascade-select-container",onKeyDown:props.onKeyDown,children:(0,_jsxruntime.jsx)(_creatable.default,_object_spread_props(_object_spread({ref:selectRef,onMenuOpen:()=>focusedListState.setFirstOptionsActive(),onMenuClose:()=>setFilteredOptions(props.options),onInputChange:newValue=>{focusedListState.setFocusedList([]);const filtered=(0,_utils.nodeHelper)(nodes).filterOptionsByValue(props.options,newValue);setFilteredOptions(filtered)},value:{label:(selectedValue===null||selectedValue===void 0?void 0:selectedValue.map(v=>v.label).join(separator))||"",value:(selectedValue===null||selectedValue===void 0?void 0:selectedValue.map(v=>v.value).join(separator))||"",options:[]},onKeyDown:handleKeyDown,onCreateOption:()=>{}},props.selectProps),{styles:_object_spread({input:base=>_object_spread({},base,inputStyles),control:base=>_object_spread({},base,inputStyles),container:base=>_object_spread_props(_object_spread({},base),{width:"100%"})},props.styles),components:{DropdownIndicator:()=>null,IndicatorSeparator:()=>null,Menu:base=>filteredOptions.length!==0?(0,_jsxruntime.jsx)("div",{onClick:e=>e.stopPropagation(),children:(0,_jsxruntime.jsx)(_CascadeMenu.CascadeMenuBase,{setFocusList:focusedListState.setFocusedList,focusedList:focusedListState.focusedList,openerOptionElementRef:containerRef,nodes:nodes,allNodes:nodes,openerSelectable:props.openerSelectable,isInitiallyOpen:true,level:0,options:filteredOptions,menuProps:base,styles:props.styles,onSelect:value=>{handleApply(value);const mergedLabel=props.afterSelectDisplayTransform?props.afterSelectDisplayTransform(value):value.map(v=>v.label).join(separator);const mergedValue=value.map(v=>v.label).join(":");base.selectOption({value:mergedValue,label:mergedLabel})}})}):null},options:[]}))})}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"Cascade",{enumerable:true,get:function(){return Cascade}});const _jsxruntime=require("react/jsx-runtime");const _react=require("react");const _utils=require("./utils");const _creatable=/*#__PURE__*/_interop_require_default(require("react-select/creatable"));const _useCascadeKeyDown=require("./hooks/useCascadeKeyDown");const _CascadeMenu=require("./CascadeMenu");const _useFocusedList=require("./hooks/useFocusedList");const _core=require("@mantine/core");function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target={},sourceKeys,key,i;if(typeof Reflect!=="undefined"&&Reflect.ownKeys){sourceKeys=Reflect.ownKeys(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}target=_object_without_properties_loose(source,excluded);if(Object.getOwnPropertySymbols){sourceKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.getOwnPropertyNames(source),key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}function Cascade(_0){let{separator=" > "}=_0,props=_object_without_properties(_0,["separator"]);const selectRef=(0,_react.useRef)(null);const containerRef=(0,_react.useRef)(null);const[filteredOptions,setFilteredOptions]=(0,_react.useState)(props.options);const theme=(0,_core.useMantineTheme)();const nodes=(0,_utils.buildNodeTree)(filteredOptions);const[selectedValue,setSelectedValue]=(0,_react.useState)();const focusedListState=(0,_useFocusedList.useFocusedList)(nodes);(0,_react.useEffect)(()=>{focusedListState.setFirstOptionsActive()},[focusedListState.setFirstOptionsActive,nodes]);const{colorScheme}=(0,_core.useMantineColorScheme)();const isDarkScheme=colorScheme==="dark";const{handleKeyDown}=(0,_useCascadeKeyDown.useCascadeKeyDown)({focusedListState:focusedListState,filteredOptions,onApply:nodes=>handleApply(nodes.map(n=>n._option)),openerSelectable:props.openerSelectable});const handleApply=values=>{focusedListState.setFocusedList([]);setSelectedValue(values);props.onSelect(values)};const inputStyles={width:"100%",color:`${isDarkScheme?theme.white:theme.black}`,backgroundColor:`${isDarkScheme?theme.colors.gray[8]:theme.white}`,"&:focus":{backgroundColor:`${isDarkScheme?theme.colors.gray[8]:theme.white}`}};return(0,_jsxruntime.jsx)("div",{onClick:e=>{e.nativeEvent.stopImmediatePropagation();e.stopPropagation()},ref:containerRef,"data-testid":"cascade-select-container",onKeyDown:props.onKeyDown,children:(0,_jsxruntime.jsx)(_creatable.default,_object_spread_props(_object_spread({ref:selectRef,onMenuOpen:()=>focusedListState.setFirstOptionsActive(),onMenuClose:()=>setFilteredOptions(props.options),onInputChange:newValue=>{focusedListState.setFocusedList([]);const filtered=(0,_utils.nodeHelper)(nodes).filterOptionsByValue(props.options,newValue);setFilteredOptions(filtered)},value:{label:(selectedValue===null||selectedValue===void 0?void 0:selectedValue.map(v=>v.label).join(separator))||"",value:(selectedValue===null||selectedValue===void 0?void 0:selectedValue.map(v=>v.value).join(separator))||"",options:[]},onKeyDown:handleKeyDown,onCreateOption:()=>{}},props.selectProps),{styles:_object_spread({input:base=>_object_spread({},base,inputStyles),control:base=>_object_spread({},base,inputStyles),container:base=>_object_spread_props(_object_spread({},base),{width:"100%"})},props.styles),components:{DropdownIndicator:()=>null,IndicatorSeparator:()=>null,Menu:base=>filteredOptions.length!==0?(0,_jsxruntime.jsx)("div",{onClick:e=>e.stopPropagation(),children:(0,_jsxruntime.jsx)(_CascadeMenu.CascadeMenuBase,{setFocusList:focusedListState.setFocusedList,focusedList:focusedListState.focusedList,openerOptionElementRef:containerRef,nodes:nodes,allNodes:nodes,openerSelectable:props.openerSelectable,isInitiallyOpen:true,level:0,options:filteredOptions,menuProps:base,styles:props.styles,onSelect:value=>{handleApply(value);const mergedLabel=props.afterSelectDisplayTransform?props.afterSelectDisplayTransform(value):value.map(v=>v.label).join(separator);const mergedValue=value.map(v=>v.label).join(":");base.selectOption({value:mergedValue,label:mergedLabel})}})}):null},options:[]}))})}
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../src/components/Form/Select/Cascade/index.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport { CSSObjectWithLabel, GroupBase } from \"react-select\"\nimport * as SelectType from \"react-select/base\"\nimport { FC, KeyboardEventHandler, RefObject, useEffect, useRef, useState } from \"react\"\nimport { buildNodeTree, nodeHelper } from \"./utils\"\nimport Creatable from \"react-select/creatable\"\nimport { TCascadeOption } from \"./CascadeOption\"\nimport { useCascadeKeyDown } from \"./hooks/useCascadeKeyDown\"\nimport { CascadeMenuBase } from \"./CascadeMenu\"\nimport { useFocusedList } from \"./hooks/useFocusedList\"\nimport { PublicBaseSelectProps } from \"react-select/base\"\nimport { useMantineColorScheme, useMantineTheme } from \"@mantine/core\"\n\nexport type TCascadeMenuForwardRef = {\n setOpen: (value: boolean) => void\n}\n\nexport type TStylingProps = {\n components?: {\n option?: FC<{ option: TValue }>\n openerOption?: FC<{ option: TValue }>\n }\n classNames?: {\n option?: string\n openerOption?: string\n }\n styles?: {\n maxMenuHeight?: string\n menuWidth?: string\n menuZIndex?: number\n }\n}\n\nexport type TValue = { value: string; label: string }\nexport type TMeta = Record<string, any>\n\ntype TCascadeProps<Meta extends TMeta> = TStylingProps & {\n options: Array<TCascadeOption<Meta>>\n onSelect: (value: TCascadeOption<Meta>[]) => void\n onKeyDown?: KeyboardEventHandler<HTMLDivElement>\n afterSelectDisplayTransform?: (values: TValue[]) => string\n afterSelectValueTransform?: (values: TValue[]) => string\n separator?: string\n selectProps?: Partial<PublicBaseSelectProps<TCascadeOption<Meta>, false, any>>\n menuPortalTarget?: RefObject<HTMLDivElement>\n openerSelectable?: boolean\n}\n\n/**\n * The **Cascade** is a recursive component that traverses down its given *options*.\n * Under the hood it uses @React-Select but replaces the menus with **CascadeMenu** that render **CascadeOptions**.\n *\n * @param options Options Items for the cascade\n * @param onSelect Callback when an **CascadeOption** is clicked. Passes the \"path\" of options\n * @param onKeyDown Keydown handler\n * @param afterSelectDisplayTransform? Transforms the values from the selected option paths to a string that is displayed\n * @param afterSelectValueTransform?: (values: TValue[]) => string\n * @param separator? If no *afterSelectDisplayTransform* is set, the separater (default ' > ') is separating the options labels\n * @param selectProps? Props passed to the @React-Select Select\n * @param menuPortalTarget? Target for the portal in which the **CascadeMenus** are rendered\n * @param openerSelectable? Specifies if an **CascadeOption** that opens another menu can be selected\n */\nexport function Cascade<Meta extends TMeta = object>({\n separator = \" > \",\n ...props\n}: TCascadeProps<Meta>) {\n const selectRef: RefObject<\n SelectType.default<TCascadeOption<Meta>, false, GroupBase<TCascadeOption<Meta>>>\n > = useRef(null)\n const containerRef = useRef<HTMLDivElement>(null)\n const [filteredOptions, setFilteredOptions] = useState<TCascadeOption<Meta>[]>(props.options) // reduces options based on input value\n\n const theme = useMantineTheme()\n\n // Initialize virtual nodes based on the filtered CascadeOptions\n const nodes = buildNodeTree(filteredOptions)\n\n const [selectedValue, setSelectedValue] = useState<TCascadeOption<Meta>[] | undefined>() // keeps track of selected value\n const focusedListState = useFocusedList(nodes) // Keeps track of currently focused items\n useEffect(() => {\n focusedListState.setFirstOptionsActive()\n }, [focusedListState.setFirstOptionsActive, nodes])\n const { colorScheme } = useMantineColorScheme()\n const isDarkScheme = colorScheme === \"dark\"\n\n // Registers key down listeners for hotkey usage\n const { handleKeyDown } = useCascadeKeyDown({\n focusedListState: focusedListState,\n filteredOptions,\n onApply: (nodes) => handleApply(nodes.map((n) => n._option)),\n openerSelectable: props.openerSelectable,\n })\n\n const handleApply = (values: TCascadeOption<Meta>[]) => {\n focusedListState.setFocusedList([])\n setSelectedValue(values)\n props.onSelect(values)\n }\n\n const inputStyles = {\n width: \"100%\",\n color: `${isDarkScheme ? theme.white : theme.black}`,\n backgroundColor: `${isDarkScheme ? theme.colors.gray[8] : theme.white}`,\n \"&:focus\": {\n backgroundColor: `${isDarkScheme ? theme.colors.gray[8] : theme.white}`,\n },\n }\n\n return (\n <div\n onClick={(e) => {\n // Last saviour before event leaves component\n e.nativeEvent.stopImmediatePropagation()\n e.stopPropagation()\n }}\n ref={containerRef}\n data-testid={\"cascade-select-container\"}\n onKeyDown={props.onKeyDown}\n >\n <Creatable<TCascadeOption<Meta>, false>\n ref={selectRef}\n onMenuOpen={() => focusedListState.setFirstOptionsActive()}\n onMenuClose={() => setFilteredOptions(props.options)}\n onInputChange={(newValue) => {\n focusedListState.setFocusedList([])\n const filtered = nodeHelper(nodes).filterOptionsByValue(props.options, newValue)\n setFilteredOptions(filtered)\n }}\n value={{\n label: selectedValue?.map((v) => v.label).join(separator) || \"\",\n value: selectedValue?.map((v) => v.value).join(separator) || \"\",\n options: [],\n }}\n onKeyDown={handleKeyDown}\n onCreateOption={() => {}}\n {...props.selectProps}\n styles={{\n input: (base) =>\n ({\n ...base,\n ...inputStyles,\n }) as CSSObjectWithLabel,\n control: (base) =>\n ({\n ...base,\n ...inputStyles,\n }) as CSSObjectWithLabel,\n container: (base) =>\n ({\n ...base,\n width: \"100%\",\n }) as CSSObjectWithLabel,\n ...props.styles,\n }}\n components={{\n DropdownIndicator: () => null,\n IndicatorSeparator: () => null,\n Menu: (base) =>\n (filteredOptions.length !== 0 ? (\n <div onClick={(e) => e.stopPropagation()}>\n <CascadeMenuBase<Meta>\n setFocusList={focusedListState.setFocusedList}\n focusedList={focusedListState.focusedList}\n openerOptionElementRef={containerRef}\n nodes={nodes}\n allNodes={nodes}\n openerSelectable={props.openerSelectable}\n isInitiallyOpen={true}\n level={0}\n options={filteredOptions}\n menuProps={base}\n styles={props.styles}\n onSelect={(value: TCascadeOption<Meta>[]) => {\n handleApply(value)\n const mergedLabel = props.afterSelectDisplayTransform\n ? props.afterSelectDisplayTransform(value)\n : value.map((v) => v.label).join(separator)\n // I think the following is just to satisfy the @React-Select\n const mergedValue = value.map((v) => v.label).join(\":\")\n base.selectOption({\n value: mergedValue,\n label: mergedLabel,\n })\n }}\n />\n </div>\n ) : null) as React.ReactNode,\n }}\n options={[]}\n />\n </div>\n )\n}\n"],"names":["Cascade","separator","props","selectRef","useRef","containerRef","filteredOptions","setFilteredOptions","useState","options","theme","useMantineTheme","nodes","buildNodeTree","selectedValue","setSelectedValue","focusedListState","useFocusedList","useEffect","setFirstOptionsActive","colorScheme","useMantineColorScheme","isDarkScheme","handleKeyDown","useCascadeKeyDown","onApply","handleApply","map","n","_option","openerSelectable","values","setFocusedList","onSelect","inputStyles","width","color","white","black","backgroundColor","colors","gray","div","onClick","e","nativeEvent","stopImmediatePropagation","stopPropagation","ref","data-testid","onKeyDown","Creatable","onMenuOpen","onMenuClose","onInputChange","newValue","filtered","nodeHelper","filterOptionsByValue","value","label","v","join","onCreateOption","selectProps","styles","input","base","control","container","components","DropdownIndicator","IndicatorSeparator","Menu","length","CascadeMenuBase","setFocusList","focusedList","openerOptionElementRef","allNodes","isInitiallyOpen","level","menuProps","mergedLabel","afterSelectDisplayTransform","mergedValue","selectOption"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../../../src/components/Form/Select/Cascade/index.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport { CSSObjectWithLabel, GroupBase } from \"react-select\"\nimport * as SelectType from \"react-select/base\"\nimport { FC, KeyboardEventHandler, RefObject, useEffect, useRef, useState } from \"react\"\nimport { buildNodeTree, nodeHelper } from \"./utils\"\nimport Creatable from \"react-select/creatable\"\nimport { TCascadeOption } from \"./CascadeOption\"\nimport { useCascadeKeyDown } from \"./hooks/useCascadeKeyDown\"\nimport { CascadeMenuBase } from \"./CascadeMenu\"\nimport { useFocusedList } from \"./hooks/useFocusedList\"\nimport { PublicBaseSelectProps } from \"react-select/base\"\nimport { useMantineColorScheme, useMantineTheme } from \"@mantine/core\"\n\nexport type TCascadeMenuForwardRef = {\n setOpen: (value: boolean) => void\n}\n\nexport type TStylingProps = {\n components?: {\n option?: FC<{ option: TValue }>\n openerOption?: FC<{ option: TValue }>\n }\n classNames?: {\n option?: string\n openerOption?: string\n }\n styles?: {\n maxMenuHeight?: string\n menuWidth?: string\n menuZIndex?: number\n }\n}\n\nexport type TValue = { value: string; label: string }\nexport type TMeta = Record<string, any>\n\ntype TCascadeProps<Meta extends TMeta> = TStylingProps & {\n options: Array<TCascadeOption<Meta>>\n onSelect: (value: TCascadeOption<Meta>[]) => void\n onKeyDown?: KeyboardEventHandler<HTMLDivElement>\n afterSelectDisplayTransform?: (values: TValue[]) => string\n afterSelectValueTransform?: (values: TValue[]) => string\n separator?: string\n selectProps?: Partial<PublicBaseSelectProps<TCascadeOption<Meta>, false, any>>\n menuPortalTarget?: RefObject<HTMLDivElement>\n openerSelectable?: boolean\n}\n\n/**\n * The **Cascade** is a recursive component that traverses down its given *options*.\n * Under the hood it uses @React-Select but replaces the menus with **CascadeMenu** that render **CascadeOptions**.\n *\n * @param options Options Items for the cascade\n * @param onSelect Callback when an **CascadeOption** is clicked. Passes the \"path\" of options\n * @param onKeyDown Keydown handler\n * @param afterSelectDisplayTransform? Transforms the values from the selected option paths to a string that is displayed\n * @param afterSelectValueTransform?: (values: TValue[]) => string\n * @param separator? If no *afterSelectDisplayTransform* is set, the separater (default ' > ') is separating the options labels\n * @param selectProps? Props passed to the @React-Select Select\n * @param menuPortalTarget? Target for the portal in which the **CascadeMenus** are rendered\n * @param openerSelectable? Specifies if an **CascadeOption** that opens another menu can be selected\n */\nexport function Cascade<Meta extends TMeta = object>({\n separator = \" > \",\n ...props\n}: TCascadeProps<Meta>) {\n const selectRef: RefObject<\n SelectType.default<TCascadeOption<Meta>, false, GroupBase<TCascadeOption<Meta>>>\n > = useRef(null)\n const containerRef = useRef<HTMLDivElement>(null)\n const [filteredOptions, setFilteredOptions] = useState<TCascadeOption<Meta>[]>(props.options) // reduces options based on input value\n\n const theme = useMantineTheme()\n\n // Initialize virtual nodes based on the filtered CascadeOptions\n const nodes = buildNodeTree(filteredOptions)\n\n const [selectedValue, setSelectedValue] = useState<TCascadeOption<Meta>[] | undefined>() // keeps track of selected value\n const focusedListState = useFocusedList(nodes) // Keeps track of currently focused items\n useEffect(() => {\n focusedListState.setFirstOptionsActive()\n }, [focusedListState.setFirstOptionsActive, nodes])\n const { colorScheme } = useMantineColorScheme()\n const isDarkScheme = colorScheme === \"dark\"\n\n // Registers key down listeners for hotkey usage\n const { handleKeyDown } = useCascadeKeyDown({\n focusedListState: focusedListState,\n filteredOptions,\n onApply: (nodes) => handleApply(nodes.map((n) => n._option)),\n openerSelectable: props.openerSelectable,\n })\n\n const handleApply = (values: TCascadeOption<Meta>[]) => {\n focusedListState.setFocusedList([])\n setSelectedValue(values)\n props.onSelect(values)\n }\n\n const inputStyles = {\n width: \"100%\",\n color: `${isDarkScheme ? theme.white : theme.black}`,\n backgroundColor: `${isDarkScheme ? theme.colors.gray[8] : theme.white}`,\n \"&:focus\": {\n backgroundColor: `${isDarkScheme ? theme.colors.gray[8] : theme.white}`,\n },\n }\n\n return (\n <div\n onClick={(e) => {\n // Last saviour before event leaves component\n e.nativeEvent.stopImmediatePropagation()\n e.stopPropagation()\n }}\n ref={containerRef}\n data-testid={\"cascade-select-container\"}\n onKeyDown={props.onKeyDown}\n >\n <Creatable<TCascadeOption<Meta>, false>\n ref={selectRef}\n onMenuOpen={() => focusedListState.setFirstOptionsActive()}\n onMenuClose={() => setFilteredOptions(props.options)}\n onInputChange={(newValue) => {\n focusedListState.setFocusedList([])\n const filtered = nodeHelper(nodes).filterOptionsByValue(props.options, newValue)\n setFilteredOptions(filtered)\n }}\n value={{\n label: selectedValue?.map((v) => v.label).join(separator) || \"\",\n value: selectedValue?.map((v) => v.value).join(separator) || \"\",\n options: [],\n }}\n onKeyDown={handleKeyDown}\n onCreateOption={() => {}}\n {...props.selectProps}\n styles={{\n input: (base) =>\n ({\n ...base,\n ...inputStyles,\n }) as CSSObjectWithLabel,\n control: (base) =>\n ({\n ...base,\n ...inputStyles,\n }) as CSSObjectWithLabel,\n container: (base) =>\n ({\n ...base,\n width: \"100%\",\n }) as CSSObjectWithLabel,\n ...props.styles,\n }}\n components={{\n DropdownIndicator: () => null,\n IndicatorSeparator: () => null,\n Menu: (base) =>\n (filteredOptions.length !== 0 ? (\n <div onClick={(e) => e.stopPropagation()}>\n <CascadeMenuBase<Meta>\n setFocusList={focusedListState.setFocusedList}\n focusedList={focusedListState.focusedList}\n openerOptionElementRef={containerRef}\n nodes={nodes}\n allNodes={nodes}\n openerSelectable={props.openerSelectable}\n isInitiallyOpen={true}\n level={0}\n options={filteredOptions}\n menuProps={base}\n styles={props.styles}\n onSelect={(value: TCascadeOption<Meta>[]) => {\n handleApply(value)\n const mergedLabel = props.afterSelectDisplayTransform\n ? props.afterSelectDisplayTransform(value)\n : value.map((v) => v.label).join(separator)\n // I think the following is just to satisfy the @React-Select\n const mergedValue = value.map((v) => v.label).join(\":\")\n base.selectOption({\n value: mergedValue,\n label: mergedLabel,\n })\n }}\n />\n </div>\n ) : null) as React.ReactNode,\n }}\n options={[]}\n />\n </div>\n )\n}\n"],"names":["Cascade","separator","props","selectRef","useRef","containerRef","filteredOptions","setFilteredOptions","useState","options","theme","useMantineTheme","nodes","buildNodeTree","selectedValue","setSelectedValue","focusedListState","useFocusedList","useEffect","setFirstOptionsActive","colorScheme","useMantineColorScheme","isDarkScheme","handleKeyDown","useCascadeKeyDown","onApply","handleApply","map","n","_option","openerSelectable","values","setFocusedList","onSelect","inputStyles","width","color","white","black","backgroundColor","colors","gray","div","onClick","e","nativeEvent","stopImmediatePropagation","stopPropagation","ref","data-testid","onKeyDown","Creatable","onMenuOpen","onMenuClose","onInputChange","newValue","filtered","nodeHelper","filterOptionsByValue","value","label","v","join","onCreateOption","selectProps","styles","input","base","control","container","components","DropdownIndicator","IndicatorSeparator","Menu","length","CascadeMenuBase","setFocusList","focusedList","openerOptionElementRef","allNodes","isInitiallyOpen","level","menuProps","mergedLabel","afterSelectDisplayTransform","mergedValue","selectOption"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"CreatableSelect",{enumerable:true,get:function(){return CreatableSelect}});const _jsxruntime=require("react/jsx-runtime");const _core=require("@mantine/core");const _react=/*#__PURE__*/_interop_require_default(require("react"));const _creatable=/*#__PURE__*/_interop_require_default(require("react-select/creatable"));const _CreatableSelectmodulecss=/*#__PURE__*/_interop_require_default(require("./CreatableSelect.module.css"));function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}function CreatableSelect(_param){var{onBlur,onChange,onKeyDown,multiple=false,value,options,className,components}=_param,props=_object_without_properties(_param,["onBlur","onChange","onKeyDown","multiple","value","options","className","components"]);const theme=(0,_core.useMantineTheme)();const{colorScheme}=(0,_core.useMantineColorScheme)();const isDarkScheme=colorScheme==="dark";return(0,_jsxruntime.jsx)("div",{className:className,children:(0,_jsxruntime.jsx)(_creatable.default,_object_spread({ref:props.inputRef,className:_CreatableSelectmodulecss.default.widthAdjust,onChange:(newValue,actionMeta)=>{if(multiple){onChange===null||onChange===void 0?void 0:onChange(newValue,actionMeta);return}onChange===null||onChange===void 0?void 0:onChange(newValue,actionMeta)},onKeyDown:onKeyDown,onBlur:onBlur,value:value,closeMenuOnSelect:!multiple,styles:{control:base=>_object_spread_props(_object_spread({},base),{minHeight:30,backgroundColor:isDarkScheme?theme.colors.gray[8]:base.backgroundColor,color:isDarkScheme?theme.white:base.backgroundColor}),option:(base,{isFocused})=>{return _object_spread_props(_object_spread({},base),{wordBreak:"break-all",backgroundColor:isFocused?isDarkScheme?theme.colors.green[7]:theme.colors.green[0]:isDarkScheme?theme.colors.gray[9]:base.backgroundColor,"&:active":{backgroundColor:isDarkScheme?theme.colors.green[7]:theme.colors.green[0]},color:isDarkScheme?theme.white:base.color})},multiValue:base=>_object_spread_props(_object_spread({},base),{borderRadius:"2px",backgroundColor:isDarkScheme?theme.colors.gray[7]:theme.colors.gray[1],color:isDarkScheme?theme.white:theme.colors.gray[9]}),multiValueLabel:base=>_object_spread_props(_object_spread({},base),{color:isDarkScheme?theme.white:theme.colors.gray[9]}),multiValueRemove:base=>_object_spread_props(_object_spread({},base),{color:isDarkScheme?theme.white:theme.colors.gray[9],"&:hover":{backgroundColor:"inherit",borderRadius:"2px",cursor:"pointer",color:isDarkScheme?theme.black:theme.white}}),input:base=>isDarkScheme?_object_spread_props(_object_spread({},base),{color:theme.white}):base,dropdownIndicator:base=>_object_spread_props(_object_spread({},base),{paddingTop:0,paddingBottom:0}),clearIndicator:base=>_object_spread_props(_object_spread({},base),{paddingTop:0,paddingBottom:0}),menu:base=>_object_spread_props(_object_spread({},base),{border:`1px solid ${isDarkScheme?theme.colors.gray[8]:theme.colors.gray[2]}`,borderRadius:"2px",backgroundColor:isDarkScheme?theme.colors.gray[9]:base.backgroundColor}),menuPortal:base=>_object_spread_props(_object_spread({},base),{zIndex:201})},options:options,hideSelectedOptions:true,noOptionsMessage:()=>null,components:_object_spread({DropdownIndicator:()=>null,IndicatorSeparator:()=>null},components)},props))})}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"CreatableSelect",{enumerable:true,get:function(){return CreatableSelect}});const _jsxruntime=require("react/jsx-runtime");const _core=require("@mantine/core");const _react=/*#__PURE__*/_interop_require_default(require("react"));const _creatable=/*#__PURE__*/_interop_require_default(require("react-select/creatable"));const _CreatableSelectmodulecss=/*#__PURE__*/_interop_require_default(require("./CreatableSelect.module.css"));function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target={},sourceKeys,key,i;if(typeof Reflect!=="undefined"&&Reflect.ownKeys){sourceKeys=Reflect.ownKeys(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}target=_object_without_properties_loose(source,excluded);if(Object.getOwnPropertySymbols){sourceKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.getOwnPropertyNames(source),key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}function CreatableSelect(_0){let{onBlur,onChange,onKeyDown,multiple=false,value,options,className,components}=_0,props=_object_without_properties(_0,["onBlur","onChange","onKeyDown","multiple","value","options","className","components"]);const theme=(0,_core.useMantineTheme)();const{colorScheme}=(0,_core.useMantineColorScheme)();const isDarkScheme=colorScheme==="dark";return(0,_jsxruntime.jsx)("div",{className:className,children:(0,_jsxruntime.jsx)(_creatable.default,_object_spread({ref:props.inputRef,className:_CreatableSelectmodulecss.default.widthAdjust,onChange:(newValue,actionMeta)=>{if(multiple){onChange===null||onChange===void 0?void 0:onChange(newValue,actionMeta);return}onChange===null||onChange===void 0?void 0:onChange(newValue,actionMeta)},onKeyDown:onKeyDown,onBlur:onBlur,value:value,closeMenuOnSelect:!multiple,styles:{control:base=>_object_spread_props(_object_spread({},base),{minHeight:30,backgroundColor:isDarkScheme?theme.colors.gray[8]:base.backgroundColor,color:isDarkScheme?theme.white:base.backgroundColor}),option:(base,{isFocused})=>{return _object_spread_props(_object_spread({},base),{wordBreak:"break-all",backgroundColor:isFocused?isDarkScheme?theme.colors.green[7]:theme.colors.green[0]:isDarkScheme?theme.colors.gray[9]:base.backgroundColor,"&:active":{backgroundColor:isDarkScheme?theme.colors.green[7]:theme.colors.green[0]},color:isDarkScheme?theme.white:base.color})},multiValue:base=>_object_spread_props(_object_spread({},base),{borderRadius:"2px",backgroundColor:isDarkScheme?theme.colors.gray[7]:theme.colors.gray[1],color:isDarkScheme?theme.white:theme.colors.gray[9]}),multiValueLabel:base=>_object_spread_props(_object_spread({},base),{color:isDarkScheme?theme.white:theme.colors.gray[9]}),multiValueRemove:base=>_object_spread_props(_object_spread({},base),{color:isDarkScheme?theme.white:theme.colors.gray[9],"&:hover":{backgroundColor:"inherit",borderRadius:"2px",cursor:"pointer",color:isDarkScheme?theme.black:theme.white}}),input:base=>isDarkScheme?_object_spread_props(_object_spread({},base),{color:theme.white}):base,dropdownIndicator:base=>_object_spread_props(_object_spread({},base),{paddingTop:0,paddingBottom:0}),clearIndicator:base=>_object_spread_props(_object_spread({},base),{paddingTop:0,paddingBottom:0}),menu:base=>_object_spread_props(_object_spread({},base),{border:`1px solid ${isDarkScheme?theme.colors.gray[8]:theme.colors.gray[2]}`,borderRadius:"2px",backgroundColor:isDarkScheme?theme.colors.gray[9]:base.backgroundColor}),menuPortal:base=>_object_spread_props(_object_spread({},base),{zIndex:201})},options:options,hideSelectedOptions:true,noOptionsMessage:()=>null,components:_object_spread({DropdownIndicator:()=>null,IndicatorSeparator:()=>null},components)},props))})}
2
2
  //# sourceMappingURL=CreatableSelect.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/Form/Select/CreatableSelect.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport { useMantineColorScheme, useMantineTheme } from \"@mantine/core\"\nimport { ActionMeta, CSSObjectWithLabel, GroupBase, OptionsOrGroups } from \"react-select\"\nimport React, { FocusEventHandler, KeyboardEventHandler, RefObject } from \"react\"\nimport { StateManagerProps } from \"react-select/dist/declarations/src/useStateManager\"\nimport Creatable from \"react-select/creatable\"\nimport Select from \"react-select/base\"\nimport classes from \"./CreatableSelect.module.css\"\ntype TValue = { value: string; label: string }\n\nexport type TCreatableSelectProps<Multiple> = Omit<StateManagerProps, \"onChange\"> & {\n creatable?: boolean\n onChange?: (\n newValue: Multiple extends true ? TValue[] : TValue,\n actionMeta: ActionMeta<unknown>\n ) => void\n onBlur?: FocusEventHandler\n onKeyDown?: KeyboardEventHandler\n multiple: Multiple\n completed?: boolean\n options?: StateManagerProps<TValue>[\"options\"]\n value?: TValue\n className?: string\n inputRef?: RefObject<Select<unknown, boolean, GroupBase<unknown>>>\n}\n\nexport function CreatableSelect<Multiple extends boolean>({\n onBlur,\n onChange,\n onKeyDown,\n multiple = false as Multiple,\n value,\n options,\n className,\n components,\n ...props\n}: React.PropsWithChildren<TCreatableSelectProps<Multiple>>) {\n const theme = useMantineTheme()\n const { colorScheme } = useMantineColorScheme()\n const isDarkScheme = colorScheme === \"dark\"\n\n return (\n <div className={className}>\n <Creatable\n ref={props.inputRef}\n className={classes.widthAdjust}\n onChange={(newValue, actionMeta) => {\n if (multiple) {\n onChange?.(newValue as unknown as Multiple extends true ? TValue[] : TValue, actionMeta)\n return\n }\n onChange?.(newValue as unknown as Multiple extends true ? TValue[] : TValue, actionMeta)\n }}\n onKeyDown={onKeyDown}\n onBlur={onBlur}\n value={value}\n closeMenuOnSelect={!multiple}\n styles={{\n control: (base) =>\n ({\n ...base,\n minHeight: 30,\n backgroundColor: isDarkScheme ? theme.colors.gray[8] : base.backgroundColor,\n color: isDarkScheme ? theme.white : base.backgroundColor,\n }) as CSSObjectWithLabel,\n option: (base, { isFocused }) => {\n return {\n ...base,\n wordBreak: \"break-all\",\n backgroundColor: isFocused\n ? isDarkScheme\n ? theme.colors.green[7]\n : theme.colors.green[0]\n : isDarkScheme\n ? theme.colors.gray[9]\n : base.backgroundColor,\n \"&:active\": {\n backgroundColor: isDarkScheme ? theme.colors.green[7] : theme.colors.green[0],\n },\n color: isDarkScheme ? theme.white : base.color,\n } as CSSObjectWithLabel\n },\n multiValue: (base) =>\n ({\n ...base,\n borderRadius: \"2px\",\n backgroundColor: isDarkScheme ? theme.colors.gray[7] : theme.colors.gray[1],\n color: isDarkScheme ? theme.white : theme.colors.gray[9],\n }) as CSSObjectWithLabel,\n multiValueLabel: (base) =>\n ({\n ...base,\n color: isDarkScheme ? theme.white : theme.colors.gray[9],\n }) as CSSObjectWithLabel,\n multiValueRemove: (base) =>\n ({\n ...base,\n color: isDarkScheme ? theme.white : theme.colors.gray[9],\n \"&:hover\": {\n backgroundColor: \"inherit\",\n borderRadius: \"2px\",\n cursor: \"pointer\",\n color: isDarkScheme ? theme.black : theme.white,\n },\n }) as CSSObjectWithLabel,\n input: (base) =>\n (isDarkScheme ? { ...base, color: theme.white } : base) as CSSObjectWithLabel,\n dropdownIndicator: (base) =>\n ({\n ...base,\n paddingTop: 0,\n paddingBottom: 0,\n }) as CSSObjectWithLabel,\n clearIndicator: (base) =>\n ({\n ...base,\n paddingTop: 0,\n paddingBottom: 0,\n }) as CSSObjectWithLabel,\n menu: (base) =>\n ({\n ...base,\n border: `1px solid ${isDarkScheme ? theme.colors.gray[8] : theme.colors.gray[2]}`,\n borderRadius: \"2px\",\n backgroundColor: isDarkScheme ? theme.colors.gray[9] : base.backgroundColor,\n }) as CSSObjectWithLabel,\n menuPortal: (base) =>\n ({\n ...base,\n zIndex: 201,\n }) as CSSObjectWithLabel,\n }}\n options={options as OptionsOrGroups<{ label: string; value: string }, GroupBase<TValue>>}\n hideSelectedOptions={true}\n noOptionsMessage={() => null}\n components={{\n DropdownIndicator: () => null,\n IndicatorSeparator: () => null,\n ...components,\n }}\n {...props}\n />\n </div>\n )\n}\n"],"names":["CreatableSelect","onBlur","onChange","onKeyDown","multiple","value","options","className","components","props","theme","useMantineTheme","colorScheme","useMantineColorScheme","isDarkScheme","div","Creatable","ref","inputRef","classes","widthAdjust","newValue","actionMeta","closeMenuOnSelect","styles","control","base","minHeight","backgroundColor","colors","gray","color","white","option","isFocused","wordBreak","green","multiValue","borderRadius","multiValueLabel","multiValueRemove","cursor","black","input","dropdownIndicator","paddingTop","paddingBottom","clearIndicator","menu","border","menuPortal","zIndex","hideSelectedOptions","noOptionsMessage","DropdownIndicator","IndicatorSeparator"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../../src/components/Form/Select/CreatableSelect.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport { useMantineColorScheme, useMantineTheme } from \"@mantine/core\"\nimport { ActionMeta, CSSObjectWithLabel, GroupBase, OptionsOrGroups } from \"react-select\"\nimport React, { FocusEventHandler, KeyboardEventHandler, RefObject } from \"react\"\nimport { StateManagerProps } from \"react-select/dist/declarations/src/useStateManager\"\nimport Creatable from \"react-select/creatable\"\nimport Select from \"react-select/base\"\nimport classes from \"./CreatableSelect.module.css\"\ntype TValue = { value: string; label: string }\n\nexport type TCreatableSelectProps<Multiple> = Omit<StateManagerProps, \"onChange\"> & {\n creatable?: boolean\n onChange?: (\n newValue: Multiple extends true ? TValue[] : TValue,\n actionMeta: ActionMeta<unknown>\n ) => void\n onBlur?: FocusEventHandler\n onKeyDown?: KeyboardEventHandler\n multiple: Multiple\n completed?: boolean\n options?: StateManagerProps<TValue>[\"options\"]\n value?: TValue\n className?: string\n inputRef?: RefObject<Select<unknown, boolean, GroupBase<unknown>>>\n}\n\nexport function CreatableSelect<Multiple extends boolean>({\n onBlur,\n onChange,\n onKeyDown,\n multiple = false as Multiple,\n value,\n options,\n className,\n components,\n ...props\n}: React.PropsWithChildren<TCreatableSelectProps<Multiple>>) {\n const theme = useMantineTheme()\n const { colorScheme } = useMantineColorScheme()\n const isDarkScheme = colorScheme === \"dark\"\n\n return (\n <div className={className}>\n <Creatable\n ref={props.inputRef}\n className={classes.widthAdjust}\n onChange={(newValue, actionMeta) => {\n if (multiple) {\n onChange?.(newValue as unknown as Multiple extends true ? TValue[] : TValue, actionMeta)\n return\n }\n onChange?.(newValue as unknown as Multiple extends true ? TValue[] : TValue, actionMeta)\n }}\n onKeyDown={onKeyDown}\n onBlur={onBlur}\n value={value}\n closeMenuOnSelect={!multiple}\n styles={{\n control: (base) =>\n ({\n ...base,\n minHeight: 30,\n backgroundColor: isDarkScheme ? theme.colors.gray[8] : base.backgroundColor,\n color: isDarkScheme ? theme.white : base.backgroundColor,\n }) as CSSObjectWithLabel,\n option: (base, { isFocused }) => {\n return {\n ...base,\n wordBreak: \"break-all\",\n backgroundColor: isFocused\n ? isDarkScheme\n ? theme.colors.green[7]\n : theme.colors.green[0]\n : isDarkScheme\n ? theme.colors.gray[9]\n : base.backgroundColor,\n \"&:active\": {\n backgroundColor: isDarkScheme ? theme.colors.green[7] : theme.colors.green[0],\n },\n color: isDarkScheme ? theme.white : base.color,\n } as CSSObjectWithLabel\n },\n multiValue: (base) =>\n ({\n ...base,\n borderRadius: \"2px\",\n backgroundColor: isDarkScheme ? theme.colors.gray[7] : theme.colors.gray[1],\n color: isDarkScheme ? theme.white : theme.colors.gray[9],\n }) as CSSObjectWithLabel,\n multiValueLabel: (base) =>\n ({\n ...base,\n color: isDarkScheme ? theme.white : theme.colors.gray[9],\n }) as CSSObjectWithLabel,\n multiValueRemove: (base) =>\n ({\n ...base,\n color: isDarkScheme ? theme.white : theme.colors.gray[9],\n \"&:hover\": {\n backgroundColor: \"inherit\",\n borderRadius: \"2px\",\n cursor: \"pointer\",\n color: isDarkScheme ? theme.black : theme.white,\n },\n }) as CSSObjectWithLabel,\n input: (base) =>\n (isDarkScheme ? { ...base, color: theme.white } : base) as CSSObjectWithLabel,\n dropdownIndicator: (base) =>\n ({\n ...base,\n paddingTop: 0,\n paddingBottom: 0,\n }) as CSSObjectWithLabel,\n clearIndicator: (base) =>\n ({\n ...base,\n paddingTop: 0,\n paddingBottom: 0,\n }) as CSSObjectWithLabel,\n menu: (base) =>\n ({\n ...base,\n border: `1px solid ${isDarkScheme ? theme.colors.gray[8] : theme.colors.gray[2]}`,\n borderRadius: \"2px\",\n backgroundColor: isDarkScheme ? theme.colors.gray[9] : base.backgroundColor,\n }) as CSSObjectWithLabel,\n menuPortal: (base) =>\n ({\n ...base,\n zIndex: 201,\n }) as CSSObjectWithLabel,\n }}\n options={options as OptionsOrGroups<{ label: string; value: string }, GroupBase<TValue>>}\n hideSelectedOptions={true}\n noOptionsMessage={() => null}\n components={{\n DropdownIndicator: () => null,\n IndicatorSeparator: () => null,\n ...components,\n }}\n {...props}\n />\n </div>\n )\n}\n"],"names":["CreatableSelect","onBlur","onChange","onKeyDown","multiple","value","options","className","components","props","theme","useMantineTheme","colorScheme","useMantineColorScheme","isDarkScheme","div","Creatable","ref","inputRef","classes","widthAdjust","newValue","actionMeta","closeMenuOnSelect","styles","control","base","minHeight","backgroundColor","colors","gray","color","white","option","isFocused","wordBreak","green","multiValue","borderRadius","multiValueLabel","multiValueRemove","cursor","black","input","dropdownIndicator","paddingTop","paddingBottom","clearIndicator","menu","border","menuPortal","zIndex","hideSelectedOptions","noOptionsMessage","DropdownIndicator","IndicatorSeparator"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:true});function _export(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:true,get:Object.getOwnPropertyDescriptor(all,name).get})}_export(exports,{get FormSelect(){return FormSelect},get Select(){return Select}});const _jsxruntime=require("react/jsx-runtime");const _core=require("@mantine/core");const _sharedStyles=require("../sharedStyles");const _react=/*#__PURE__*/_interop_require_default(require("react"));const _Form=require("../Form");const _reacthookform=require("react-hook-form");const _FormErrors=require("../Form/FormErrors");const _Selectmodulecss=/*#__PURE__*/_interop_require_default(require("./Select.module.css"));function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}const useStyles=({size})=>{const defaultStyles=(0,_sharedStyles.getDefaultFormStyles)();return _object_spread_props(_object_spread({},defaultStyles),{option:`${_Selectmodulecss.default.option} ${size==="lg"?_Selectmodulecss.default["option-large"]:""}`,selected:_Selectmodulecss.default.selected,dropdown:_Selectmodulecss.default.dropdown})};const SelectRaw=(_param,ref)=>{var{size="md",data}=_param,props=_object_without_properties(_param,["size","data"]);const classes=useStyles({size});return(0,_jsxruntime.jsx)(_core.Select,_object_spread({ref:ref,data:data,withCheckIcon:false,classNames:classes,size:size},props))};const Select=_react.default.forwardRef(SelectRaw);const FormSelect=_param=>{var{name,min,max,minLength,maxLength,validation}=_param,props=_object_without_properties(_param,["name","min","max","minLength","maxLength","validation"]);const form=(0,_Form.useFormContext)();const errorContext=(0,_Form.useErrorContext)();const formError=form.formState.errors[name];const fetchErrors=errorContext.errors[name];const errors=[formError===null||formError===void 0?void 0:formError.message,fetchErrors].flat().filter(ent=>ent);return(0,_jsxruntime.jsx)(_reacthookform.Controller,{control:form.control,name:name,rules:{min,minLength,maxLength,max,validate:validation},disabled:props.disabled,render:_param=>{var{field:{onChange}}=_param,field=_object_without_properties(_param.field,["onChange"]);return(0,_jsxruntime.jsx)(Select,_object_spread_props(_object_spread({},field,props),{error:errors.length>0&&(0,_jsxruntime.jsx)(_FormErrors.FormErrors,{errors:errors}),onChange:value=>{var _props_onChange;onChange({target:{value,name}});value&&((_props_onChange=props.onChange)===null||_props_onChange===void 0?void 0:_props_onChange.call(props,value))}}))}})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:true});function _export(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:true,get:Object.getOwnPropertyDescriptor(all,name).get})}_export(exports,{get FormSelect(){return FormSelect},get Select(){return Select}});const _jsxruntime=require("react/jsx-runtime");const _core=require("@mantine/core");const _sharedStyles=require("../sharedStyles");const _react=/*#__PURE__*/_interop_require_default(require("react"));const _Form=require("../Form");const _reacthookform=require("react-hook-form");const _FormErrors=require("../Form/FormErrors");const _Selectmodulecss=/*#__PURE__*/_interop_require_default(require("./Select.module.css"));function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _interop_require_default(obj){return obj&&obj.__esModule?obj:{default:obj}}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target={},sourceKeys,key,i;if(typeof Reflect!=="undefined"&&Reflect.ownKeys){sourceKeys=Reflect.ownKeys(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}target=_object_without_properties_loose(source,excluded);if(Object.getOwnPropertySymbols){sourceKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={},sourceKeys=Object.getOwnPropertyNames(source),key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}return target}const useStyles=({size})=>{const defaultStyles=(0,_sharedStyles.getDefaultFormStyles)();return _object_spread_props(_object_spread({},defaultStyles),{option:`${_Selectmodulecss.default.option} ${size==="lg"?_Selectmodulecss.default["option-large"]:""}`,selected:_Selectmodulecss.default.selected,dropdown:_Selectmodulecss.default.dropdown})};const SelectRaw=(_0,_1)=>{let _ref=[_0,_1],[_ref1,..._rest]=_ref,{size="md",data}=_ref1,props=_object_without_properties(_ref1,["size","data"]),[ref]=_rest;const classes=useStyles({size});return(0,_jsxruntime.jsx)(_core.Select,_object_spread({ref:ref,data:data,withCheckIcon:false,classNames:classes,size:size},props))};const Select=_react.default.forwardRef(SelectRaw);const FormSelect=_0=>{let{name,min,max,minLength,maxLength,validation}=_0,props=_object_without_properties(_0,["name","min","max","minLength","maxLength","validation"]);const form=(0,_Form.useFormContext)();const errorContext=(0,_Form.useErrorContext)();const formError=form.formState.errors[name];const fetchErrors=errorContext.errors[name];const errors=[formError===null||formError===void 0?void 0:formError.message,fetchErrors].flat().filter(ent=>ent);return(0,_jsxruntime.jsx)(_reacthookform.Controller,{control:form.control,name:name,rules:{min,minLength,maxLength,max,validate:validation},disabled:props.disabled,render:_0=>{let{field:_ref}=_0,{onChange}=_ref,field=_object_without_properties(_ref,["onChange"]);return(0,_jsxruntime.jsx)(Select,_object_spread_props(_object_spread({},field,props),{error:errors.length>0&&(0,_jsxruntime.jsx)(_FormErrors.FormErrors,{errors:errors}),onChange:value=>{var _props_onChange;onChange({target:{value,name}});value&&((_props_onChange=props.onChange)===null||_props_onChange===void 0?void 0:_props_onChange.call(props,value))}}))}})};
2
2
  //# sourceMappingURL=Select.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/Form/Select/Select.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport { Select as SelectMantine, SelectProps } from \"@mantine/core\"\nimport { getDefaultFormStyles } from \"../sharedStyles\"\nimport React, { ForwardedRef } from \"react\"\nimport { useErrorContext, useFormContext } from \"../Form\"\nimport { Controller } from \"react-hook-form\"\nimport { TFormControl } from \"../Form/types\"\nimport { FormErrors } from \"../Form/FormErrors\"\nimport classes from \"./Select.module.css\"\n\nconst useStyles = ({ size }: SelectProps) => {\n const defaultStyles = getDefaultFormStyles()\n return {\n ...defaultStyles,\n option: `${classes.option} ${size === \"lg\" ? classes[\"option-large\"] : \"\"}`,\n selected: classes.selected,\n dropdown: classes.dropdown,\n }\n}\n\ntype TSelect = Modify<\n SelectProps,\n {\n size?: \"md\" | \"lg\"\n }\n>\n\nconst SelectRaw = (\n { size = \"md\", data, ...props }: TSelect,\n ref: ForwardedRef<HTMLInputElement>\n) => {\n const classes = useStyles({ size })\n return (\n <SelectMantine\n ref={ref}\n data={data}\n withCheckIcon={false}\n classNames={classes}\n size={size}\n {...props}\n />\n )\n}\n\nexport const Select = React.forwardRef(SelectRaw)\n\n/**\n * **Form** wrapper for a Select component that automagically registers the Select to the current form context (from **Form**).\n * It also connects to the error-context from **ConnectedForm** to show server-side validation errors.\n * @param name Name of the form item\n * @param min Quick validation for numbers\n * @param max Quick validation for numbers\n * @param minLength Quick validation for strings\n * @param maxLength Quick validation for strings\n * @param validation Validation rules for client-side validation\n * @param props Props passed to the Select component\n * @constructor\n */\nexport const FormSelect: React.FC<TSelect & TFormControl<HTMLSelectElement>> = ({\n name,\n min,\n max,\n minLength,\n maxLength,\n validation,\n ...props\n}) => {\n const form = useFormContext()\n const errorContext = useErrorContext()\n\n const formError = form.formState.errors[name]\n const fetchErrors = errorContext.errors[name]\n\n const errors = [formError?.message as string, fetchErrors].flat().filter((ent) => ent)\n\n return (\n <Controller\n control={form.control}\n name={name}\n rules={{\n min,\n minLength,\n maxLength,\n max,\n validate: validation,\n }}\n disabled={props.disabled}\n render={({ field: { onChange, ...field } }) => (\n <Select\n {...field}\n {...props}\n error={errors.length > 0 && <FormErrors errors={errors} />}\n onChange={(value) => {\n onChange({ target: { value, name } })\n value && props.onChange?.(value)\n }}\n />\n )}\n />\n )\n}\n"],"names":["FormSelect","Select","useStyles","size","defaultStyles","getDefaultFormStyles","option","classes","selected","dropdown","SelectRaw","ref","data","props","SelectMantine","withCheckIcon","classNames","React","forwardRef","name","min","max","minLength","maxLength","validation","form","useFormContext","errorContext","useErrorContext","formError","formState","errors","fetchErrors","message","flat","filter","ent","Controller","control","rules","validate","disabled","render","field","onChange","error","length","FormErrors","value","target"],"mappings":"mPA6DaA,oBAAAA,gBAdAC,gBAAAA,6EA3CwC,6CAChB,8EACD,8BACY,wCACrB,6CAEA,2FACP,+hEAEpB,MAAMC,UAAY,CAAC,CAAEC,IAAI,CAAe,IACtC,MAAMC,cAAgBC,GAAAA,kCAAoB,IAC1C,OAAO,uCACFD,gBACHE,OAAQ,CAAC,EAAEC,wBAAO,CAACD,MAAM,CAAC,CAAC,EAAEH,OAAS,KAAOI,wBAAO,CAAC,eAAe,CAAG,GAAG,CAAC,CAC3EC,SAAUD,wBAAO,CAACC,QAAQ,CAC1BC,SAAUF,wBAAO,CAACE,QAAQ,EAE9B,EASA,MAAMC,UAAY,QAEhBC,UADA,CAAER,KAAO,IAAI,CAAES,IAAI,CAAqB,QAAhBC,yCAAtBV,OAAaS,SAGf,MAAML,QAAUL,UAAU,CAAEC,IAAK,GACjC,MACE,oBAACW,YAAa,iBACZH,IAAKA,IACLC,KAAMA,KACNG,cAAe,MACfC,WAAYT,QACZJ,KAAMA,MACFU,OAGV,EAEO,MAAMZ,OAASgB,cAAK,CAACC,UAAU,CAACR,WAchC,MAAMV,WAAkE,YAAC,CAC9EmB,IAAI,CACJC,GAAG,CACHC,GAAG,CACHC,SAAS,CACTC,SAAS,CACTC,UAAU,CAEX,QADIX,yCANHM,OACAC,MACAC,MACAC,YACAC,YACAC,eAGA,MAAMC,KAAOC,GAAAA,oBAAc,IAC3B,MAAMC,aAAeC,GAAAA,qBAAe,IAEpC,MAAMC,UAAYJ,KAAKK,SAAS,CAACC,MAAM,CAACZ,KAAK,CAC7C,MAAMa,YAAcL,aAAaI,MAAM,CAACZ,KAAK,CAE7C,MAAMY,OAAS,CAACF,kBAAAA,0BAAAA,UAAWI,OAAO,CAAYD,YAAY,CAACE,IAAI,GAAGC,MAAM,CAAC,AAACC,KAAQA,KAElF,MACE,oBAACC,yBAAU,EACTC,QAASb,KAAKa,OAAO,CACrBnB,KAAMA,KACNoB,MAAO,CACLnB,IACAE,UACAC,UACAF,IACAmB,SAAUhB,UACZ,EACAiB,SAAU5B,MAAM4B,QAAQ,CACxBC,OAAQ,YAAC,CAAEC,MAAO,CAAEC,QAAQ,CAAY,CAAE,QAATD,wCAAtBA,OAASC,mBAClB,oBAAC3C,8CACK0C,MACA9B,QACJgC,MAAOd,OAAOe,MAAM,CAAG,GAAK,oBAACC,sBAAU,EAAChB,OAAQA,SAChDa,SAAU,AAACI,YAEAnC,gBADT+B,SAAS,CAAEK,OAAQ,CAAED,MAAO7B,IAAK,CAAE,EACnC6B,CAAAA,SAASnC,gBAAAA,MAAM+B,QAAQ,UAAd/B,gCAAAA,qBAAAA,MAAiBmC,OAC5B,OAKV"}
1
+ {"version":3,"sources":["../../../../../src/components/Form/Select/Select.tsx"],"sourcesContent":["/* Copyright (C) Greenbone AG\n *\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\nimport { Select as SelectMantine, SelectProps } from \"@mantine/core\"\nimport { getDefaultFormStyles } from \"../sharedStyles\"\nimport React, { ForwardedRef } from \"react\"\nimport { useErrorContext, useFormContext } from \"../Form\"\nimport { Controller } from \"react-hook-form\"\nimport { TFormControl } from \"../Form/types\"\nimport { FormErrors } from \"../Form/FormErrors\"\nimport classes from \"./Select.module.css\"\n\nconst useStyles = ({ size }: SelectProps) => {\n const defaultStyles = getDefaultFormStyles()\n return {\n ...defaultStyles,\n option: `${classes.option} ${size === \"lg\" ? classes[\"option-large\"] : \"\"}`,\n selected: classes.selected,\n dropdown: classes.dropdown,\n }\n}\n\ntype TSelect = Modify<\n SelectProps,\n {\n size?: \"md\" | \"lg\"\n }\n>\n\nconst SelectRaw = (\n { size = \"md\", data, ...props }: TSelect,\n ref: ForwardedRef<HTMLInputElement>\n) => {\n const classes = useStyles({ size })\n return (\n <SelectMantine\n ref={ref}\n data={data}\n withCheckIcon={false}\n classNames={classes}\n size={size}\n {...props}\n />\n )\n}\n\nexport const Select = React.forwardRef(SelectRaw)\n\n/**\n * **Form** wrapper for a Select component that automagically registers the Select to the current form context (from **Form**).\n * It also connects to the error-context from **ConnectedForm** to show server-side validation errors.\n * @param name Name of the form item\n * @param min Quick validation for numbers\n * @param max Quick validation for numbers\n * @param minLength Quick validation for strings\n * @param maxLength Quick validation for strings\n * @param validation Validation rules for client-side validation\n * @param props Props passed to the Select component\n * @constructor\n */\nexport const FormSelect: React.FC<TSelect & TFormControl<HTMLSelectElement>> = ({\n name,\n min,\n max,\n minLength,\n maxLength,\n validation,\n ...props\n}) => {\n const form = useFormContext()\n const errorContext = useErrorContext()\n\n const formError = form.formState.errors[name]\n const fetchErrors = errorContext.errors[name]\n\n const errors = [formError?.message as string, fetchErrors].flat().filter((ent) => ent)\n\n return (\n <Controller\n control={form.control}\n name={name}\n rules={{\n min,\n minLength,\n maxLength,\n max,\n validate: validation,\n }}\n disabled={props.disabled}\n render={({ field: { onChange, ...field } }) => (\n <Select\n {...field}\n {...props}\n error={errors.length > 0 && <FormErrors errors={errors} />}\n onChange={(value) => {\n onChange({ target: { value, name } })\n value && props.onChange?.(value)\n }}\n />\n )}\n />\n )\n}\n"],"names":["FormSelect","Select","useStyles","size","defaultStyles","getDefaultFormStyles","option","classes","selected","dropdown","SelectRaw","data","props","ref","SelectMantine","withCheckIcon","classNames","React","forwardRef","name","min","max","minLength","maxLength","validation","form","useFormContext","errorContext","useErrorContext","formError","formState","errors","fetchErrors","message","flat","filter","ent","Controller","control","rules","validate","disabled","render","field","onChange","error","length","FormErrors","value","target"],"mappings":"mPA6DaA,oBAAAA,gBAdAC,gBAAAA,6EA3CwC,6CAChB,8EACD,8BACY,wCACrB,6CAEA,2FACP,43EAEpB,MAAMC,UAAY,CAAC,CAAEC,IAAI,CAAe,IACtC,MAAMC,cAAgBC,GAAAA,kCAAoB,IAC1C,OAAO,uCACFD,gBACHE,OAAQ,CAAC,EAAEC,wBAAO,CAACD,MAAM,CAAC,CAAC,EAAEH,OAAS,KAAOI,wBAAO,CAAC,eAAe,CAAG,GAAG,CAAC,CAC3EC,SAAUD,wBAAO,CAACC,QAAQ,CAC1BC,SAAUF,wBAAO,CAACE,QAAQ,EAE9B,EASA,MAAMC,UAAY,iDAChB,CAAEP,KAAO,IAAI,CAAEQ,IAAI,CAAqB,OAAhBC,yDACxBC,WAEA,MAAMN,QAAUL,UAAU,CAAEC,IAAK,GACjC,MACE,oBAACW,YAAa,iBACZD,IAAKA,IACLF,KAAMA,KACNI,cAAe,MACfC,WAAYT,QACZJ,KAAMA,MACFS,OAGV,EAEO,MAAMX,OAASgB,cAAK,CAACC,UAAU,CAACR,WAchC,MAAMV,WAAkE,QAAC,CAC9EmB,IAAI,CACJC,GAAG,CACHC,GAAG,CACHC,SAAS,CACTC,SAAS,CACTC,UAAU,CAEX,IADIZ,+FAEH,MAAMa,KAAOC,GAAAA,oBAAc,IAC3B,MAAMC,aAAeC,GAAAA,qBAAe,IAEpC,MAAMC,UAAYJ,KAAKK,SAAS,CAACC,MAAM,CAACZ,KAAK,CAC7C,MAAMa,YAAcL,aAAaI,MAAM,CAACZ,KAAK,CAE7C,MAAMY,OAAS,CAACF,kBAAAA,0BAAAA,UAAWI,OAAO,CAAYD,YAAY,CAACE,IAAI,GAAGC,MAAM,CAAC,AAACC,KAAQA,KAElF,MACE,oBAACC,yBAAU,EACTC,QAASb,KAAKa,OAAO,CACrBnB,KAAMA,KACNoB,MAAO,CACLnB,IACAE,UACAC,UACAF,IACAmB,SAAUhB,UACZ,EACAiB,SAAU7B,MAAM6B,QAAQ,CACxBC,OAAQ,QAAC,CAAEC,UAAAA,CAA+B,IAAxB,CAAEC,QAAQ,CAAY,MAAPD,0DAC/B,oBAAC1C,8CACK0C,MACA/B,QACJiC,MAAOd,OAAOe,MAAM,CAAG,GAAK,oBAACC,sBAAU,EAAChB,OAAQA,SAChDa,SAAU,AAACI,YAEApC,gBADTgC,SAAS,CAAEK,OAAQ,CAAED,MAAO7B,IAAK,CAAE,EACnC6B,CAAAA,SAASpC,gBAAAA,MAAMgC,QAAQ,UAAdhC,gCAAAA,qBAAAA,MAAiBoC,OAC5B,OAKV"}