no-frills-ui 0.0.14-alpha.1 → 0.0.14-alpha.3

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 (294) hide show
  1. package/README.md +28 -22
  2. package/dist/index.js +920 -537
  3. package/dist/index.js.map +1 -1
  4. package/lib-esm/components/Accordion/Accordion.d.ts +3 -3
  5. package/lib-esm/components/Accordion/Accordion.d.ts.map +1 -0
  6. package/lib-esm/components/Accordion/Accordion.js +6 -3
  7. package/lib-esm/components/Accordion/Accordion.js.map +1 -1
  8. package/lib-esm/components/Accordion/AccordionStep.d.ts +3 -2
  9. package/lib-esm/components/Accordion/AccordionStep.d.ts.map +1 -0
  10. package/lib-esm/components/Accordion/AccordionStep.js +31 -22
  11. package/lib-esm/components/Accordion/AccordionStep.js.map +1 -1
  12. package/lib-esm/components/Accordion/index.d.ts +1 -0
  13. package/lib-esm/components/Accordion/index.d.ts.map +1 -0
  14. package/lib-esm/components/Accordion/index.js.map +1 -1
  15. package/lib-esm/components/Badge/Badge.d.ts +1 -0
  16. package/lib-esm/components/Badge/Badge.d.ts.map +1 -0
  17. package/lib-esm/components/Badge/Badge.js +5 -6
  18. package/lib-esm/components/Badge/Badge.js.map +1 -1
  19. package/lib-esm/components/Badge/index.d.ts +1 -0
  20. package/lib-esm/components/Badge/index.d.ts.map +1 -0
  21. package/lib-esm/components/Badge/index.js.map +1 -1
  22. package/lib-esm/components/Button/ActionButton.d.ts +1 -0
  23. package/lib-esm/components/Button/ActionButton.d.ts.map +1 -0
  24. package/lib-esm/components/Button/ActionButton.js.map +1 -1
  25. package/lib-esm/components/Button/Button.d.ts +1 -0
  26. package/lib-esm/components/Button/Button.d.ts.map +1 -0
  27. package/lib-esm/components/Button/Button.js.map +1 -1
  28. package/lib-esm/components/Button/IconButton.d.ts +1 -0
  29. package/lib-esm/components/Button/IconButton.d.ts.map +1 -0
  30. package/lib-esm/components/Button/IconButton.js.map +1 -1
  31. package/lib-esm/components/Button/LinkButton.d.ts +1 -0
  32. package/lib-esm/components/Button/LinkButton.d.ts.map +1 -0
  33. package/lib-esm/components/Button/LinkButton.js +2 -1
  34. package/lib-esm/components/Button/LinkButton.js.map +1 -1
  35. package/lib-esm/components/Button/RaisedButton.d.ts +1 -0
  36. package/lib-esm/components/Button/RaisedButton.d.ts.map +1 -0
  37. package/lib-esm/components/Button/RaisedButton.js.map +1 -1
  38. package/lib-esm/components/Button/index.d.ts +1 -0
  39. package/lib-esm/components/Button/index.d.ts.map +1 -0
  40. package/lib-esm/components/Button/index.js.map +1 -1
  41. package/lib-esm/components/Card/Card.d.ts +1 -0
  42. package/lib-esm/components/Card/Card.d.ts.map +1 -0
  43. package/lib-esm/components/Card/Card.js +1 -1
  44. package/lib-esm/components/Card/Card.js.map +1 -1
  45. package/lib-esm/components/Card/index.d.ts +1 -0
  46. package/lib-esm/components/Card/index.d.ts.map +1 -0
  47. package/lib-esm/components/Card/index.js.map +1 -1
  48. package/lib-esm/components/Chip/Chip.d.ts +1 -0
  49. package/lib-esm/components/Chip/Chip.d.ts.map +1 -0
  50. package/lib-esm/components/Chip/Chip.js +1 -1
  51. package/lib-esm/components/Chip/Chip.js.map +1 -1
  52. package/lib-esm/components/Chip/index.d.ts +1 -0
  53. package/lib-esm/components/Chip/index.d.ts.map +1 -0
  54. package/lib-esm/components/Chip/index.js.map +1 -1
  55. package/lib-esm/components/ChipInput/ChipInput.d.ts +1 -0
  56. package/lib-esm/components/ChipInput/ChipInput.d.ts.map +1 -0
  57. package/lib-esm/components/ChipInput/ChipInput.js +21 -12
  58. package/lib-esm/components/ChipInput/ChipInput.js.map +1 -1
  59. package/lib-esm/components/ChipInput/index.d.ts +1 -0
  60. package/lib-esm/components/ChipInput/index.d.ts.map +1 -0
  61. package/lib-esm/components/ChipInput/index.js.map +1 -1
  62. package/lib-esm/components/Dialog/AlertDialog.d.ts +1 -0
  63. package/lib-esm/components/Dialog/AlertDialog.d.ts.map +1 -0
  64. package/lib-esm/components/Dialog/AlertDialog.js +4 -4
  65. package/lib-esm/components/Dialog/AlertDialog.js.map +1 -1
  66. package/lib-esm/components/Dialog/ConfirmDialog.d.ts +1 -0
  67. package/lib-esm/components/Dialog/ConfirmDialog.d.ts.map +1 -0
  68. package/lib-esm/components/Dialog/ConfirmDialog.js +8 -3
  69. package/lib-esm/components/Dialog/ConfirmDialog.js.map +1 -1
  70. package/lib-esm/components/Dialog/Dialog.d.ts +5 -5
  71. package/lib-esm/components/Dialog/Dialog.d.ts.map +1 -0
  72. package/lib-esm/components/Dialog/Dialog.js +22 -16
  73. package/lib-esm/components/Dialog/Dialog.js.map +1 -1
  74. package/lib-esm/components/Dialog/PromptDialog.d.ts +1 -0
  75. package/lib-esm/components/Dialog/PromptDialog.d.ts.map +1 -0
  76. package/lib-esm/components/Dialog/PromptDialog.js +2 -2
  77. package/lib-esm/components/Dialog/PromptDialog.js.map +1 -1
  78. package/lib-esm/components/Dialog/index.d.ts +1 -0
  79. package/lib-esm/components/Dialog/index.d.ts.map +1 -0
  80. package/lib-esm/components/Dialog/index.js.map +1 -1
  81. package/lib-esm/components/DragAndDrop/DragAndDrop.d.ts +2 -1
  82. package/lib-esm/components/DragAndDrop/DragAndDrop.d.ts.map +1 -0
  83. package/lib-esm/components/DragAndDrop/DragAndDrop.js +4 -2
  84. package/lib-esm/components/DragAndDrop/DragAndDrop.js.map +1 -1
  85. package/lib-esm/components/DragAndDrop/DragItem.d.ts +1 -0
  86. package/lib-esm/components/DragAndDrop/DragItem.d.ts.map +1 -0
  87. package/lib-esm/components/DragAndDrop/DragItem.js +25 -17
  88. package/lib-esm/components/DragAndDrop/DragItem.js.map +1 -1
  89. package/lib-esm/components/DragAndDrop/index.d.ts +1 -0
  90. package/lib-esm/components/DragAndDrop/index.d.ts.map +1 -0
  91. package/lib-esm/components/DragAndDrop/index.js.map +1 -1
  92. package/lib-esm/components/DragAndDrop/types.d.ts +1 -0
  93. package/lib-esm/components/DragAndDrop/types.d.ts.map +1 -0
  94. package/lib-esm/components/DragAndDrop/types.js +1 -1
  95. package/lib-esm/components/DragAndDrop/types.js.map +1 -1
  96. package/lib-esm/components/Drawer/Drawer.d.ts +1 -0
  97. package/lib-esm/components/Drawer/Drawer.d.ts.map +1 -0
  98. package/lib-esm/components/Drawer/Drawer.js +10 -8
  99. package/lib-esm/components/Drawer/Drawer.js.map +1 -1
  100. package/lib-esm/components/Drawer/index.d.ts +2 -1
  101. package/lib-esm/components/Drawer/index.d.ts.map +1 -0
  102. package/lib-esm/components/Drawer/index.js +1 -1
  103. package/lib-esm/components/Drawer/index.js.map +1 -1
  104. package/lib-esm/components/Groups/Group.d.ts +1 -0
  105. package/lib-esm/components/Groups/Group.d.ts.map +1 -0
  106. package/lib-esm/components/Groups/Group.js +26 -14
  107. package/lib-esm/components/Groups/Group.js.map +1 -1
  108. package/lib-esm/components/Groups/GroupLabel.d.ts +1 -0
  109. package/lib-esm/components/Groups/GroupLabel.d.ts.map +1 -0
  110. package/lib-esm/components/Groups/GroupLabel.js.map +1 -1
  111. package/lib-esm/components/Groups/index.d.ts +1 -0
  112. package/lib-esm/components/Groups/index.d.ts.map +1 -0
  113. package/lib-esm/components/Groups/index.js.map +1 -1
  114. package/lib-esm/components/Input/Checkbox.d.ts +1 -0
  115. package/lib-esm/components/Input/Checkbox.d.ts.map +1 -0
  116. package/lib-esm/components/Input/Checkbox.js +11 -8
  117. package/lib-esm/components/Input/Checkbox.js.map +1 -1
  118. package/lib-esm/components/Input/Dropdown.d.ts +3 -2
  119. package/lib-esm/components/Input/Dropdown.d.ts.map +1 -0
  120. package/lib-esm/components/Input/Dropdown.js +22 -22
  121. package/lib-esm/components/Input/Dropdown.js.map +1 -1
  122. package/lib-esm/components/Input/Input.d.ts +1 -0
  123. package/lib-esm/components/Input/Input.d.ts.map +1 -0
  124. package/lib-esm/components/Input/Input.js +19 -10
  125. package/lib-esm/components/Input/Input.js.map +1 -1
  126. package/lib-esm/components/Input/Radio.d.ts +1 -0
  127. package/lib-esm/components/Input/Radio.d.ts.map +1 -0
  128. package/lib-esm/components/Input/Radio.js +4 -3
  129. package/lib-esm/components/Input/Radio.js.map +1 -1
  130. package/lib-esm/components/Input/RadioButton.d.ts +1 -0
  131. package/lib-esm/components/Input/RadioButton.d.ts.map +1 -0
  132. package/lib-esm/components/Input/RadioButton.js +1 -1
  133. package/lib-esm/components/Input/RadioButton.js.map +1 -1
  134. package/lib-esm/components/Input/Select.d.ts +1 -0
  135. package/lib-esm/components/Input/Select.d.ts.map +1 -0
  136. package/lib-esm/components/Input/Select.js +17 -9
  137. package/lib-esm/components/Input/Select.js.map +1 -1
  138. package/lib-esm/components/Input/TextArea.d.ts +1 -0
  139. package/lib-esm/components/Input/TextArea.d.ts.map +1 -0
  140. package/lib-esm/components/Input/TextArea.js +17 -9
  141. package/lib-esm/components/Input/TextArea.js.map +1 -1
  142. package/lib-esm/components/Input/Toggle.d.ts +1 -0
  143. package/lib-esm/components/Input/Toggle.d.ts.map +1 -0
  144. package/lib-esm/components/Input/Toggle.js +5 -5
  145. package/lib-esm/components/Input/Toggle.js.map +1 -1
  146. package/lib-esm/components/Input/index.d.ts +1 -0
  147. package/lib-esm/components/Input/index.d.ts.map +1 -0
  148. package/lib-esm/components/Input/index.js.map +1 -1
  149. package/lib-esm/components/Menu/Menu.d.ts +2 -1
  150. package/lib-esm/components/Menu/Menu.d.ts.map +1 -0
  151. package/lib-esm/components/Menu/Menu.js +3 -2
  152. package/lib-esm/components/Menu/Menu.js.map +1 -1
  153. package/lib-esm/components/Menu/MenuContext.d.ts +12 -5
  154. package/lib-esm/components/Menu/MenuContext.d.ts.map +1 -0
  155. package/lib-esm/components/Menu/MenuContext.js.map +1 -1
  156. package/lib-esm/components/Menu/MenuItem.d.ts +3 -2
  157. package/lib-esm/components/Menu/MenuItem.d.ts.map +1 -0
  158. package/lib-esm/components/Menu/MenuItem.js +9 -5
  159. package/lib-esm/components/Menu/MenuItem.js.map +1 -1
  160. package/lib-esm/components/Menu/index.d.ts +1 -0
  161. package/lib-esm/components/Menu/index.d.ts.map +1 -0
  162. package/lib-esm/components/Menu/index.js.map +1 -1
  163. package/lib-esm/components/Modal/Modal.d.ts +1 -0
  164. package/lib-esm/components/Modal/Modal.d.ts.map +1 -0
  165. package/lib-esm/components/Modal/Modal.js +6 -4
  166. package/lib-esm/components/Modal/Modal.js.map +1 -1
  167. package/lib-esm/components/Modal/index.d.ts +1 -0
  168. package/lib-esm/components/Modal/index.d.ts.map +1 -0
  169. package/lib-esm/components/Modal/index.js.map +1 -1
  170. package/lib-esm/components/Notification/Notification.d.ts +1 -0
  171. package/lib-esm/components/Notification/Notification.d.ts.map +1 -0
  172. package/lib-esm/components/Notification/Notification.js +8 -4
  173. package/lib-esm/components/Notification/Notification.js.map +1 -1
  174. package/lib-esm/components/Notification/NotificationManager.d.ts +1 -0
  175. package/lib-esm/components/Notification/NotificationManager.d.ts.map +1 -0
  176. package/lib-esm/components/Notification/NotificationManager.js +11 -9
  177. package/lib-esm/components/Notification/NotificationManager.js.map +1 -1
  178. package/lib-esm/components/Notification/index.d.ts +1 -0
  179. package/lib-esm/components/Notification/index.d.ts.map +1 -0
  180. package/lib-esm/components/Notification/index.js.map +1 -1
  181. package/lib-esm/components/Notification/style.d.ts +1 -0
  182. package/lib-esm/components/Notification/style.d.ts.map +1 -0
  183. package/lib-esm/components/Notification/style.js +10 -8
  184. package/lib-esm/components/Notification/style.js.map +1 -1
  185. package/lib-esm/components/Notification/types.d.ts +1 -0
  186. package/lib-esm/components/Notification/types.d.ts.map +1 -0
  187. package/lib-esm/components/Notification/types.js +0 -1
  188. package/lib-esm/components/Notification/types.js.map +1 -1
  189. package/lib-esm/components/Popover/Popover.d.ts +1 -0
  190. package/lib-esm/components/Popover/Popover.d.ts.map +1 -0
  191. package/lib-esm/components/Popover/Popover.js +20 -17
  192. package/lib-esm/components/Popover/Popover.js.map +1 -1
  193. package/lib-esm/components/Popover/index.d.ts +1 -0
  194. package/lib-esm/components/Popover/index.d.ts.map +1 -0
  195. package/lib-esm/components/Popover/index.js.map +1 -1
  196. package/lib-esm/components/Spinner/Spinner.d.ts +1 -0
  197. package/lib-esm/components/Spinner/Spinner.d.ts.map +1 -0
  198. package/lib-esm/components/Spinner/Spinner.js +10 -6
  199. package/lib-esm/components/Spinner/Spinner.js.map +1 -1
  200. package/lib-esm/components/Spinner/index.d.ts +1 -0
  201. package/lib-esm/components/Spinner/index.d.ts.map +1 -0
  202. package/lib-esm/components/Spinner/index.js.map +1 -1
  203. package/lib-esm/components/Stepper/Step.d.ts +1 -0
  204. package/lib-esm/components/Stepper/Step.d.ts.map +1 -0
  205. package/lib-esm/components/Stepper/Step.js +1 -0
  206. package/lib-esm/components/Stepper/Step.js.map +1 -1
  207. package/lib-esm/components/Stepper/Stepper.d.ts +4 -3
  208. package/lib-esm/components/Stepper/Stepper.d.ts.map +1 -0
  209. package/lib-esm/components/Stepper/Stepper.js +17 -9
  210. package/lib-esm/components/Stepper/Stepper.js.map +1 -1
  211. package/lib-esm/components/Stepper/index.d.ts +1 -0
  212. package/lib-esm/components/Stepper/index.d.ts.map +1 -0
  213. package/lib-esm/components/Stepper/index.js.map +1 -1
  214. package/lib-esm/components/Tabs/Tab.d.ts +1 -0
  215. package/lib-esm/components/Tabs/Tab.d.ts.map +1 -0
  216. package/lib-esm/components/Tabs/Tab.js.map +1 -1
  217. package/lib-esm/components/Tabs/Tabs.d.ts +6 -5
  218. package/lib-esm/components/Tabs/Tabs.d.ts.map +1 -0
  219. package/lib-esm/components/Tabs/Tabs.js +12 -9
  220. package/lib-esm/components/Tabs/Tabs.js.map +1 -1
  221. package/lib-esm/components/Tabs/index.d.ts +1 -0
  222. package/lib-esm/components/Tabs/index.d.ts.map +1 -0
  223. package/lib-esm/components/Tabs/index.js.map +1 -1
  224. package/lib-esm/components/Toast/Toast.d.ts +2 -0
  225. package/lib-esm/components/Toast/Toast.d.ts.map +1 -0
  226. package/lib-esm/components/Toast/Toast.js +9 -8
  227. package/lib-esm/components/Toast/Toast.js.map +1 -1
  228. package/lib-esm/components/Toast/ToastStory.d.ts +1 -0
  229. package/lib-esm/components/Toast/ToastStory.d.ts.map +1 -0
  230. package/lib-esm/components/Toast/ToastStory.js +1 -1
  231. package/lib-esm/components/Toast/ToastStory.js.map +1 -1
  232. package/lib-esm/components/Toast/index.d.ts +1 -0
  233. package/lib-esm/components/Toast/index.d.ts.map +1 -0
  234. package/lib-esm/components/Toast/index.js.map +1 -1
  235. package/lib-esm/components/Tooltip/Tooltip.d.ts +1 -0
  236. package/lib-esm/components/Tooltip/Tooltip.d.ts.map +1 -0
  237. package/lib-esm/components/Tooltip/Tooltip.js +5 -6
  238. package/lib-esm/components/Tooltip/Tooltip.js.map +1 -1
  239. package/lib-esm/components/Tooltip/index.d.ts +1 -0
  240. package/lib-esm/components/Tooltip/index.d.ts.map +1 -0
  241. package/lib-esm/components/Tooltip/index.js.map +1 -1
  242. package/lib-esm/components/index.d.ts +2 -0
  243. package/lib-esm/components/index.d.ts.map +1 -0
  244. package/lib-esm/components/index.js +1 -0
  245. package/lib-esm/components/index.js.map +1 -1
  246. package/lib-esm/icons/CheckCircle.d.ts +2 -1
  247. package/lib-esm/icons/CheckCircle.d.ts.map +1 -0
  248. package/lib-esm/icons/CheckCircle.js +1 -1
  249. package/lib-esm/icons/CheckCircle.js.map +1 -1
  250. package/lib-esm/icons/Close.d.ts +2 -1
  251. package/lib-esm/icons/Close.d.ts.map +1 -0
  252. package/lib-esm/icons/Close.js +1 -1
  253. package/lib-esm/icons/Close.js.map +1 -1
  254. package/lib-esm/icons/DragIndicator.d.ts +2 -1
  255. package/lib-esm/icons/DragIndicator.d.ts.map +1 -0
  256. package/lib-esm/icons/DragIndicator.js +1 -1
  257. package/lib-esm/icons/DragIndicator.js.map +1 -1
  258. package/lib-esm/icons/ErrorOutline.d.ts +2 -1
  259. package/lib-esm/icons/ErrorOutline.d.ts.map +1 -0
  260. package/lib-esm/icons/ErrorOutline.js +1 -1
  261. package/lib-esm/icons/ErrorOutline.js.map +1 -1
  262. package/lib-esm/icons/ExpandMore.d.ts +2 -1
  263. package/lib-esm/icons/ExpandMore.d.ts.map +1 -0
  264. package/lib-esm/icons/ExpandMore.js +1 -1
  265. package/lib-esm/icons/ExpandMore.js.map +1 -1
  266. package/lib-esm/icons/FiberManualRecord.d.ts +2 -1
  267. package/lib-esm/icons/FiberManualRecord.d.ts.map +1 -0
  268. package/lib-esm/icons/FiberManualRecord.js +1 -1
  269. package/lib-esm/icons/FiberManualRecord.js.map +1 -1
  270. package/lib-esm/icons/Info.d.ts +2 -1
  271. package/lib-esm/icons/Info.d.ts.map +1 -0
  272. package/lib-esm/icons/Info.js +1 -1
  273. package/lib-esm/icons/Info.js.map +1 -1
  274. package/lib-esm/icons/ReportProblem.d.ts +2 -1
  275. package/lib-esm/icons/ReportProblem.d.ts.map +1 -0
  276. package/lib-esm/icons/ReportProblem.js +1 -1
  277. package/lib-esm/icons/ReportProblem.js.map +1 -1
  278. package/lib-esm/icons/index.d.ts +1 -0
  279. package/lib-esm/icons/index.d.ts.map +1 -0
  280. package/lib-esm/icons/index.js.map +1 -1
  281. package/lib-esm/index.d.ts +1 -0
  282. package/lib-esm/index.d.ts.map +1 -0
  283. package/lib-esm/index.js.map +1 -1
  284. package/lib-esm/shared/LayerManager.d.ts +29 -2
  285. package/lib-esm/shared/LayerManager.d.ts.map +1 -0
  286. package/lib-esm/shared/LayerManager.js +95 -45
  287. package/lib-esm/shared/LayerManager.js.map +1 -1
  288. package/lib-esm/shared/constants.d.ts +1 -0
  289. package/lib-esm/shared/constants.d.ts.map +1 -0
  290. package/lib-esm/shared/constants.js.map +1 -1
  291. package/lib-esm/shared/styles.d.ts +1 -0
  292. package/lib-esm/shared/styles.d.ts.map +1 -0
  293. package/lib-esm/shared/styles.js.map +1 -1
  294. package/package.json +93 -74
@@ -20,12 +20,14 @@ const Label = styled.label `
20
20
  background-color: var(--background, ${constants.BACKGROUND});
21
21
 
22
22
  /** Focused */
23
- &:has(:focus), &:has(:active) {
23
+ &:has(:focus),
24
+ &:has(:active) {
24
25
  border-color: var(--primary, ${constants.PRIMARY});
25
26
  box-shadow: 0 0 0 4px var(--primary-light, ${constants.PRIMARY_LIGHT});
26
27
  }
27
28
 
28
- &:has(:focus) > span, &:has(:active) > span {
29
+ &:has(:focus) > span,
30
+ &:has(:active) > span {
29
31
  color: var(--primary, ${constants.PRIMARY});
30
32
  }
31
33
 
@@ -34,7 +36,7 @@ const Label = styled.label `
34
36
  border-color: var(--disabled-border, ${constants.DISABLED_BORDER});
35
37
  background-color: var(--disabled-background, ${constants.DISABLED_BACKGROUND});
36
38
  }
37
-
39
+
38
40
  &:has(:disabled) > span {
39
41
  color: #777;
40
42
  }
@@ -45,7 +47,8 @@ const Label = styled.label `
45
47
  box-shadow: 0 0 0 4px var(--error-light, ${constants.ERROR_LIGHT});
46
48
  }
47
49
 
48
- ${props => props.touched ? `
50
+ ${(props) => props.touched
51
+ ? `
49
52
  &:has(:invalid) {
50
53
  border-color: var(--error, ${constants.ERROR});
51
54
  }
@@ -53,16 +56,19 @@ const Label = styled.label `
53
56
  &:has(:invalid) > span {
54
57
  color: var(--error, ${constants.ERROR});
55
58
  }
56
- ` : ''}
57
-
59
+ `
60
+ : ''}
61
+
58
62
  /** Error */
59
- ${props => props.errorText ? `
63
+ ${(props) => props.errorText
64
+ ? `
60
65
  border-color: var(--error, ${constants.ERROR});
61
66
 
62
67
  & > span {
63
68
  color: var(--error, ${constants.ERROR});
64
69
  }
65
- ` : ''}
70
+ `
71
+ : ''}
66
72
 
67
73
  /** Required */
68
74
  &:has(:required) > span:after {
@@ -90,21 +96,24 @@ const Label = styled.label `
90
96
  transition: all 300ms ease;
91
97
  }
92
98
 
93
- &:has(:focus) > span, &:has(:placeholder-shown) > span {
99
+ &:has(:focus) > span,
100
+ &:has(:placeholder-shown) > span {
94
101
  top: -8px;
95
102
  background: var(--background, ${constants.BACKGROUND});
96
103
  font-size: 12px;
97
104
  line-height: 14px;
98
105
  }
99
106
 
100
- ${props => props.text !== '' ? `
107
+ ${(props) => props.text !== ''
108
+ ? `
101
109
  & > span {
102
110
  top: -8px;
103
111
  background: var(--background, ${constants.BACKGROUND});
104
112
  font-size: 12px;
105
113
  line-height: 14px;
106
114
  }
107
- ` : ''}
115
+ `
116
+ : ''}
108
117
  `;
109
118
  // Error message container
110
119
  const ErrorContainer = styled.div `
@@ -179,7 +188,7 @@ export default function ChipInput(props) {
179
188
  * @param chipToRemove The chip value to remove
180
189
  */
181
190
  const removeChip = (chipToRemove) => {
182
- const newValue = value.filter(chip => chip !== chipToRemove);
191
+ const newValue = value.filter((chip) => chip !== chipToRemove);
183
192
  updateValue(newValue);
184
193
  };
185
194
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"ChipInput.js","sourceRoot":"","sources":["../../../src/components/ChipInput/ChipInput.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ChipInput.js","sourceRoot":"","sources":["../../../src/components/ChipInput/ChipInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from '@emotion/styled';\nimport constants from '../../shared/constants';\nimport Chip from '../Chip/Chip';\nimport { DragAndDrop, ORIENTATION } from '../DragAndDrop';\n\n// Prop types definition\ntype ChipInputProps = PropTypes.InferProps<typeof ChipInput.propTypes>;\n\n// Label component for the ChipInput\nconst Label = styled.label<{\n text: string;\n touched?: boolean;\n errorText?: string;\n}>`\n display: inline-flex;\n flex-direction: column;\n flex: 1;\n position: relative;\n margin: 10px 5px;\n color: inherit;\n padding: 0 8px;\n width: 250px;\n border-radius: 3px;\n border: 1px solid var(--border-color, ${constants.BORDER_COLOR});\n background-color: var(--background, ${constants.BACKGROUND});\n\n /** Focused */\n &:has(:focus),\n &:has(:active) {\n border-color: var(--primary, ${constants.PRIMARY});\n box-shadow: 0 0 0 4px var(--primary-light, ${constants.PRIMARY_LIGHT});\n }\n\n &:has(:focus) > span,\n &:has(:active) > span {\n color: var(--primary, ${constants.PRIMARY});\n }\n\n /** Disabled */\n &:has(:disabled) {\n border-color: var(--disabled-border, ${constants.DISABLED_BORDER});\n background-color: var(--disabled-background, ${constants.DISABLED_BACKGROUND});\n }\n\n &:has(:disabled) > span {\n color: #777;\n }\n\n /** Invalid */\n &:has(:focus:invalid) {\n border-color: var(--error, ${constants.ERROR});\n box-shadow: 0 0 0 4px var(--error-light, ${constants.ERROR_LIGHT});\n }\n\n ${(props) =>\n props.touched\n ? `\n &:has(:invalid) {\n border-color: var(--error, ${constants.ERROR});\n }\n \n &:has(:invalid) > span {\n color: var(--error, ${constants.ERROR});\n }\n `\n : ''}\n\n /** Error */\n ${(props) =>\n props.errorText\n ? `\n border-color: var(--error, ${constants.ERROR});\n\n & > span {\n color: var(--error, ${constants.ERROR});\n }\n `\n : ''}\n\n /** Required */\n &:has(:required) > span:after {\n content: '*';\n margin-left: 2px;\n color: var(--error, ${constants.ERROR});\n }\n\n & > input {\n border: none;\n outline: none;\n width: 100%;\n line-height: 30px;\n min-height: 30px;\n }\n\n /** Label Animation */\n & > span {\n position: absolute;\n padding: 0 5px;\n top: 0px;\n left: 4px;\n font-size: 14px;\n line-height: 32px;\n transition: all 300ms ease;\n }\n\n &:has(:focus) > span,\n &:has(:placeholder-shown) > span {\n top: -8px;\n background: var(--background, ${constants.BACKGROUND});\n font-size: 12px;\n line-height: 14px;\n }\n\n ${(props) =>\n props.text !== ''\n ? `\n & > span {\n top: -8px;\n background: var(--background, ${constants.BACKGROUND});\n font-size: 12px;\n line-height: 14px;\n }\n `\n : ''}\n`;\n\n// Error message container\nconst ErrorContainer = styled.div`\n color: var(--error, ${constants.ERROR});\n padding-top: 3px;\n font-size: 12px;\n line-height: 14px;\n margin-left: 3px;\n`;\n\n/**\n * A chip input component that allows users to add and remove chips (tags) by typing and pressing Enter.\n * @component\n * @example\n * ```tsx\n * <ChipInput\n * value={['tag1', 'tag2']}\n * onChange={(newTags) => console.log(newTags)}\n * label=\"Add tags\"\n * errorText=\"At least one tag is required\"\n * />\n * ```\n */\nexport default function ChipInput(\n props: ChipInputProps & React.AllHTMLAttributes<HTMLInputElement>,\n) {\n const [text, setText] = useState('');\n const [touched, setTouched] = useState(false);\n const [value, setValue] = useState<string[]>(props.value);\n const InputRef = React.useRef<HTMLInputElement>(null);\n\n // Sync internal value with props.value\n useEffect(() => {\n setValue(props.value);\n }, [props.value]);\n\n /**\n * Update the chip values and notify changes.\n * @param newValue The new array of chip values\n */\n const updateValue = (newValue: string[]) => {\n const deduped = Array.from(new Set(newValue));\n setValue(deduped);\n props.onChange?.(deduped);\n };\n\n /**\n * Marks the input as touched on focus.\n * @param e React focus event\n */\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n setTouched(true);\n if (props.onFocus) {\n props.onFocus(e);\n }\n };\n\n /**\n * Change handler for the input field.\n * @param e React change event\n */\n const handleChange: React.ChangeEventHandler<HTMLInputElement> = (e) => {\n setText(e.target.value);\n };\n\n /**\n * Adds a new chip on Enter key press.\n * @param e React keyboard event\n */\n const handleKeyUp: React.KeyboardEventHandler<HTMLInputElement> = (e) => {\n if (e.key === 'Enter' && text.trim() !== '') {\n const newValue = [...value, text.trim()];\n updateValue(newValue);\n setText('');\n }\n };\n\n /**\n * Removes a chip from the list.\n * @param chipToRemove The chip value to remove\n */\n const removeChip = (chipToRemove: string) => {\n const newValue = value.filter((chip) => chip !== chipToRemove);\n updateValue(newValue);\n };\n\n /**\n * Moves a chip from one position to another.\n * @param start The starting index of the item to move\n * @param end The ending index where the item should be placed\n */\n const onDrop = (start: number, end: number) => {\n // Clone existing elements\n const newItems = [...value];\n // Remove the element to be moved\n const item = newItems.splice(start, 1);\n // Add it back at the required position\n newItems.splice(end, 0, item[0]);\n // Update\n updateValue(newItems);\n };\n\n // Render the component\n return (\n <Label text={text} touched={touched} errorText={props.errorText}>\n <input\n {...props}\n ref={InputRef}\n type=\"text\"\n value={text}\n onChange={handleChange}\n onFocus={handleFocus}\n onKeyUp={handleKeyUp}\n required={props.required && value.length === 0}\n />\n <div>\n {value?.length > 0 && (\n <DragAndDrop orientation={ORIENTATION.HORIZONTAL} onDrop={onDrop}>\n {value.map((chip) => (\n <Chip key={chip} label={chip} onCloseClick={() => removeChip(chip)} />\n ))}\n </DragAndDrop>\n )}\n </div>\n <span>{props.label}</span>\n {props.errorText && <ErrorContainer>{props.errorText}</ErrorContainer>}\n </Label>\n );\n}\n\nChipInput.propTypes = {\n /** Label for the field */\n label: PropTypes.string.isRequired,\n /** Error message for the field */\n errorText: PropTypes.string,\n /** Values to display as chips */\n value: PropTypes.arrayOf(PropTypes.string),\n /** Callback when chips change */\n onChange: PropTypes.func,\n};\n\nChipInput.defaultProps = {\n value: [],\n};\n"]}
@@ -1 +1,2 @@
1
1
  export { default as ChipInput } from './ChipInput';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ChipInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ChipInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ChipInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC","sourcesContent":["export { default as ChipInput } from './ChipInput';\n"]}
@@ -21,3 +21,4 @@ export default class AlertDialog extends React.Component<AlertOption> {
21
21
  render(): import("@emotion/react/jsx-runtime").JSX.Element;
22
22
  }
23
23
  export {};
24
+ //# sourceMappingURL=AlertDialog.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/AlertDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,KAAK,WAAW,GAAG,SAAS,CAAC,UAAU,CAAC,OAAO,WAAW,CAAC,SAAS,CAAC,CAAC;AAEtE,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC;IACjE,OAAO,CAAC,MAAM,CAAuB;IAErC,MAAM,CAAC,SAAS;QACZ,oCAAoC;;QAEpC,4BAA4B;;QAE5B,gDAAgD;;QAEhD,2BAA2B;;MAE7B;IAEF,MAAM,CAAC,YAAY;;MAEjB;IAEK,IAAI,yBAKT;IAEF,OAAO,CAAC,KAAK,CAAqC;IAElD,MAAM;CAgBT"}
@@ -1,14 +1,14 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
2
2
  import React, { createRef } from 'react';
3
3
  import PropTypes from 'prop-types';
4
- import Dialog, { DialogBody, DialogFooter, DialogHeader } from './Dialog';
5
4
  import { Button } from '../Button';
5
+ import Dialog, { DialogBody, DialogFooter, DialogHeader } from './Dialog';
6
6
  class AlertDialog extends React.Component {
7
7
  constructor() {
8
8
  super(...arguments);
9
9
  this.dialog = createRef();
10
10
  this.show = () => {
11
- return new Promise(resolve => {
11
+ return new Promise((resolve) => {
12
12
  const onClose = () => resolve(null);
13
13
  this.dialog.current.open(onClose);
14
14
  });
@@ -16,7 +16,7 @@ class AlertDialog extends React.Component {
16
16
  this.close = () => this.dialog.current.close();
17
17
  }
18
18
  render() {
19
- return (_jsxs(Dialog, Object.assign({}, this.props.dialogProps, { ref: this.dialog, closeOnEsc: false, closeOnOverlayClick: false, children: [this.props.header && _jsx(DialogHeader, { children: this.props.header }), _jsx(DialogBody, { children: this.props.body }), _jsx(DialogFooter, { children: _jsx(Button, { onClick: this.close, children: this.props.buttonText }) })] })));
19
+ return (_jsxs(Dialog, Object.assign({}, this.props.dialogProps, { ref: this.dialog, closeOnEsc: false, closeOnOverlayClick: true, children: [this.props.header && _jsx(DialogHeader, { children: this.props.header }), _jsx(DialogBody, { children: this.props.body }), _jsx(DialogFooter, { children: _jsx(Button, { onClick: this.close, children: this.props.buttonText }) })] })));
20
20
  }
21
21
  }
22
22
  AlertDialog.propTypes = {
@@ -30,7 +30,7 @@ AlertDialog.propTypes = {
30
30
  dialogProps: PropTypes.object,
31
31
  };
32
32
  AlertDialog.defaultProps = {
33
- buttonText: 'OK'
33
+ buttonText: 'OK',
34
34
  };
35
35
  export default AlertDialog;
36
36
  //# sourceMappingURL=AlertDialog.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"AlertDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/AlertDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,MAAM,EAAE,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC1E,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAInC,MAAqB,WAAY,SAAQ,KAAK,CAAC,SAAsB;IAArE;;QACY,WAAM,GAAG,SAAS,EAAU,CAAC;QAiB9B,SAAI,GAAG,GAAG,EAAE;YACf,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE;gBACzB,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;gBACpC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACtC,CAAC,CAAC,CAAC;QACP,CAAC,CAAA;QAEO,UAAK,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IAWtD,CAAC;IATG,MAAM;QACF,OAAO,CACH,MAAC,MAAM,oBAAK,IAAI,CAAC,KAAK,CAAC,WAAW,IAAE,GAAG,EAAE,IAAI,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,mBAAmB,EAAE,KAAK,aAC7F,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,KAAC,YAAY,cAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAgB,EACvE,KAAC,UAAU,cAAE,IAAI,CAAC,KAAK,CAAC,IAAI,GAAc,EAC1C,KAAC,YAAY,cAAC,KAAC,MAAM,IAAC,OAAO,EAAE,IAAI,CAAC,KAAK,YAAG,IAAI,CAAC,KAAK,CAAC,UAAU,GAAU,GAAe,KACrF,CACZ,CAAC;IACN,CAAC;;AAhCM,qBAAS,GAAG;IACf,oCAAoC;IACpC,MAAM,EAAE,SAAS,CAAC,MAAM;IACxB,4BAA4B;IAC5B,IAAI,EAAE,SAAS,CAAC,GAAG,CAAC,UAAU;IAC9B,gDAAgD;IAChD,UAAU,EAAE,SAAS,CAAC,MAAM;IAC5B,2BAA2B;IAC3B,WAAW,EAAE,SAAS,CAAC,MAAM;CAChC,AATe,CASf;AAEM,wBAAY,GAAG;IAClB,UAAU,EAAE,IAAI;CACnB,AAFkB,CAElB;eAhBgB,WAAW"}
1
+ {"version":3,"file":"AlertDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/AlertDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACnC,OAAO,MAAM,EAAE,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI1E,MAAqB,WAAY,SAAQ,KAAK,CAAC,SAAsB;IAArE;;QACY,WAAM,GAAG,SAAS,EAAU,CAAC;QAiB9B,SAAI,GAAG,GAAG,EAAE;YACf,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;gBAC3B,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;gBACpC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACtC,CAAC,CAAC,CAAC;QACP,CAAC,CAAC;QAEM,UAAK,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IAkBtD,CAAC;IAhBG,MAAM;QACF,OAAO,CACH,MAAC,MAAM,oBACC,IAAI,CAAC,KAAK,CAAC,WAAW,IAC1B,GAAG,EAAE,IAAI,CAAC,MAAM,EAChB,UAAU,EAAE,KAAK,EACjB,mBAAmB,EAAE,IAAI,aAExB,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,KAAC,YAAY,cAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAgB,EACtE,KAAC,UAAU,cAAE,IAAI,CAAC,KAAK,CAAC,IAAI,GAAc,EAC1C,KAAC,YAAY,cACT,KAAC,MAAM,IAAC,OAAO,EAAE,IAAI,CAAC,KAAK,YAAG,IAAI,CAAC,KAAK,CAAC,UAAU,GAAU,GAClD,KACV,CACZ,CAAC;IACN,CAAC;;AAvCM,qBAAS,GAAG;IACf,oCAAoC;IACpC,MAAM,EAAE,SAAS,CAAC,MAAM;IACxB,4BAA4B;IAC5B,IAAI,EAAE,SAAS,CAAC,GAAG,CAAC,UAAU;IAC9B,gDAAgD;IAChD,UAAU,EAAE,SAAS,CAAC,MAAM;IAC5B,2BAA2B;IAC3B,WAAW,EAAE,SAAS,CAAC,MAAM;CAChC,AATe,CASd;AAEK,wBAAY,GAAG;IAClB,UAAU,EAAE,IAAI;CACnB,AAFkB,CAEjB;eAhBe,WAAW","sourcesContent":["import React, { createRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { Button } from '../Button';\nimport Dialog, { DialogBody, DialogFooter, DialogHeader } from './Dialog';\n\ntype AlertOption = PropTypes.InferProps<typeof AlertDialog.propTypes>;\n\nexport default class AlertDialog extends React.Component<AlertOption> {\n private dialog = createRef<Dialog>();\n\n static propTypes = {\n /** Shown as header of the dialog */\n header: PropTypes.string,\n /** Rendered in the body. */\n body: PropTypes.any.isRequired,\n /** Accept button text, default value is `OK` */\n buttonText: PropTypes.string,\n /** props for the dialog */\n dialogProps: PropTypes.object,\n };\n\n static defaultProps = {\n buttonText: 'OK',\n };\n\n public show = () => {\n return new Promise((resolve) => {\n const onClose = () => resolve(null);\n this.dialog.current.open(onClose);\n });\n };\n\n private close = () => this.dialog.current.close();\n\n render() {\n return (\n <Dialog\n {...this.props.dialogProps}\n ref={this.dialog}\n closeOnEsc={false}\n closeOnOverlayClick={true}\n >\n {this.props.header && <DialogHeader>{this.props.header}</DialogHeader>}\n <DialogBody>{this.props.body}</DialogBody>\n <DialogFooter>\n <Button onClick={this.close}>{this.props.buttonText}</Button>\n </DialogFooter>\n </Dialog>\n );\n }\n}\n"]}
@@ -25,3 +25,4 @@ export default class ConfirmDialog extends React.Component<ConfirmOption> {
25
25
  render(): import("@emotion/react/jsx-runtime").JSX.Element;
26
26
  }
27
27
  export {};
28
+ //# sourceMappingURL=ConfirmDialog.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ConfirmDialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/ConfirmDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AAInC,KAAK,aAAa,GAAG,SAAS,CAAC,UAAU,CAAC,OAAO,aAAa,CAAC,SAAS,CAAC,CAAC;AAE1E,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC;IACrE,OAAO,CAAC,MAAM,CAAuB;IAErC,MAAM,CAAC,SAAS;QACZ,oCAAoC;;QAEpC,qCAAqC;;QAErC,yBAAyB;;QAEzB,yBAAyB;;QAEzB,2BAA2B;;MAE7B;IAEF,MAAM,CAAC,YAAY;;;MAGjB;IAEK,IAAI,yBAWT;IAEF,OAAO,CAAC,MAAM,CAA0C;IACxD,OAAO,CAAC,OAAO,CAAyC;IAExD,MAAM;CAkBT"}
@@ -1,8 +1,8 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
2
2
  import React, { createRef } from 'react';
3
3
  import PropTypes from 'prop-types';
4
- import Dialog, { DialogBody, DialogFooter, DialogHeader } from './Dialog';
5
4
  import { Button, ActionButton } from '../Button';
5
+ import Dialog, { DialogBody, DialogFooter, DialogHeader } from './Dialog';
6
6
  class ConfirmDialog extends React.Component {
7
7
  constructor() {
8
8
  super(...arguments);
@@ -10,7 +10,12 @@ class ConfirmDialog extends React.Component {
10
10
  this.show = () => {
11
11
  return new Promise((resolve, reject) => {
12
12
  const onClose = (resp) => {
13
- resp ? resolve(null) : reject();
13
+ if (resp) {
14
+ resolve(null);
15
+ }
16
+ else {
17
+ reject();
18
+ }
14
19
  };
15
20
  this.dialog.current.open(onClose);
16
21
  });
@@ -37,7 +42,7 @@ ConfirmDialog.propTypes = {
37
42
  };
38
43
  ConfirmDialog.defaultProps = {
39
44
  yesText: 'Yes',
40
- noText: 'No'
45
+ noText: 'No',
41
46
  };
42
47
  export default ConfirmDialog;
43
48
  //# sourceMappingURL=ConfirmDialog.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ConfirmDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/ConfirmDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,MAAM,EAAE,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC1E,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAIjD,MAAqB,aAAc,SAAQ,KAAK,CAAC,SAAwB;IAAzE;;QACY,WAAM,GAAG,SAAS,EAAU,CAAC;QAoB9B,SAAI,GAAG,GAAG,EAAE;YACf,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;gBACnC,MAAM,OAAO,GAAG,CAAC,IAAa,EAAE,EAAE;oBAC9B,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;gBACpC,CAAC,CAAA;gBACD,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACtC,CAAC,CAAC,CAAA;QACN,CAAC,CAAA;QAEO,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAChD,YAAO,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IAe5D,CAAC;IAbG,MAAM;QACF,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAClE,OAAO,CACH,MAAC,MAAM,oBAAK,WAAW,IAAE,GAAG,EAAE,IAAI,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,mBAAmB,EAAE,KAAK,aACnF,MAAM,IAAI,KAAC,YAAY,cAAE,MAAM,GAAgB,EAChD,KAAC,UAAU,cAAE,IAAI,GAAc,EAC/B,MAAC,YAAY,eACT,KAAC,MAAM,IAAC,OAAO,EAAE,IAAI,CAAC,MAAM,YAAG,MAAM,GAAU,EAC/C,KAAC,YAAY,IAAC,OAAO,EAAE,IAAI,CAAC,OAAO,YAAG,OAAO,GAAgB,IAClD,KACV,CACZ,CAAA;IACL,CAAC;;AA1CM,uBAAS,GAAG;IACf,oCAAoC;IACpC,MAAM,EAAE,SAAS,CAAC,MAAM;IACxB,qCAAqC;IACrC,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,UAAU;IACjC,yBAAyB;IACzB,OAAO,EAAE,SAAS,CAAC,MAAM;IACzB,yBAAyB;IACzB,MAAM,EAAE,SAAS,CAAC,MAAM;IACxB,2BAA2B;IAC3B,WAAW,EAAE,SAAS,CAAC,MAAM;CAChC,AAXe,CAWf;AAEM,0BAAY,GAAG;IAClB,OAAO,EAAE,KAAK;IACd,MAAM,EAAE,IAAI;CACf,AAHkB,CAGlB;eAnBgB,aAAa"}
1
+ {"version":3,"file":"ConfirmDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/ConfirmDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,MAAM,EAAE,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI1E,MAAqB,aAAc,SAAQ,KAAK,CAAC,SAAwB;IAAzE;;QACY,WAAM,GAAG,SAAS,EAAU,CAAC;QAoB9B,SAAI,GAAG,GAAG,EAAE;YACf,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;gBACnC,MAAM,OAAO,GAAG,CAAC,IAAa,EAAE,EAAE;oBAC9B,IAAI,IAAI,EAAE,CAAC;wBACP,OAAO,CAAC,IAAI,CAAC,CAAC;oBAClB,CAAC;yBAAM,CAAC;wBACJ,MAAM,EAAE,CAAC;oBACb,CAAC;gBACL,CAAC,CAAC;gBACF,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACtC,CAAC,CAAC,CAAC;QACP,CAAC,CAAC;QAEM,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAChD,YAAO,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IAoB5D,CAAC;IAlBG,MAAM;QACF,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAClE,OAAO,CACH,MAAC,MAAM,oBACC,WAAW,IACf,GAAG,EAAE,IAAI,CAAC,MAAM,EAChB,UAAU,EAAE,KAAK,EACjB,mBAAmB,EAAE,KAAK,aAEzB,MAAM,IAAI,KAAC,YAAY,cAAE,MAAM,GAAgB,EAChD,KAAC,UAAU,cAAE,IAAI,GAAc,EAC/B,MAAC,YAAY,eACT,KAAC,MAAM,IAAC,OAAO,EAAE,IAAI,CAAC,MAAM,YAAG,MAAM,GAAU,EAC/C,KAAC,YAAY,IAAC,OAAO,EAAE,IAAI,CAAC,OAAO,YAAG,OAAO,GAAgB,IAClD,KACV,CACZ,CAAC;IACN,CAAC;;AAnDM,uBAAS,GAAG;IACf,oCAAoC;IACpC,MAAM,EAAE,SAAS,CAAC,MAAM;IACxB,qCAAqC;IACrC,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,UAAU;IACjC,yBAAyB;IACzB,OAAO,EAAE,SAAS,CAAC,MAAM;IACzB,yBAAyB;IACzB,MAAM,EAAE,SAAS,CAAC,MAAM;IACxB,2BAA2B;IAC3B,WAAW,EAAE,SAAS,CAAC,MAAM;CAChC,AAXe,CAWd;AAEK,0BAAY,GAAG;IAClB,OAAO,EAAE,KAAK;IACd,MAAM,EAAE,IAAI;CACf,AAHkB,CAGjB;eAnBe,aAAa","sourcesContent":["import React, { createRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { Button, ActionButton } from '../Button';\nimport Dialog, { DialogBody, DialogFooter, DialogHeader } from './Dialog';\n\ntype ConfirmOption = PropTypes.InferProps<typeof ConfirmDialog.propTypes>;\n\nexport default class ConfirmDialog extends React.Component<ConfirmOption> {\n private dialog = createRef<Dialog>();\n\n static propTypes = {\n /** Shown as header of the dialog */\n header: PropTypes.string,\n /** Rendered as body of the dialog */\n body: PropTypes.string.isRequired,\n /** Accept button text */\n yesText: PropTypes.string,\n /** Reject button text */\n noText: PropTypes.string,\n /** Props for the dialog */\n dialogProps: PropTypes.object,\n };\n\n static defaultProps = {\n yesText: 'Yes',\n noText: 'No',\n };\n\n public show = () => {\n return new Promise((resolve, reject) => {\n const onClose = (resp: boolean) => {\n if (resp) {\n resolve(null);\n } else {\n reject();\n }\n };\n this.dialog.current.open(onClose);\n });\n };\n\n private cancel = () => this.dialog.current.close(false);\n private confirm = () => this.dialog.current.close(true);\n\n render() {\n const { header, body, yesText, noText, dialogProps } = this.props;\n return (\n <Dialog\n {...dialogProps}\n ref={this.dialog}\n closeOnEsc={false}\n closeOnOverlayClick={false}\n >\n {header && <DialogHeader>{header}</DialogHeader>}\n <DialogBody>{body}</DialogBody>\n <DialogFooter>\n <Button onClick={this.cancel}>{noText}</Button>\n <ActionButton onClick={this.confirm}>{yesText}</ActionButton>\n </DialogFooter>\n </Dialog>\n );\n }\n}\n"]}
@@ -10,6 +10,7 @@ export { Header as DialogHeader, Body as DialogBody, Footer as DialogFooter, } f
10
10
  type DialogOptions = PropTypes.InferProps<typeof Dialog.propTypes>;
11
11
  interface DialogState {
12
12
  show: boolean;
13
+ LayerComponent?: () => React.ReactPortal | null;
13
14
  }
14
15
  declare class Dialog extends React.Component<React.PropsWithChildren<DialogOptions>, DialogState> {
15
16
  static propTypes: {
@@ -24,13 +25,12 @@ declare class Dialog extends React.Component<React.PropsWithChildren<DialogOptio
24
25
  };
25
26
  private closeDialog;
26
27
  private onCloseFn;
27
- state: {
28
- show: boolean;
29
- };
28
+ state: DialogState;
30
29
  shouldComponentUpdate(nextProps: DialogOptions, nextState: DialogState): boolean;
31
- open: (closeCallback?: (resp: any) => void) => void;
32
- close: (resp?: any) => void;
30
+ open: (closeCallback?: (resp: unknown) => void) => void;
31
+ close: (resp?: unknown) => void;
33
32
  private closeCallback;
34
33
  render(): import("@emotion/react/jsx-runtime").JSX.Element;
35
34
  }
36
35
  export default Dialog;
36
+ //# sourceMappingURL=Dialog.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,eAAO,MAAM,eAAe;;SAqBL,MACrB,WAAW;;;UANZ,CAAC;AAEF,OAAO,EACH,MAAM,IAAI,YAAY,EACtB,IAAI,IAAI,UAAU,EAClB,MAAM,IAAI,YAAY,GACzB,MAAM,qBAAqB,CAAC;AAE7B,KAAK,aAAa,GAAG,SAAS,CAAC,UAAU,CAAC,OAAO,MAAM,CAAC,SAAS,CAAC,CAAC;AAEnE,UAAU,WAAW;IACjB,IAAI,EAAE,OAAO,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC;CACnD;AAED,cAAM,MAAO,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,EAAE,WAAW,CAAC;IACrF,MAAM,CAAC,SAAS;QACZ,kEAAkE;;QAElE,6DAA6D;;MAE/D;IAEF,MAAM,CAAC,YAAY;;;MAGjB;IAEF,OAAO,CAAC,WAAW,CAA2B;IAC9C,OAAO,CAAC,SAAS,CAA2B;IAE5C,KAAK,EAAE,WAAW,CAGhB;IAEF,qBAAqB,CAAC,SAAS,EAAE,aAAa,EAAE,SAAS,EAAE,WAAW;IAI/D,IAAI,mBAAoB,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,UAwBpD;IAEK,KAAK,UAAW,OAAO,UAE5B;IAEF,OAAO,CAAC,aAAa,CAMnB;IAEF,MAAM;CAST;AAED,eAAe,MAAM,CAAC"}
@@ -20,7 +20,7 @@ export const DialogContainer = styled(Card) `
20
20
  max-height: 80vh;
21
21
  transform: scale(0);
22
22
  opacity: 0;
23
- transition: all .3s ease;
23
+ transition: all 0.3s ease;
24
24
 
25
25
  .nf-layer-enter & {
26
26
  opacity: 1;
@@ -38,40 +38,46 @@ class Dialog extends React.Component {
38
38
  super(...arguments);
39
39
  this.state = {
40
40
  show: false,
41
+ LayerComponent: undefined,
41
42
  };
42
43
  this.open = (closeCallback) => {
44
+ const _a = this.props, { closeOnEsc, closeOnOverlayClick, children } = _a, rest = __rest(_a, ["closeOnEsc", "closeOnOverlayClick", "children"]);
45
+ const [Component, closeFn] = LayerManager.renderLayer({
46
+ exitDelay: 300,
47
+ overlay: true,
48
+ closeOnEsc,
49
+ closeCallback: this.closeCallback,
50
+ closeOnOverlayClick,
51
+ position: LAYER_POSITION.DIALOG,
52
+ component: (_jsx(DialogContainer, Object.assign({}, rest, { onClick: (e) => e.stopPropagation(), elevated: true, children: children }))),
53
+ });
54
+ this.closeDialog = closeFn;
43
55
  this.setState({
44
56
  show: true,
57
+ LayerComponent: Component,
45
58
  });
46
59
  this.onCloseFn = closeCallback;
47
60
  };
48
61
  this.close = (resp) => {
49
- this.closeDialog && this.closeDialog(resp);
62
+ var _a;
63
+ (_a = this.closeDialog) === null || _a === void 0 ? void 0 : _a.call(this, resp);
50
64
  };
51
65
  this.closeCallback = (resp) => {
66
+ var _a;
52
67
  this.setState({
53
68
  show: false,
69
+ LayerComponent: undefined,
54
70
  });
55
- this.onCloseFn && this.onCloseFn(resp);
71
+ (_a = this.onCloseFn) === null || _a === void 0 ? void 0 : _a.call(this, resp);
56
72
  };
57
73
  }
58
74
  shouldComponentUpdate(nextProps, nextState) {
59
75
  return this.state.show !== nextState.show;
60
76
  }
61
77
  render() {
62
- const _a = this.props, { closeOnEsc, closeOnOverlayClick, children } = _a, rest = __rest(_a, ["closeOnEsc", "closeOnOverlayClick", "children"]);
63
- if (this.state.show) {
64
- const [Component, closeFn] = LayerManager.renderLayer({
65
- exitDelay: 300,
66
- overlay: true,
67
- closeOnEsc,
68
- closeCallback: this.closeCallback,
69
- closeOnOverlayClick,
70
- position: LAYER_POSITION.DIALOG,
71
- component: (_jsx(DialogContainer, Object.assign({}, rest, { onClick: e => e.stopPropagation(), elevated: true, children: children })))
72
- });
73
- this.closeDialog = closeFn;
74
- return _jsx(Component, {});
78
+ const { LayerComponent } = this.state;
79
+ if (this.state.show && LayerComponent) {
80
+ return _jsx(LayerComponent, {});
75
81
  }
76
82
  else {
77
83
  return null;
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,YAAY,EAAE,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AACzE,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;;;;;;;;;;;;CAgB1C,CAAC;AAEF,OAAO,EACH,MAAM,IAAI,YAAY,EACtB,IAAI,IAAI,UAAU,EAClB,MAAM,IAAI,YAAY,GACzB,MAAM,qBAAqB,CAAC;AAM7B,MAAM,MAAO,SAAQ,KAAK,CAAC,SAA8D;IAAzF;;QAgBI,UAAK,GAAG;YACJ,IAAI,EAAE,KAAK;SACd,CAAA;QAMM,SAAI,GAAG,CAAC,aAAmC,EAAE,EAAE;YAClD,IAAI,CAAC,QAAQ,CAAC;gBACV,IAAI,EAAE,IAAI;aACb,CAAC,CAAC;YACH,IAAI,CAAC,SAAS,GAAG,aAAa,CAAE;QACpC,CAAC,CAAA;QAEM,UAAK,GAAG,CAAC,IAAU,EAAE,EAAE;YAC1B,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QAC/C,CAAC,CAAA;QAEO,kBAAa,GAAG,CAAC,IAAU,EAAE,EAAE;YACnC,IAAI,CAAC,QAAQ,CAAC;gBACV,IAAI,EAAE,KAAK;aACd,CAAC,CAAC;YACH,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;QAC3C,CAAC,CAAA;IAyBL,CAAC;IA7CG,qBAAqB,CAAC,SAAwB,EAAE,SAAsB;QAClE,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,IAAI,CAAC;IAC9C,CAAC;IAoBD,MAAM;QACF,MAAM,KAAwD,IAAI,CAAC,KAAK,EAAlE,EAAE,UAAU,EAAE,mBAAmB,EAAE,QAAQ,OAAuB,EAAlB,IAAI,cAApD,iDAAqD,CAAa,CAAC;QAEzE,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;YAClB,MAAM,CAAC,SAAS,EAAE,OAAO,CAAE,GAAG,YAAY,CAAC,WAAW,CAAC;gBACnD,SAAS,EAAE,GAAG;gBACd,OAAO,EAAE,IAAI;gBACb,UAAU;gBACV,aAAa,EAAE,IAAI,CAAC,aAAa;gBACjC,mBAAmB;gBACnB,QAAQ,EAAE,cAAc,CAAC,MAAM;gBAC/B,SAAS,EAAE,CACP,KAAC,eAAe,oBAAK,IAAI,IAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAAE,QAAQ,kBACjE,QAAQ,IACK,CACrB;aACJ,CAAC,CAAC;YACH,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;YAC3B,OAAO,KAAC,SAAS,KAAG,CAAC;QACzB,CAAC;aAAM,CAAC;YACJ,OAAO,IAAI,CAAC;QAChB,CAAC;IACL,CAAC;;AA/DM,gBAAS,GAAG;IACf,kEAAkE;IAClE,UAAU,EAAE,SAAS,CAAC,IAAI;IAC1B,6DAA6D;IAC7D,mBAAmB,EAAE,SAAS,CAAC,IAAI;CACtC,AALe,CAKf;AAEM,mBAAY,GAAG;IAClB,UAAU,EAAE,IAAI;IAChB,mBAAmB,EAAE,IAAI;CAC5B,AAHkB,CAGlB;AAwDL,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,YAAY,EAAE,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AACzE,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;;;;;;;;;;;;CAgB1C,CAAC;AAEF,OAAO,EACH,MAAM,IAAI,YAAY,EACtB,IAAI,IAAI,UAAU,EAClB,MAAM,IAAI,YAAY,GACzB,MAAM,qBAAqB,CAAC;AAS7B,MAAM,MAAO,SAAQ,KAAK,CAAC,SAA8D;IAAzF;;QAgBI,UAAK,GAAgB;YACjB,IAAI,EAAE,KAAK;YACX,cAAc,EAAE,SAAS;SAC5B,CAAC;QAMK,SAAI,GAAG,CAAC,aAAuC,EAAE,EAAE;YACtD,MAAM,KAAyD,IAAI,CAAC,KAAK,EAAnE,EAAE,UAAU,EAAE,mBAAmB,EAAE,QAAQ,OAAwB,EAAnB,IAAI,cAApD,iDAAsD,CAAa,CAAC;YAE1E,MAAM,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG,YAAY,CAAC,WAAW,CAAC;gBAClD,SAAS,EAAE,GAAG;gBACd,OAAO,EAAE,IAAI;gBACb,UAAU;gBACV,aAAa,EAAE,IAAI,CAAC,aAAa;gBACjC,mBAAmB;gBACnB,QAAQ,EAAE,cAAc,CAAC,MAAM;gBAC/B,SAAS,EAAE,CACP,KAAC,eAAe,oBAAK,IAAI,IAAE,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAAE,QAAQ,kBACnE,QAAQ,IACK,CACrB;aACJ,CAAC,CAAC;YAEH,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;YAE3B,IAAI,CAAC,QAAQ,CAAC;gBACV,IAAI,EAAE,IAAI;gBACV,cAAc,EAAE,SAAS;aAC5B,CAAC,CAAC;YACH,IAAI,CAAC,SAAS,GAAG,aAAa,CAAC;QACnC,CAAC,CAAC;QAEK,UAAK,GAAG,CAAC,IAAc,EAAE,EAAE;;YAC9B,MAAA,IAAI,CAAC,WAAW,qDAAG,IAAI,CAAC,CAAC;QAC7B,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,IAAc,EAAE,EAAE;;YACvC,IAAI,CAAC,QAAQ,CAAC;gBACV,IAAI,EAAE,KAAK;gBACX,cAAc,EAAE,SAAS;aAC5B,CAAC,CAAC;YACH,MAAA,IAAI,CAAC,SAAS,qDAAG,IAAI,CAAC,CAAC;QAC3B,CAAC,CAAC;IAWN,CAAC;IAnDG,qBAAqB,CAAC,SAAwB,EAAE,SAAsB;QAClE,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,IAAI,CAAC;IAC9C,CAAC;IAwCD,MAAM;QACF,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAEtC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,cAAc,EAAE,CAAC;YACpC,OAAO,KAAC,cAAc,KAAG,CAAC;QAC9B,CAAC;aAAM,CAAC;YACJ,OAAO,IAAI,CAAC;QAChB,CAAC;IACL,CAAC;;AAtEM,gBAAS,GAAG;IACf,kEAAkE;IAClE,UAAU,EAAE,SAAS,CAAC,IAAI;IAC1B,6DAA6D;IAC7D,mBAAmB,EAAE,SAAS,CAAC,IAAI;CACtC,AALe,CAKd;AAEK,mBAAY,GAAG;IAClB,UAAU,EAAE,IAAI;IAChB,mBAAmB,EAAE,IAAI;CAC5B,AAHkB,CAGjB;AA+DN,eAAe,MAAM,CAAC","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport styled from '@emotion/styled';\nimport LayerManager, { LAYER_POSITION } from '../../shared/LayerManager';\nimport { Card } from '../Card';\n\nexport const DialogContainer = styled(Card)`\n max-width: 768px;\n max-height: 80vh;\n transform: scale(0);\n opacity: 0;\n transition: all 0.3s ease;\n\n .nf-layer-enter & {\n opacity: 1;\n transform: scale(1);\n }\n\n .nf-layer-exit & {\n opacity: 0;\n transform: scale(0);\n }\n`;\n\nexport {\n Header as DialogHeader,\n Body as DialogBody,\n Footer as DialogFooter,\n} from '../../shared/styles';\n\ntype DialogOptions = PropTypes.InferProps<typeof Dialog.propTypes>;\n\ninterface DialogState {\n show: boolean;\n LayerComponent?: () => React.ReactPortal | null;\n}\n\nclass Dialog extends React.Component<React.PropsWithChildren<DialogOptions>, DialogState> {\n static propTypes = {\n /** Flag to close dialog on `esc` click. Default value is true. */\n closeOnEsc: PropTypes.bool,\n /** Close layer overlay is clicked. Default value is true. */\n closeOnOverlayClick: PropTypes.bool,\n };\n\n static defaultProps = {\n closeOnEsc: true,\n closeOnOverlayClick: true,\n };\n\n private closeDialog: (resp?: unknown) => void;\n private onCloseFn: (resp?: unknown) => void;\n\n state: DialogState = {\n show: false,\n LayerComponent: undefined,\n };\n\n shouldComponentUpdate(nextProps: DialogOptions, nextState: DialogState) {\n return this.state.show !== nextState.show;\n }\n\n public open = (closeCallback?: (resp: unknown) => void) => {\n const { closeOnEsc, closeOnOverlayClick, children, ...rest } = this.props;\n\n const [Component, closeFn] = LayerManager.renderLayer({\n exitDelay: 300,\n overlay: true,\n closeOnEsc,\n closeCallback: this.closeCallback,\n closeOnOverlayClick,\n position: LAYER_POSITION.DIALOG,\n component: (\n <DialogContainer {...rest} onClick={(e) => e.stopPropagation()} elevated>\n {children}\n </DialogContainer>\n ),\n });\n\n this.closeDialog = closeFn;\n\n this.setState({\n show: true,\n LayerComponent: Component,\n });\n this.onCloseFn = closeCallback;\n };\n\n public close = (resp?: unknown) => {\n this.closeDialog?.(resp);\n };\n\n private closeCallback = (resp?: unknown) => {\n this.setState({\n show: false,\n LayerComponent: undefined,\n });\n this.onCloseFn?.(resp);\n };\n\n render() {\n const { LayerComponent } = this.state;\n\n if (this.state.show && LayerComponent) {\n return <LayerComponent />;\n } else {\n return null;\n }\n }\n}\n\nexport default Dialog;\n"]}
@@ -34,3 +34,4 @@ export default class PromptDialog extends React.Component<PromptOption, {
34
34
  render(): import("@emotion/react/jsx-runtime").JSX.Element;
35
35
  }
36
36
  export {};
37
+ //# sourceMappingURL=PromptDialog.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PromptDialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/PromptDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AAMnC,KAAK,YAAY,GAAG,SAAS,CAAC,UAAU,CAAC,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;AAMxE,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,KAAK,CAAC,SAAS,CAAC,YAAY,EAAE;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;IACtF,MAAM,CAAC,SAAS;QACZ,oCAAoC;;QAEpC,yCAAyC;;QAEzC,mCAAmC;;QAEnC,oDAAoD;;QAEpD,oDAAoD;;QAEpD,2BAA2B;;QAE3B,uCAAuC;;MAEzC;IAEF,MAAM,CAAC,YAAY;;;;MAIjB;gBAEU,KAAK,EAAE,YAAY;IAO/B,OAAO,CAAC,MAAM,CAAuB;IAErC,OAAO,CAAC,WAAW,CAIjB;IAEF,OAAO,CAAC,MAAM,CAAqC;IAEnD,OAAO,CAAC,MAAM,CAGZ;IAEK,IAAI,yBAcT;IAEF,MAAM;CAiCT"}
@@ -2,9 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
2
2
  import React, { createRef } from 'react';
3
3
  import PropTypes from 'prop-types';
4
4
  import styled from '@emotion/styled';
5
- import Dialog, { DialogHeader, DialogBody, DialogFooter } from './Dialog';
6
5
  import { Button, ActionButton } from '../Button';
7
6
  import { Input } from '../Input';
7
+ import Dialog, { DialogHeader, DialogBody, DialogFooter } from './Dialog';
8
8
  const BodyText = styled.p `
9
9
  margin-top: 0;
10
10
  `;
@@ -44,7 +44,7 @@ class PromptDialog extends React.Component {
44
44
  }
45
45
  render() {
46
46
  const { header, body, inputProps, submitText, cancelText, dialogProps } = this.props;
47
- return (_jsx(Dialog, Object.assign({}, dialogProps, { ref: this.dialog, closeOnEsc: false, closeOnOverlayClick: false, children: _jsxs("form", { onSubmit: this.submit, children: [header && _jsx(DialogHeader, { children: header }), _jsxs(DialogBody, { children: [_jsx(BodyText, { children: body }), _jsx("div", { style: { display: 'flex' }, children: _jsx(Input, Object.assign({ style: { width: 'auto', flex: '1' }, value: this.state.value, onChange: this.valueChange, autoFocus: true }, inputProps)) })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: 'button', onClick: this.cancel, children: cancelText }), _jsx(ActionButton, { children: submitText })] })] }) })));
47
+ return (_jsx(Dialog, Object.assign({}, dialogProps, { ref: this.dialog, closeOnEsc: false, closeOnOverlayClick: false, children: _jsxs("form", { onSubmit: this.submit, children: [header && _jsx(DialogHeader, { children: header }), _jsxs(DialogBody, { children: [_jsx(BodyText, { children: body }), _jsx("div", { style: { display: 'flex' }, children: _jsx(Input, Object.assign({ style: { width: 'auto', flex: '1' }, value: this.state.value, onChange: this.valueChange }, inputProps)) })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", onClick: this.cancel, children: cancelText }), _jsx(ActionButton, { children: submitText })] })] }) })));
48
48
  }
49
49
  }
50
50
  PromptDialog.propTypes = {
@@ -1 +1 @@
1
- {"version":3,"file":"PromptDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/PromptDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,MAAM,EAAE,EAAE,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC1E,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAIjC,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAA;;CAExB,CAAA;AAED,MAAqB,YAAa,SAAQ,KAAK,CAAC,SAA0C;IAwBtF,YAAY,KAAmB;QAC3B,KAAK,CAAC,KAAK,CAAC,CAAC;QAMT,WAAM,GAAG,SAAS,EAAU,CAAC;QAE7B,gBAAW,GAAG,CAAC,CAAsC,EAAE,EAAE;YAC7D,IAAI,CAAC,QAAQ,CAAC;gBACV,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK;aACxB,CAAC,CAAA;QACN,CAAC,CAAA;QAEO,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;QAE3C,WAAM,GAAG,CAAC,CAAkB,EAAE,EAAE;YACpC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAChD,CAAC,CAAA;QAEM,SAAI,GAAG,GAAG,EAAE;YACf,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;gBACnC,MAAM,OAAO,GAAG,CAAC,KAAa,EAAE,EAAE;oBAC9B,IAAI,KAAK,EAAE,CAAC;wBACR,OAAO,CAAC,KAAK,CAAC,CAAC;oBACnB,CAAC;yBAAM,CAAC;wBACJ,MAAM,EAAE,CAAC;oBACb,CAAC;oBACD,IAAI,CAAC,QAAQ,CAAC;wBACV,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY;qBACjC,CAAC,CAAC;gBACP,CAAC,CAAA;gBACD,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACtC,CAAC,CAAC,CAAC;QACP,CAAC,CAAA;QAlCG,IAAI,CAAC,KAAK,GAAG;YACT,KAAK,EAAE,KAAK,CAAC,YAAY;SAC5B,CAAA;IACL,CAAC;IAiCD,MAAM;QACF,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAErF,OAAO,CACH,KAAC,MAAM,oBAAK,WAAW,IAAE,GAAG,EAAE,IAAI,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,mBAAmB,EAAE,KAAK,YACpF,gBAAM,QAAQ,EAAE,IAAI,CAAC,MAAM,aACtB,MAAM,IAAI,KAAC,YAAY,cAAE,MAAM,GAAgB,EAChD,MAAC,UAAU,eACP,KAAC,QAAQ,cAAE,IAAI,GAAY,EAC3B,cAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,YAC3B,KAAC,KAAK,kBACF,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,EACnC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,QAAQ,EAAE,IAAI,CAAC,WAAW,EAC1B,SAAS,UACL,UAAU,EAChB,GACA,IACG,EACb,MAAC,YAAY,eACT,KAAC,MAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,MAAM,YAAG,UAAU,GAAU,EACjE,KAAC,YAAY,cAAE,UAAU,GAAgB,IAC9B,IACZ,IACF,CACZ,CAAA;IACL,CAAC;;AAvFM,sBAAS,GAAG;IACf,oCAAoC;IACpC,MAAM,EAAE,SAAS,CAAC,MAAM;IACxB,yCAAyC;IACzC,IAAI,EAAE,SAAS,CAAC,MAAM;IACtB,mCAAmC;IACnC,YAAY,EAAE,SAAS,CAAC,MAAM;IAC9B,oDAAoD;IACpD,UAAU,EAAE,SAAS,CAAC,MAAM;IAC5B,oDAAoD;IACpD,UAAU,EAAE,SAAS,CAAC,MAAM;IAC5B,2BAA2B;IAC3B,UAAU,EAAE,SAAS,CAAC,MAAM;IAC5B,uCAAuC;IACvC,WAAW,EAAE,SAAS,CAAC,MAAM;CAChC,AAfe,CAef;AAEM,yBAAY,GAAG;IAClB,UAAU,EAAE,QAAQ;IACpB,UAAU,EAAE,QAAQ;IACpB,YAAY,EAAE,EAAE;CACnB,AAJkB,CAIlB;eAtBgB,YAAY"}
1
+ {"version":3,"file":"PromptDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/PromptDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { createRef } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from '@emotion/styled';\nimport { Button, ActionButton } from '../Button';\nimport { Input } from '../Input';\nimport Dialog, { DialogHeader, DialogBody, DialogFooter } from './Dialog';\n\ntype PromptOption = PropTypes.InferProps<typeof PromptDialog.propTypes>;\n\nconst BodyText = styled.p`\n margin-top: 0;\n`;\n\nexport default class PromptDialog extends React.Component<PromptOption, { value: string }> {\n static propTypes = {\n /** Shown as header of the dialog */\n header: PropTypes.string,\n /** Rendered as the body of the dialog */\n body: PropTypes.string,\n /** Default value for the input. */\n defaultValue: PropTypes.string,\n /** Submit button text. Default value is 'Submit' */\n submitText: PropTypes.string,\n /** Cancel button text. Default value is 'Cancel' */\n cancelText: PropTypes.string,\n /** Props for the input. */\n inputProps: PropTypes.object,\n /** Additional props for the dialog. */\n dialogProps: PropTypes.object,\n };\n\n static defaultProps = {\n cancelText: 'Cancel',\n submitText: 'Submit',\n defaultValue: '',\n };\n\n constructor(props: PromptOption) {\n super(props);\n this.state = {\n value: props.defaultValue,\n };\n }\n\n private dialog = createRef<Dialog>();\n\n private valueChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n this.setState({\n value: e.target.value,\n });\n };\n\n private cancel = () => this.dialog.current.close();\n\n private submit = (e: React.FormEvent) => {\n e.preventDefault();\n this.dialog.current.close(this.state.value);\n };\n\n public show = () => {\n return new Promise((resolve, reject) => {\n const onClose = (value: string) => {\n if (value) {\n resolve(value);\n } else {\n reject();\n }\n this.setState({\n value: this.props.defaultValue,\n });\n };\n this.dialog.current.open(onClose);\n });\n };\n\n render() {\n const { header, body, inputProps, submitText, cancelText, dialogProps } = this.props;\n\n return (\n <Dialog\n {...dialogProps}\n ref={this.dialog}\n closeOnEsc={false}\n closeOnOverlayClick={false}\n >\n <form onSubmit={this.submit}>\n {header && <DialogHeader>{header}</DialogHeader>}\n <DialogBody>\n <BodyText>{body}</BodyText>\n <div style={{ display: 'flex' }}>\n <Input\n style={{ width: 'auto', flex: '1' }}\n value={this.state.value}\n onChange={this.valueChange}\n {...inputProps}\n />\n </div>\n </DialogBody>\n <DialogFooter>\n <Button type=\"button\" onClick={this.cancel}>\n {cancelText}\n </Button>\n <ActionButton>{submitText}</ActionButton>\n </DialogFooter>\n </form>\n </Dialog>\n );\n }\n}\n"]}
@@ -2,3 +2,4 @@ export { default as Dialog, DialogBody, DialogFooter, DialogHeader } from './Dia
2
2
  export { default as AlertDialog } from './AlertDialog';
3
3
  export { default as ConfirmDialog } from './ConfirmDialog';
4
4
  export { default as PromptDialog } from './PromptDialog';
5
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC","sourcesContent":["export { default as Dialog, DialogBody, DialogFooter, DialogHeader } from './Dialog';\nexport { default as AlertDialog } from './AlertDialog';\nexport { default as ConfirmDialog } from './ConfirmDialog';\nexport { default as PromptDialog } from './PromptDialog';\n"]}
@@ -7,7 +7,7 @@ type DragAndDropProps = {
7
7
  onDrop: (start: number, end: number) => void;
8
8
  /** Shows drag indicator against each list item */
9
9
  showIndicator: boolean;
10
- } & PropsWithChildren<{}>;
10
+ } & PropsWithChildren<unknown>;
11
11
  /**
12
12
  * A drag and drop container component that enables reordering of child elements.
13
13
  *
@@ -43,3 +43,4 @@ declare namespace DragAndDrop {
43
43
  };
44
44
  }
45
45
  export default DragAndDrop;
46
+ //# sourceMappingURL=DragAndDrop.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DragAndDrop.d.ts","sourceRoot":"","sources":["../../../src/components/DragAndDrop/DragAndDrop.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,iBAAiB,EAAY,MAAM,OAAO,CAAC;AAG3D,OAAO,EAAE,WAAW,EAAe,MAAM,SAAS,CAAC;AAEnD,KAAK,gBAAgB,GAAG;IACpB,qCAAqC;IACrC,WAAW,EAAE,WAAW,CAAC;IACzB,yBAAyB;IACzB,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,kDAAkD;IAClD,aAAa,EAAE,OAAO,CAAC;CAC1B,GAAG,iBAAiB,CAAC,OAAO,CAAC,CAAC;AAW/B;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,iBAAwB,WAAW,CAAC,KAAK,EAAE,gBAAgB,oDAoC1D;kBApCuB,WAAW;;QAuC/B,qCAAqC;;QAErC,4DAA4D;;;;eAzCxC,WAAW"}
@@ -9,7 +9,7 @@ const Container = styled.div `
9
9
  display: flex;
10
10
  position: relative;
11
11
  flex-wrap: wrap;
12
- flex-direction: ${props => props.orientation === ORIENTATION.HORIZONTAL ? 'row' : 'column'};
12
+ flex-direction: ${(props) => (props.orientation === ORIENTATION.HORIZONTAL ? 'row' : 'column')};
13
13
  `;
14
14
  /**
15
15
  * A drag and drop container component that enables reordering of child elements.
@@ -46,7 +46,9 @@ export default function DragAndDrop(props) {
46
46
  * @param index
47
47
  */
48
48
  const drop = (index) => {
49
- startIndex !== null && (onDrop === null || onDrop === void 0 ? void 0 : onDrop(startIndex, index));
49
+ if (startIndex !== null) {
50
+ onDrop === null || onDrop === void 0 ? void 0 : onDrop(startIndex, index);
51
+ }
50
52
  setStartIndex(null);
51
53
  setIsDragging(false);
52
54
  };
@@ -1 +1 @@
1
- {"version":3,"file":"DragAndDrop.js","sourceRoot":"","sources":["../../../src/components/DragAndDrop/DragAndDrop.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAqB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAWnD,0BAA0B;AAC1B,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAA4B;;;;;sBAKlC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,KAAK,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ;CAC7F,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAAuB;IACvD,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC;IAC/D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAS,IAAI,CAAC,CAAC;IAC3D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC7D,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAS,IAAI,CAAC,CAAC;IAEvD;;;OAGG;IACH,MAAM,IAAI,GAAG,CAAC,KAAa,EAAE,EAAE;QAC3B,UAAU,KAAK,IAAI,KAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,UAAU,EAAE,KAAK,CAAC,CAAA,CAAC;QACnD,aAAa,CAAC,IAAI,CAAC,CAAC;QACpB,aAAa,CAAC,KAAK,CAAC,CAAC;IACzB,CAAC,CAAA;IAED,OAAO,CAAC,KAAC,WAAW,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,UAAU,EAAE,aAAa,EAAE,IAAI,EAAE,UAAU,EAAE,aAAa,EAAE,WAAW,EAAE,YAC5G,KAAC,SAAS,IAAC,WAAW,EAAE,WAAW,YAC9B,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5C,KAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,YAC7F,KAAK,GACC,CACd,CAAC,GACM,GACO,CAAC,CAAC;AAC7B,CAAC;AAED,WAAW,CAAC,YAAY,GAAG;IACvB,qCAAqC;IACrC,WAAW,EAAE,WAAW,CAAC,QAAQ;IACjC,4DAA4D;IAC5D,aAAa,EAAE,KAAK;CACvB,CAAA"}
1
+ {"version":3,"file":"DragAndDrop.js","sourceRoot":"","sources":["../../../src/components/DragAndDrop/DragAndDrop.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAqB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAWnD,0BAA0B;AAC1B,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAA8B;;;;;sBAKpC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,WAAW,KAAK,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC;CACjG,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,KAAuB;IACvD,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC;IAC/D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAS,IAAI,CAAC,CAAC;IAC3D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC7D,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAS,IAAI,CAAC,CAAC;IAEvD;;;OAGG;IACH,MAAM,IAAI,GAAG,CAAC,KAAa,EAAE,EAAE;QAC3B,IAAI,UAAU,KAAK,IAAI,EAAE,CAAC;YACtB,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,UAAU,EAAE,KAAK,CAAC,CAAC;QAChC,CAAC;QACD,aAAa,CAAC,IAAI,CAAC,CAAC;QACpB,aAAa,CAAC,KAAK,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO,CACH,KAAC,WAAW,CAAC,QAAQ,IACjB,KAAK,EAAE,EAAE,UAAU,EAAE,aAAa,EAAE,IAAI,EAAE,UAAU,EAAE,aAAa,EAAE,WAAW,EAAE,YAElF,KAAC,SAAS,IAAC,WAAW,EAAE,WAAW,YAC9B,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5C,KAAC,QAAQ,IACL,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,QAAQ,YAEjB,KAAK,GACC,CACd,CAAC,GACM,GACO,CAC1B,CAAC;AACN,CAAC;AAED,WAAW,CAAC,YAAY,GAAG;IACvB,qCAAqC;IACrC,WAAW,EAAE,WAAW,CAAC,QAAQ;IACjC,4DAA4D;IAC5D,aAAa,EAAE,KAAK;CACvB,CAAC","sourcesContent":["import React, { PropsWithChildren, useState } from 'react';\nimport styled from '@emotion/styled';\nimport DragItem from './DragItem';\nimport { ORIENTATION, DragContext } from './types';\n\ntype DragAndDropProps = {\n /** Orientation of the list layout */\n orientation: ORIENTATION;\n /** Drop event handler */\n onDrop: (start: number, end: number) => void;\n /** Shows drag indicator against each list item */\n showIndicator: boolean;\n} & PropsWithChildren<unknown>;\n\n/** Container Component */\nconst Container = styled.div<{ orientation: ORIENTATION }>`\n flex: 1;\n display: flex;\n position: relative;\n flex-wrap: wrap;\n flex-direction: ${(props) => (props.orientation === ORIENTATION.HORIZONTAL ? 'row' : 'column')};\n`;\n\n/**\n * A drag and drop container component that enables reordering of child elements.\n *\n * @component\n * @example\n * ```tsx\n * <DragAndDrop\n * orientation={ORIENTATION.VERTICAL}\n * onDrop={(start, end) => handleReorder(start, end)}\n * showIndicator={true}\n * >\n * <div>Item 1</div>\n * <div>Item 2</div>\n * <div>Item 3</div>\n * </DragAndDrop>\n * ```\n *\n * @param {DragAndDropProps} props - The component props\n * @param {ORIENTATION} props.orientation - Determines the layout direction (horizontal or vertical). Defaults to VERTICAL.\n * @param {(start: number, end: number) => void} props.onDrop - Callback fired when an item is dropped, receives the start and end indices\n * @param {boolean} props.showIndicator - Whether to display drag indicators for each list item. Defaults to false.\n * @param {React.ReactNode} props.children - Child elements to be rendered as draggable items\n *\n * @returns {JSX.Element} A draggable container with reorderable items\n */\nexport default function DragAndDrop(props: DragAndDropProps) {\n const { orientation, children, onDrop, showIndicator } = props;\n const [startIndex, setStartIndex] = useState<number>(null);\n const [isDragging, setIsDragging] = useState<boolean>(false);\n const [dragOver, setDragOver] = useState<number>(null);\n\n /**\n * Drop handler invoked when a draggable item is released.\n * @param index\n */\n const drop = (index: number) => {\n if (startIndex !== null) {\n onDrop?.(startIndex, index);\n }\n setStartIndex(null);\n setIsDragging(false);\n };\n\n return (\n <DragContext.Provider\n value={{ startIndex, setStartIndex, drop, isDragging, setIsDragging, setDragOver }}\n >\n <Container orientation={orientation}>\n {React.Children.map(children, (child, index) => (\n <DragItem\n index={index}\n orientation={orientation}\n showIndicator={showIndicator}\n dragOver={dragOver}\n >\n {child}\n </DragItem>\n ))}\n </Container>\n </DragContext.Provider>\n );\n}\n\nDragAndDrop.defaultProps = {\n /** Orientation of the list layout */\n orientation: ORIENTATION.VERTICAL,\n /** Whether to display drag indicators for each list item */\n showIndicator: false,\n};\n"]}
@@ -44,3 +44,4 @@ interface DragItemProps {
44
44
  */
45
45
  export default function DragItem(props: PropsWithChildren<DragItemProps>): import("@emotion/react/jsx-runtime").JSX.Element;
46
46
  export {};
47
+ //# sourceMappingURL=DragItem.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DragItem.d.ts","sourceRoot":"","sources":["../../../src/components/DragAndDrop/DragItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEH,iBAAiB,EAKpB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,WAAW,EAAe,MAAM,SAAS,CAAC;AAEnD,UAAU,aAAa;IACnB,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,WAAW,EAAE,WAAW,CAAC;IACzB,0FAA0F;IAC1F,aAAa,EAAE,OAAO,CAAC;IACvB,yDAAyD;IACzD,QAAQ,EAAE,MAAM,CAAC;CACpB;AAgDD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAK,EAAE,iBAAiB,CAAC,aAAa,CAAC,oDA+JvE"}