@pautena/react-design-system 0.14.7 → 0.15.0

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 (418) hide show
  1. package/action/action-header.d.ts +1 -1
  2. package/action/action.d.ts +1 -1
  3. package/action/cjs/index.js +1 -1
  4. package/action/cjs/index.js.map +1 -1
  5. package/action/cjs/package.json +4 -4
  6. package/action/index.js +1 -1
  7. package/action/index.js.map +1 -1
  8. package/action/package.json +4 -4
  9. package/autocomplete/autocomplete.d.ts +1 -1
  10. package/autocomplete/cjs/index.js +1 -1
  11. package/autocomplete/cjs/index.js.map +1 -1
  12. package/autocomplete/cjs/package.json +2 -2
  13. package/autocomplete/index.js +1 -1
  14. package/autocomplete/index.js.map +1 -1
  15. package/autocomplete/package.json +2 -2
  16. package/board/board.d.ts +1 -1
  17. package/board/cjs/index.js +1 -1
  18. package/board/cjs/index.js.map +1 -1
  19. package/board/cjs/package.json +4 -4
  20. package/board/index.js.map +1 -1
  21. package/board/package.json +4 -4
  22. package/bootstrap-dialog/bootstrap-dialog.d.ts +1 -1
  23. package/bootstrap-dialog/cjs/index.js +1 -1
  24. package/bootstrap-dialog/cjs/index.js.map +1 -1
  25. package/bootstrap-dialog/cjs/package.json +4 -4
  26. package/bootstrap-dialog/index.js.map +1 -1
  27. package/bootstrap-dialog/package.json +4 -4
  28. package/bullet/bullet.d.ts +1 -1
  29. package/bullet/cjs/index.js +1 -1
  30. package/bullet/cjs/index.js.map +1 -1
  31. package/bullet/cjs/package.json +2 -2
  32. package/bullet/package.json +2 -2
  33. package/center-container/center-container.d.ts +1 -1
  34. package/center-container/cjs/index.js +1 -1
  35. package/center-container/cjs/index.js.map +1 -1
  36. package/center-container/cjs/package.json +2 -2
  37. package/center-container/package.json +2 -2
  38. package/cjs/index.js +1 -23
  39. package/cjs/index.js.map +1 -1
  40. package/confirm-dialog/cjs/index.js +1 -1
  41. package/confirm-dialog/cjs/index.js.map +1 -1
  42. package/confirm-dialog/cjs/package.json +4 -4
  43. package/confirm-dialog/confirm-dialog.d.ts +1 -1
  44. package/confirm-dialog/index.js.map +1 -1
  45. package/confirm-dialog/package.json +4 -4
  46. package/content/cjs/index.js +1 -1
  47. package/content/cjs/index.js.map +1 -1
  48. package/content/cjs/package.json +2 -2
  49. package/content/content.d.ts +1 -1
  50. package/content/package.json +2 -2
  51. package/content-placeholder/cjs/index.js +1 -1
  52. package/content-placeholder/cjs/index.js.map +1 -1
  53. package/content-placeholder/cjs/package.json +2 -2
  54. package/content-placeholder/content-placeholder.d.ts +1 -1
  55. package/content-placeholder/package.json +2 -2
  56. package/date-range-calendar/cjs/index.js +1 -1
  57. package/date-range-calendar/cjs/index.js.map +1 -1
  58. package/date-range-calendar/cjs/package.json +4 -4
  59. package/date-range-calendar/date-range-calendar.d.ts +1 -1
  60. package/date-range-calendar/index.js +1 -1
  61. package/date-range-calendar/index.js.map +1 -1
  62. package/date-range-calendar/package.json +4 -4
  63. package/date-range-picker/cjs/index.js +1 -1
  64. package/date-range-picker/cjs/index.js.map +1 -1
  65. package/date-range-picker/cjs/package.json +5 -5
  66. package/date-range-picker/date-range-picker.d.ts +1 -1
  67. package/date-range-picker/index.js +1 -1
  68. package/date-range-picker/index.js.map +1 -1
  69. package/date-range-picker/package.json +5 -5
  70. package/dialog/cjs/index.js +1 -1
  71. package/dialog/cjs/index.js.map +1 -1
  72. package/dialog/cjs/package.json +1 -1
  73. package/dialog/package.json +1 -1
  74. package/dialog/use-dialog.d.ts +0 -1
  75. package/drawer/cjs/index.js +1 -1
  76. package/drawer/cjs/index.js.map +1 -1
  77. package/drawer/cjs/package.json +3 -3
  78. package/drawer/drawer.d.ts +0 -1
  79. package/drawer/index.js.map +1 -1
  80. package/drawer/package.json +3 -3
  81. package/drawer-app-bar/cjs/index.js +1 -1
  82. package/drawer-app-bar/cjs/index.js.map +1 -1
  83. package/drawer-app-bar/cjs/package.json +3 -3
  84. package/drawer-app-bar/drawer-app-bar.d.ts +1 -1
  85. package/drawer-app-bar/index.js.map +1 -1
  86. package/drawer-app-bar/package.json +3 -3
  87. package/drawer-content/cjs/index.js +1 -1
  88. package/drawer-content/cjs/index.js.map +1 -1
  89. package/drawer-content/cjs/package.json +3 -4
  90. package/drawer-content/index.js +1 -1
  91. package/drawer-content/index.js.map +1 -1
  92. package/drawer-content/package.json +3 -4
  93. package/drawer-item/cjs/index.js +1 -1
  94. package/drawer-item/cjs/index.js.map +1 -1
  95. package/drawer-item/cjs/package.json +3 -4
  96. package/drawer-item/drawer-item-link.d.ts +1 -1
  97. package/drawer-item/drawer-item.d.ts +1 -1
  98. package/drawer-item/drawer-menu-item.d.ts +1 -1
  99. package/drawer-item/index.js +1 -1
  100. package/drawer-item/index.js.map +1 -1
  101. package/drawer-item/package.json +3 -4
  102. package/drawer-layout/cjs/index.js +1 -1
  103. package/drawer-layout/cjs/index.js.map +1 -1
  104. package/drawer-layout/cjs/package.json +3 -3
  105. package/drawer-layout/drawer-layout.d.ts +1 -1
  106. package/drawer-layout/index.js.map +1 -1
  107. package/drawer-layout/package.json +3 -3
  108. package/drawer-main/cjs/index.js +1 -1
  109. package/drawer-main/cjs/index.js.map +1 -1
  110. package/drawer-main/cjs/package.json +3 -3
  111. package/drawer-main/drawer-main.d.ts +1 -1
  112. package/drawer-main/index.js.map +1 -1
  113. package/drawer-main/package.json +3 -3
  114. package/drawer-provider/cjs/index.js +1 -1
  115. package/drawer-provider/cjs/index.js.map +1 -1
  116. package/drawer-provider/cjs/package.json +3 -3
  117. package/drawer-provider/drawer-context.d.ts +0 -1
  118. package/drawer-provider/drawer.provider.d.ts +1 -1
  119. package/drawer-provider/index.js.map +1 -1
  120. package/drawer-provider/package.json +3 -3
  121. package/drawer-section/cjs/index.js +1 -1
  122. package/drawer-section/cjs/index.js.map +1 -1
  123. package/drawer-section/cjs/package.json +3 -4
  124. package/drawer-section/drawer-section.d.ts +1 -1
  125. package/drawer-section/index.js +1 -1
  126. package/drawer-section/index.js.map +1 -1
  127. package/drawer-section/package.json +3 -4
  128. package/drawer-subheader/cjs/index.js +1 -1
  129. package/drawer-subheader/cjs/index.js.map +1 -1
  130. package/drawer-subheader/cjs/package.json +1 -1
  131. package/drawer-subheader/drawer-subheader.d.ts +1 -12
  132. package/drawer-subheader/package.json +1 -1
  133. package/enhanced-remote-table/cjs/index.js +1 -23
  134. package/enhanced-remote-table/cjs/index.js.map +1 -1
  135. package/enhanced-remote-table/cjs/package.json +3 -3
  136. package/enhanced-remote-table/enhanced-remote-table.d.ts +1 -1
  137. package/enhanced-remote-table/enhanced-remote-table.mock.d.ts +1 -1
  138. package/enhanced-remote-table/index.js +1 -23
  139. package/enhanced-remote-table/index.js.map +1 -1
  140. package/enhanced-remote-table/package.json +3 -3
  141. package/enhanced-table/cjs/index.js +1 -23
  142. package/enhanced-table/cjs/index.js.map +1 -1
  143. package/enhanced-table/cjs/package.json +3 -3
  144. package/enhanced-table/enhanced-table-head.d.ts +1 -1
  145. package/enhanced-table/enhanced-table.d.ts +1 -1
  146. package/enhanced-table/enhanced-table.mock.d.ts +1 -1
  147. package/enhanced-table/index.js +1 -23
  148. package/enhanced-table/index.js.map +1 -1
  149. package/enhanced-table/package.json +3 -3
  150. package/expandable-alert/cjs/index.js +1 -1
  151. package/expandable-alert/cjs/index.js.map +1 -1
  152. package/expandable-alert/cjs/package.json +4 -4
  153. package/expandable-alert/index.js.map +1 -1
  154. package/expandable-alert/package.json +4 -4
  155. package/form-dialog/cjs/index.js +1 -1
  156. package/form-dialog/cjs/index.js.map +1 -1
  157. package/form-dialog/cjs/package.json +4 -4
  158. package/form-dialog/form-dialog.d.ts +1 -1
  159. package/form-dialog/index.js.map +1 -1
  160. package/form-dialog/package.json +4 -4
  161. package/generators/cjs/index.js +1 -1
  162. package/generators/cjs/index.js.map +1 -1
  163. package/generators/index.js.map +1 -1
  164. package/group-value-card/cjs/index.js +1 -1
  165. package/group-value-card/cjs/index.js.map +1 -1
  166. package/group-value-card/cjs/package.json +2 -2
  167. package/group-value-card/group-value-card.d.ts +1 -1
  168. package/group-value-card/group-value-card.mock.d.ts +2 -2
  169. package/group-value-card/index.js.map +1 -1
  170. package/group-value-card/package.json +2 -2
  171. package/header/cjs/index.js +1 -1
  172. package/header/cjs/index.js.map +1 -1
  173. package/header/cjs/package.json +2 -3
  174. package/header/header-title.d.ts +2 -2
  175. package/header/index.js +1 -1
  176. package/header/index.js.map +1 -1
  177. package/header/package.json +2 -3
  178. package/header-layout/cjs/index.js +1 -1
  179. package/header-layout/cjs/index.js.map +1 -1
  180. package/header-layout/cjs/package.json +3 -3
  181. package/header-layout/header-layout.d.ts +1 -1
  182. package/header-layout/index.js.map +1 -1
  183. package/header-layout/package.json +3 -3
  184. package/index.d.ts +0 -1
  185. package/index.js +1 -23
  186. package/index.js.map +1 -1
  187. package/label/cjs/index.js +1 -1
  188. package/label/cjs/index.js.map +1 -1
  189. package/label/cjs/package.json +2 -2
  190. package/label/index.js +1 -1
  191. package/label/index.js.map +1 -1
  192. package/label/label.d.ts +5 -1
  193. package/label/package.json +2 -2
  194. package/link-card/cjs/index.js +1 -1
  195. package/link-card/cjs/index.js.map +1 -1
  196. package/link-card/cjs/package.json +2 -3
  197. package/link-card/index.js +1 -1
  198. package/link-card/index.js.map +1 -1
  199. package/link-card/link-card.d.ts +1 -1
  200. package/link-card/package.json +2 -3
  201. package/list-panel/cjs/index.js +1 -1
  202. package/list-panel/cjs/index.js.map +1 -1
  203. package/list-panel/cjs/package.json +2 -3
  204. package/list-panel/index.js +1 -1
  205. package/list-panel/index.js.map +1 -1
  206. package/list-panel/list-panel-panel.d.ts +1 -1
  207. package/list-panel/list-panel.context.d.ts +0 -1
  208. package/list-panel/list-panel.d.ts +1 -1
  209. package/list-panel/list-panel.mocks.d.ts +1 -1
  210. package/list-panel/package.json +2 -3
  211. package/loading-area/cjs/index.js +1 -1
  212. package/loading-area/cjs/index.js.map +1 -1
  213. package/loading-area/cjs/package.json +2 -2
  214. package/loading-area/loading-area.d.ts +1 -1
  215. package/loading-area/package.json +2 -2
  216. package/lorem-ipsum-placeholder/cjs/index.js +1 -1
  217. package/lorem-ipsum-placeholder/cjs/index.js.map +1 -1
  218. package/lorem-ipsum-placeholder/cjs/package.json +2 -2
  219. package/lorem-ipsum-placeholder/lorem-ipsum-placeholder.d.ts +1 -1
  220. package/lorem-ipsum-placeholder/package.json +2 -2
  221. package/markdown/cjs/index.js +1 -1
  222. package/markdown/cjs/index.js.map +1 -1
  223. package/markdown/cjs/package.json +3 -3
  224. package/markdown/markdown.d.ts +1 -1
  225. package/markdown/package.json +3 -3
  226. package/model-form/cjs/index.js +1 -1
  227. package/model-form/cjs/index.js.map +1 -1
  228. package/model-form/cjs/package.json +3 -3
  229. package/model-form/index.js.map +1 -1
  230. package/model-form/model-form-field.d.ts +1 -1
  231. package/model-form/model-form.d.ts +1 -1
  232. package/model-form/package.json +3 -3
  233. package/notification-center/cjs/index.js +1 -1
  234. package/notification-center/cjs/index.js.map +1 -1
  235. package/notification-center/cjs/package.json +2 -2
  236. package/notification-center/index.js +1 -1
  237. package/notification-center/index.js.map +1 -1
  238. package/notification-center/notification-center.context.d.ts +0 -1
  239. package/notification-center/notification-center.provider.d.ts +1 -1
  240. package/notification-center/package.json +2 -2
  241. package/object-details/cjs/index.js +1 -1
  242. package/object-details/cjs/index.js.map +1 -1
  243. package/object-details/cjs/package.json +6 -6
  244. package/object-details/index.js.map +1 -1
  245. package/object-details/object-details.d.ts +1 -1
  246. package/object-details/package.json +6 -6
  247. package/package.json +23 -25
  248. package/placeholder/cjs/index.js +1 -1
  249. package/placeholder/cjs/index.js.map +1 -1
  250. package/placeholder/cjs/package.json +2 -2
  251. package/placeholder/package.json +2 -2
  252. package/placeholder/placeholder.d.ts +1 -1
  253. package/query-container/cjs/index.js +1 -1
  254. package/query-container/cjs/index.js.map +1 -1
  255. package/query-container/cjs/package.json +2 -2
  256. package/query-container/index.js.map +1 -1
  257. package/query-container/package.json +2 -2
  258. package/query-container/query-container.d.ts +1 -1
  259. package/search-input/cjs/index.js +1 -1
  260. package/search-input/cjs/index.js.map +1 -1
  261. package/search-input/cjs/package.json +4 -4
  262. package/search-input/index.js.map +1 -1
  263. package/search-input/package.json +4 -4
  264. package/search-input/search-input.d.ts +1 -1
  265. package/select/cjs/index.js +1 -1
  266. package/select/cjs/index.js.map +1 -1
  267. package/select/cjs/package.json +2 -2
  268. package/select/index.js.map +1 -1
  269. package/select/package.json +2 -2
  270. package/select/select.d.ts +1 -1
  271. package/sign-in/cjs/index.js +1 -1
  272. package/sign-in/cjs/index.js.map +1 -1
  273. package/sign-in/cjs/package.json +3 -3
  274. package/sign-in/index.js.map +1 -1
  275. package/sign-in/package.json +3 -3
  276. package/sign-in/sign-in.d.ts +1 -1
  277. package/skeleton-card/cjs/index.js +1 -1
  278. package/skeleton-card/cjs/index.js.map +1 -1
  279. package/skeleton-card/cjs/package.json +2 -2
  280. package/skeleton-card/package.json +2 -2
  281. package/skeleton-card/skeleton-card.d.ts +1 -1
  282. package/skeleton-grid/cjs/index.js +1 -1
  283. package/skeleton-grid/cjs/index.js.map +1 -1
  284. package/skeleton-grid/cjs/package.json +2 -2
  285. package/skeleton-grid/package.json +2 -2
  286. package/skeleton-grid/skeleton-grid.d.ts +1 -1
  287. package/tab-card/cjs/index.js +1 -1
  288. package/tab-card/cjs/index.js.map +1 -1
  289. package/tab-card/cjs/package.json +2 -2
  290. package/tab-card/index.js.map +1 -1
  291. package/tab-card/package.json +2 -2
  292. package/tab-card/tab-card-panel.d.ts +1 -1
  293. package/tab-card/tab-card.d.ts +1 -1
  294. package/tab-card/tab-card.dummy.d.ts +2 -2
  295. package/tab-panel/cjs/index.js +1 -1
  296. package/tab-panel/cjs/index.js.map +1 -1
  297. package/tab-panel/cjs/package.json +2 -2
  298. package/tab-panel/package.json +2 -2
  299. package/tab-panel/tab-panel.d.ts +1 -2
  300. package/tab-provider/cjs/index.js +1 -1
  301. package/tab-provider/cjs/index.js.map +1 -1
  302. package/tab-provider/cjs/package.json +1 -1
  303. package/tab-provider/package.json +1 -1
  304. package/tab-provider/tab-provider.provider.d.ts +1 -1
  305. package/table-list/cjs/index.js +1 -23
  306. package/table-list/cjs/index.js.map +1 -1
  307. package/table-list/cjs/package.json +3 -3
  308. package/table-list/index.js +1 -23
  309. package/table-list/index.js.map +1 -1
  310. package/table-list/package.json +3 -3
  311. package/table-list/table-list.d.ts +1 -1
  312. package/text-field/cjs/index.js +1 -1
  313. package/text-field/cjs/index.js.map +1 -1
  314. package/text-field/cjs/package.json +2 -2
  315. package/text-field/index.js +1 -1
  316. package/text-field/index.js.map +1 -1
  317. package/text-field/package.json +2 -2
  318. package/text-field/text-field.d.ts +1 -1
  319. package/utils/cjs/index.js +1 -1
  320. package/utils/cjs/index.js.map +1 -1
  321. package/utils/cjs/package.json +1 -1
  322. package/utils/colors.d.ts +1 -0
  323. package/utils/index.js.map +1 -1
  324. package/utils/package.json +1 -1
  325. package/utils/theme.d.ts +2 -2
  326. package/value-base/cjs/index.js +1 -1
  327. package/value-base/cjs/index.js.map +1 -1
  328. package/value-base/cjs/package.json +3 -3
  329. package/value-base/index.js.map +1 -1
  330. package/value-base/package.json +3 -3
  331. package/value-base/value-edit.d.ts +3 -4
  332. package/value-boolean/cjs/index.js +1 -1
  333. package/value-boolean/cjs/index.js.map +1 -1
  334. package/value-boolean/cjs/package.json +3 -3
  335. package/value-boolean/index.js.map +1 -1
  336. package/value-boolean/package.json +3 -3
  337. package/value-boolean/value-boolean.d.ts +1 -1
  338. package/value-card/cjs/index.js +1 -1
  339. package/value-card/cjs/index.js.map +1 -1
  340. package/value-card/cjs/package.json +2 -2
  341. package/value-card/package.json +2 -2
  342. package/value-card/value-card.d.ts +1 -1
  343. package/value-content/cjs/index.js +1 -1
  344. package/value-content/cjs/index.js.map +1 -1
  345. package/value-content/cjs/package.json +2 -2
  346. package/value-content/index.js.map +1 -1
  347. package/value-content/package.json +2 -2
  348. package/value-content/value-content.d.ts +1 -2
  349. package/value-datetime/cjs/index.js +1 -1
  350. package/value-datetime/cjs/index.js.map +1 -1
  351. package/value-datetime/cjs/package.json +5 -5
  352. package/value-datetime/index.js.map +1 -1
  353. package/value-datetime/package.json +5 -5
  354. package/value-datetime/value-datetime.d.ts +1 -1
  355. package/value-image/cjs/index.js +1 -1
  356. package/value-image/cjs/index.js.map +1 -1
  357. package/value-image/cjs/package.json +2 -2
  358. package/value-image/index.js.map +1 -1
  359. package/value-image/package.json +2 -2
  360. package/value-image/value-image.d.ts +1 -1
  361. package/value-item/cjs/index.js +1 -1
  362. package/value-item/cjs/index.js.map +1 -1
  363. package/value-item/cjs/package.json +2 -2
  364. package/value-item/index.js.map +1 -1
  365. package/value-item/package.json +2 -2
  366. package/value-label/cjs/index.js +1 -1
  367. package/value-label/cjs/index.js.map +1 -1
  368. package/value-label/cjs/package.json +3 -3
  369. package/value-label/index.js +1 -1
  370. package/value-label/index.js.map +1 -1
  371. package/value-label/package.json +3 -3
  372. package/value-label/value-label.d.ts +3 -2
  373. package/value-rating/cjs/index.js +1 -1
  374. package/value-rating/cjs/index.js.map +1 -1
  375. package/value-rating/cjs/package.json +3 -3
  376. package/value-rating/index.js +1 -1
  377. package/value-rating/index.js.map +1 -1
  378. package/value-rating/package.json +3 -3
  379. package/value-rating/value-rating.d.ts +1 -1
  380. package/value-text/cjs/index.js +1 -1
  381. package/value-text/cjs/index.js.map +1 -1
  382. package/value-text/cjs/package.json +3 -3
  383. package/value-text/index.js.map +1 -1
  384. package/value-text/package.json +3 -3
  385. package/value-text/value-text.d.ts +1 -1
  386. package/hooks/cjs/index.js +0 -2
  387. package/hooks/cjs/index.js.map +0 -1
  388. package/hooks/cjs/package.json +0 -11
  389. package/hooks/index.d.ts +0 -1
  390. package/hooks/index.js +0 -2
  391. package/hooks/index.js.map +0 -1
  392. package/hooks/package.json +0 -11
  393. package/hooks/routing/index.d.ts +0 -1
  394. package/hooks/routing/routing.hooks.d.ts +0 -6
  395. package/link/cjs/index.js +0 -2
  396. package/link/cjs/index.js.map +0 -1
  397. package/link/cjs/package.json +0 -12
  398. package/link/index.d.ts +0 -1
  399. package/link/index.js +0 -2
  400. package/link/index.js.map +0 -1
  401. package/link/link.d.ts +0 -7
  402. package/link/package.json +0 -12
  403. package/model-router/cjs/index.js +0 -24
  404. package/model-router/cjs/index.js.map +0 -1
  405. package/model-router/cjs/package.json +0 -16
  406. package/model-router/index.d.ts +0 -2
  407. package/model-router/index.js +0 -24
  408. package/model-router/index.js.map +0 -1
  409. package/model-router/model-router.d.ts +0 -4
  410. package/model-router/model-router.types.d.ts +0 -9
  411. package/model-router/package.json +0 -16
  412. package/model-router/screens/add-screen.d.ts +0 -16
  413. package/model-router/screens/details-screen.d.ts +0 -20
  414. package/model-router/screens/index.d.ts +0 -4
  415. package/model-router/screens/list-screen.d.ts +0 -30
  416. package/model-router/screens/screens.types.d.ts +0 -31
  417. package/model-router/screens/update-screen.d.ts +0 -29
  418. package/model-router/stories/templates.d.ts +0 -21
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),a=require("@mui/material/Dialog"),t=require("@mui/material/DialogTitle"),i=require("@mui/material/DialogActions"),r=require("@mui/material/IconButton"),n=require("@mui/material/DialogContent"),o=require("@mui/material/CircularProgress"),c=require("@mui/material/Box"),s=require("@mui/material/Button"),u=require("@mui/lab/LoadingButton"),d=require("@mui/icons-material/Close"),p=require("@mui/material/TextField");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=m(a),C=m(t),f=m(i),b=m(r),h=m(n),g=m(o),j=m(c),q=m(s),y=m(u),T=m(d),v=m(p);const A=({open:l,title:a,component:t,componentProps:i={},disabled:r,disableAccept:n,disableCancel:o,actions:c=[],children:s,loading:u,cancelable:d,callCloseWhenCancel:p=!0,acceptable:m,acceptText:v="Accept",cancelText:A="Cancel",onAccept:k,onCancel:D=(()=>null),onClose:B,acceptType:P="button"})=>{const W=c.length>0||m||d;return e.jsxs(x.default,{open:l,onClose:B,children:[e.jsxs(C.default,{sx:{display:"flex",alignItems:"center"},children:[a,u&&!m&&e.jsx(g.default,{size:20,sx:{ml:2,color:e=>e.palette.grey[500]}}),e.jsx(b.default,{disabled:r,"aria-label":"close",onClick:B,sx:{position:"absolute",right:8,top:8,color:e=>e.palette.grey[500]},children:e.jsx(T.default,{})})]}),e.jsxs(j.default,{component:t,...i,children:[e.jsx(h.default,{dividers:!0,children:s}),W&&e.jsxs(f.default,{children:[c.map((({id:l,text:a,type:t="button",onClick:i,color:n="primary"})=>e.jsx(q.default,{type:t,disabled:r,onClick:i,color:n,children:a},l))),d&&e.jsx(q.default,{color:"error",disabled:r||o,onClick:()=>{D(),p&&B()},children:A}),m&&e.jsx(y.default,{type:P,loading:u,disabled:r||n,onClick:k,children:v})]})]})]})};exports.ConfirmDialog=({open:a,title:t,loading:i,disabled:r,confirmText:n="Confirm",cancelText:o="Cancel",passphrase:c,children:s,onConfirm:u,onCancel:d})=>{const[p,m]=l.useState(""),x=!c||p===c;return e.jsxs(A,{title:t,loading:i,disabled:i||r,disableAccept:!x,open:a,onClose:d,acceptable:!0,cancelable:!0,callCloseWhenCancel:!1,acceptText:n,cancelText:o,onCancel:d,onAccept:u,children:[s,c&&e.jsx(v.default,{size:"small",fullWidth:!0,value:p,onChange:e=>m(e.target.value),placeholder:c})]})};
1
+ "use strict";var e=require("react/jsx-runtime"),l=require("react"),i=require("@mui/material/Dialog"),a=require("@mui/material/DialogTitle"),r=require("@mui/material/DialogActions"),n=require("@mui/material/IconButton"),t=require("@mui/material/DialogContent"),c=require("@mui/material/CircularProgress"),o=require("@mui/material/Box"),s=require("@mui/material/Button"),d=require("@mui/lab/LoadingButton"),u=require("@mui/icons-material/Close"),m=require("@mui/material/TextField");const p=({open:l,title:m,component:p,componentProps:x={},disabled:C,disableAccept:h,disableCancel:b,actions:g=[],children:j,loading:q,cancelable:T,callCloseWhenCancel:y=!0,acceptable:f,acceptText:A="Accept",cancelText:k="Cancel",onAccept:D,onCancel:v=(()=>null),onClose:B,acceptType:W="button"})=>{const z=g.length>0||f||T;return e.jsxs(i,{open:l,onClose:B,children:[e.jsxs(a,{sx:{display:"flex",alignItems:"center"},children:[m,q&&!f&&e.jsx(c,{size:20,sx:{ml:2,color:e=>e.palette.grey[500]}}),e.jsx(n,{disabled:C,"aria-label":"close",onClick:B,sx:{position:"absolute",right:8,top:8,color:e=>e.palette.grey[500]},children:e.jsx(u,{})})]}),e.jsxs(o,{component:p,...x,children:[e.jsx(t,{dividers:!0,children:j}),z&&e.jsxs(r,{children:[g.map((({id:l,text:i,type:a="button",onClick:r,color:n="primary"})=>e.jsx(s,{type:a,disabled:C,onClick:r,color:n,children:i},l))),T&&e.jsx(s,{color:"error",disabled:C||b,onClick:()=>{v(),y&&B()},children:k}),f&&e.jsx(d,{type:W,loading:q,disabled:C||h,onClick:D,children:A})]})]})]})};exports.ConfirmDialog=({open:i,title:a,loading:r,disabled:n,confirmText:t="Confirm",cancelText:c="Cancel",passphrase:o,children:s,onConfirm:d,onCancel:u})=>{const[x,C]=l.useState(""),h=!o||x===o;return e.jsxs(p,{title:a,loading:r,disabled:r||n,disableAccept:!h,open:i,onClose:u,acceptable:!0,cancelable:!0,callCloseWhenCancel:!1,acceptText:t,cancelText:c,onCancel:u,onAccept:d,children:[s,o&&e.jsx(m,{size:"small",fullWidth:!0,value:x,onChange:e=>C(e.target.value),placeholder:o})]})};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/bootstrap-dialog/bootstrap-dialog.tsx","../../../src/confirm-dialog/confirm-dialog.tsx"],"sourcesContent":["import Dialog from \"@mui/material/Dialog\";\nimport DialogTitle from \"@mui/material/DialogTitle\";\nimport DialogActions from \"@mui/material/DialogActions\";\nimport IconButton from \"@mui/material/IconButton\";\nimport DialogContent from \"@mui/material/DialogContent\";\nimport CircularProgress from \"@mui/material/CircularProgress\";\nimport Box from \"@mui/material/Box\";\nimport Button from \"@mui/material/Button\";\nimport LoadingButton from \"@mui/lab/LoadingButton\";\nimport CloseIcon from \"@mui/icons-material/Close\";\nimport { BootstrapDialogDialogProps } from \"../dialog/dialog.types\";\n\nexport const BootstrapDialog = ({\n open,\n title,\n component,\n componentProps = {},\n disabled,\n disableAccept,\n disableCancel,\n actions = [],\n children,\n loading,\n cancelable,\n callCloseWhenCancel = true,\n acceptable,\n acceptText = \"Accept\",\n cancelText = \"Cancel\",\n onAccept,\n onCancel = () => null,\n onClose,\n acceptType = \"button\",\n}: BootstrapDialogDialogProps) => {\n const hasActions = actions.length > 0 || acceptable || cancelable;\n\n return (\n <Dialog open={open} onClose={onClose}>\n <DialogTitle sx={{ display: \"flex\", alignItems: \"center\" }}>\n {title}\n {loading && !acceptable && (\n <CircularProgress size={20} sx={{ ml: 2, color: (theme) => theme.palette.grey[500] }} />\n )}\n <IconButton\n disabled={disabled}\n aria-label=\"close\"\n onClick={onClose}\n sx={{\n position: \"absolute\",\n right: 8,\n top: 8,\n color: (theme) => theme.palette.grey[500],\n }}\n >\n <CloseIcon />\n </IconButton>\n </DialogTitle>\n <Box component={component} {...componentProps}>\n <DialogContent dividers>{children}</DialogContent>\n {hasActions && (\n <DialogActions>\n {actions.map(({ id, text, type = \"button\", onClick, color = \"primary\" }) => (\n <Button key={id} type={type} disabled={disabled} onClick={onClick} color={color}>\n {text}\n </Button>\n ))}\n {cancelable && (\n <Button\n color=\"error\"\n disabled={disabled || disableCancel}\n onClick={() => {\n onCancel();\n callCloseWhenCancel && onClose();\n }}\n >\n {cancelText}\n </Button>\n )}\n\n {acceptable && (\n <LoadingButton\n type={acceptType}\n loading={loading}\n disabled={disabled || disableAccept}\n onClick={onAccept}\n >\n {acceptText}\n </LoadingButton>\n )}\n </DialogActions>\n )}\n </Box>\n </Dialog>\n );\n};\n","import { useState } from \"react\";\nimport { BootstrapDialog } from \"../bootstrap-dialog\";\nimport { BootstrapDialogDialogProps } from \"../dialog/dialog.types\";\nimport TextField from \"@mui/material/TextField\";\n\ntype OmitBaseDialogProps =\n | \"cancelable\"\n | \"acceptable\"\n | \"onAccept\"\n | \"onCancel\"\n | \"onClose\"\n | \"actions\"\n | \"callCloseWhenCancel\"\n | \"component\"\n | \"acceptType\";\nexport interface ConfirmDialogProps extends Omit<BootstrapDialogDialogProps, OmitBaseDialogProps> {\n confirmText?: string;\n canceText?: string;\n passphrase?: string;\n onCancel: () => void;\n onConfirm: () => void;\n}\n\nexport const ConfirmDialog = ({\n open,\n title,\n loading,\n disabled,\n confirmText = \"Confirm\",\n cancelText = \"Cancel\",\n passphrase,\n children,\n onConfirm,\n onCancel,\n}: ConfirmDialogProps) => {\n const [inputPassphrase, setInputPassphrase] = useState(\"\");\n const validPassphrase = !passphrase || inputPassphrase === passphrase;\n\n return (\n <BootstrapDialog\n title={title}\n loading={loading}\n disabled={loading || disabled}\n disableAccept={!validPassphrase}\n open={open}\n onClose={onCancel}\n acceptable\n cancelable\n callCloseWhenCancel={false}\n acceptText={confirmText}\n cancelText={cancelText}\n onCancel={onCancel}\n onAccept={onConfirm}\n >\n {children}\n {passphrase && (\n <TextField\n size=\"small\"\n fullWidth\n value={inputPassphrase}\n onChange={(e) => setInputPassphrase(e.target.value)}\n placeholder={passphrase}\n />\n )}\n </BootstrapDialog>\n );\n};\n"],"names":["BootstrapDialog","open","title","component","componentProps","disabled","disableAccept","disableCancel","actions","children","loading","cancelable","callCloseWhenCancel","acceptable","acceptText","cancelText","onAccept","onCancel","onClose","acceptType","hasActions","length","_jsxs","Dialog","jsxs","DialogTitle","sx","display","alignItems","_jsx","CircularProgress","size","ml","color","theme","palette","grey","IconButton","onClick","position","right","top","CloseIcon","Box","jsx","DialogContent","dividers","DialogActions","map","id","text","type","Button","LoadingButton","confirmText","passphrase","onConfirm","inputPassphrase","setInputPassphrase","useState","validPassphrase","TextField","fullWidth","value","onChange","e","target","placeholder"],"mappings":"irBAYO,MAAMA,EAAkB,EAC7BC,OACAC,QACAC,YACAC,iBAAiB,CAAA,EACjBC,WACAC,gBACAC,gBACAC,UAAU,GACVC,WACAC,UACAC,aACAC,uBAAsB,EACtBC,aACAC,aAAa,SACbC,aAAa,SACbC,WACAC,WAAW,KAAM,MACjBC,UACAC,aAAa,aAEb,MAAMC,EAAaZ,EAAQa,OAAS,GAAKR,GAAcF,EAEvD,OACEW,OAACC,EAAAA,QAAO,CAAAtB,KAAMA,EAAMiB,QAASA,EAC3BT,SAAA,CAAAa,EAAAE,KAACC,EAAW,QAAC,CAAAC,GAAI,CAAEC,QAAS,OAAQC,WAAY,UAAUnB,SAAA,CACvDP,EACAQ,IAAYG,GACXgB,MAACC,EAAgB,QAAA,CAACC,KAAM,GAAIL,GAAI,CAAEM,GAAI,EAAGC,MAAQC,GAAUA,EAAMC,QAAQC,KAAK,QAEhFP,EAAAA,IAACQ,EAAU,SACThC,SAAUA,EAAQ,aACP,QACXiC,QAASpB,EACTQ,GAAI,CACFa,SAAU,WACVC,MAAO,EACPC,IAAK,EACLR,MAAQC,GAAUA,EAAMC,QAAQC,KAAK,MAGvC3B,SAAAoB,EAAAA,IAACa,EAAAA,QAAY,CAAA,QAGjBpB,EAAAA,KAACqB,EAAAA,QAAI,CAAAxC,UAAWA,KAAeC,EAC7BK,SAAA,CAAAoB,EAAAe,IAACC,EAAa,QAAC,CAAAC,UAAU,EAAArC,SAAAA,IACxBW,GACCE,EAAAA,KAACyB,EAAAA,QAAa,CAAAtC,SAAA,CACXD,EAAQwC,KAAI,EAAGC,KAAIC,OAAMC,OAAO,SAAUb,UAASL,QAAQ,aAC1DJ,EAAAA,IAACuB,EAAAA,SAAgBD,KAAMA,EAAM9C,SAAUA,EAAUiC,QAASA,EAASL,MAAOA,EAAKxB,SAC5EyC,GADUD,KAIdtC,GACCkB,EAAAe,IAACQ,EAAM,QAAA,CACLnB,MAAM,QACN5B,SAAUA,GAAYE,EACtB+B,QAAS,KACPrB,IACAL,GAAuBM,GAAS,WAGjCH,IAIJF,GACCgB,EAAAA,IAACwB,EAAa,SACZF,KAAMhC,EACNT,QAASA,EACTL,SAAUA,GAAYC,EACtBgC,QAAStB,EAERP,SAAAK,YAOb,wBCrEyB,EAC3Bb,OACAC,QACAQ,UACAL,WACAiD,cAAc,UACdvC,aAAa,SACbwC,aACA9C,WACA+C,YACAvC,eAEA,MAAOwC,EAAiBC,GAAsBC,EAAQA,SAAC,IACjDC,GAAmBL,GAAcE,IAAoBF,EAE3D,OACEjC,OAACtB,EAAe,CACdE,MAAOA,EACPQ,QAASA,EACTL,SAAUK,GAAWL,EACrBC,eAAgBsD,EAChB3D,KAAMA,EACNiB,QAASD,EACTJ,cACAF,YAAU,EACVC,qBAAqB,EACrBE,WAAYwC,EACZvC,WAAYA,EACZE,SAAUA,EACVD,SAAUwC,YAET/C,EACA8C,GACC1B,MAACgC,EAAAA,QAAS,CACR9B,KAAK,QACL+B,WAAS,EACTC,MAAON,EACPO,SAAWC,GAAMP,EAAmBO,EAAEC,OAAOH,OAC7CI,YAAaZ,MAInB"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/bootstrap-dialog/bootstrap-dialog.tsx","../../../src/confirm-dialog/confirm-dialog.tsx"],"sourcesContent":["import Dialog from \"@mui/material/Dialog\";\nimport DialogTitle from \"@mui/material/DialogTitle\";\nimport DialogActions from \"@mui/material/DialogActions\";\nimport IconButton from \"@mui/material/IconButton\";\nimport DialogContent from \"@mui/material/DialogContent\";\nimport CircularProgress from \"@mui/material/CircularProgress\";\nimport Box from \"@mui/material/Box\";\nimport Button from \"@mui/material/Button\";\nimport LoadingButton from \"@mui/lab/LoadingButton\";\nimport CloseIcon from \"@mui/icons-material/Close\";\nimport { BootstrapDialogDialogProps } from \"../dialog/dialog.types\";\n\nexport const BootstrapDialog = ({\n open,\n title,\n component,\n componentProps = {},\n disabled,\n disableAccept,\n disableCancel,\n actions = [],\n children,\n loading,\n cancelable,\n callCloseWhenCancel = true,\n acceptable,\n acceptText = \"Accept\",\n cancelText = \"Cancel\",\n onAccept,\n onCancel = () => null,\n onClose,\n acceptType = \"button\",\n}: BootstrapDialogDialogProps) => {\n const hasActions = actions.length > 0 || acceptable || cancelable;\n\n return (\n <Dialog open={open} onClose={onClose}>\n <DialogTitle sx={{ display: \"flex\", alignItems: \"center\" }}>\n {title}\n {loading && !acceptable && (\n <CircularProgress size={20} sx={{ ml: 2, color: (theme) => theme.palette.grey[500] }} />\n )}\n <IconButton\n disabled={disabled}\n aria-label=\"close\"\n onClick={onClose}\n sx={{\n position: \"absolute\",\n right: 8,\n top: 8,\n color: (theme) => theme.palette.grey[500],\n }}\n >\n <CloseIcon />\n </IconButton>\n </DialogTitle>\n <Box component={component} {...componentProps}>\n <DialogContent dividers>{children}</DialogContent>\n {hasActions && (\n <DialogActions>\n {actions.map(({ id, text, type = \"button\", onClick, color = \"primary\" }) => (\n <Button key={id} type={type} disabled={disabled} onClick={onClick} color={color}>\n {text}\n </Button>\n ))}\n {cancelable && (\n <Button\n color=\"error\"\n disabled={disabled || disableCancel}\n onClick={() => {\n onCancel();\n if (callCloseWhenCancel) {\n onClose();\n }\n }}\n >\n {cancelText}\n </Button>\n )}\n\n {acceptable && (\n <LoadingButton\n type={acceptType}\n loading={loading}\n disabled={disabled || disableAccept}\n onClick={onAccept}\n >\n {acceptText}\n </LoadingButton>\n )}\n </DialogActions>\n )}\n </Box>\n </Dialog>\n );\n};\n","import { useState } from \"react\";\nimport { BootstrapDialog } from \"../bootstrap-dialog\";\nimport { BootstrapDialogDialogProps } from \"../dialog/dialog.types\";\nimport TextField from \"@mui/material/TextField\";\n\ntype OmitBaseDialogProps =\n | \"cancelable\"\n | \"acceptable\"\n | \"onAccept\"\n | \"onCancel\"\n | \"onClose\"\n | \"actions\"\n | \"callCloseWhenCancel\"\n | \"component\"\n | \"acceptType\";\nexport interface ConfirmDialogProps extends Omit<BootstrapDialogDialogProps, OmitBaseDialogProps> {\n confirmText?: string;\n canceText?: string;\n passphrase?: string;\n onCancel: () => void;\n onConfirm: () => void;\n}\n\nexport const ConfirmDialog = ({\n open,\n title,\n loading,\n disabled,\n confirmText = \"Confirm\",\n cancelText = \"Cancel\",\n passphrase,\n children,\n onConfirm,\n onCancel,\n}: ConfirmDialogProps) => {\n const [inputPassphrase, setInputPassphrase] = useState(\"\");\n const validPassphrase = !passphrase || inputPassphrase === passphrase;\n\n return (\n <BootstrapDialog\n title={title}\n loading={loading}\n disabled={loading || disabled}\n disableAccept={!validPassphrase}\n open={open}\n onClose={onCancel}\n acceptable\n cancelable\n callCloseWhenCancel={false}\n acceptText={confirmText}\n cancelText={cancelText}\n onCancel={onCancel}\n onAccept={onConfirm}\n >\n {children}\n {passphrase && (\n <TextField\n size=\"small\"\n fullWidth\n value={inputPassphrase}\n onChange={(e) => setInputPassphrase(e.target.value)}\n placeholder={passphrase}\n />\n )}\n </BootstrapDialog>\n );\n};\n"],"names":["BootstrapDialog","open","title","component","componentProps","disabled","disableAccept","disableCancel","actions","children","loading","cancelable","callCloseWhenCancel","acceptable","acceptText","cancelText","onAccept","onCancel","onClose","acceptType","hasActions","length","_jsxs","Dialog","jsxs","DialogTitle","sx","display","alignItems","_jsx","CircularProgress","size","ml","color","theme","palette","grey","IconButton","onClick","position","right","top","CloseIcon","Box","jsx","DialogContent","dividers","DialogActions","map","id","text","type","Button","LoadingButton","confirmText","passphrase","onConfirm","inputPassphrase","setInputPassphrase","useState","validPassphrase","TextField","fullWidth","value","onChange","e","target","placeholder"],"mappings":"ieAYO,MAAMA,EAAkB,EAC7BC,OACAC,QACAC,YACAC,iBAAiB,CAAA,EACjBC,WACAC,gBACAC,gBACAC,UAAU,GACVC,WACAC,UACAC,aACAC,uBAAsB,EACtBC,aACAC,aAAa,SACbC,aAAa,SACbC,WACAC,WAAW,KAAM,MACjBC,UACAC,aAAa,aAEb,MAAMC,EAAaZ,EAAQa,OAAS,GAAKR,GAAcF,EAEvD,OACEW,OAACC,EAAO,CAAAtB,KAAMA,EAAMiB,QAASA,EAC3BT,SAAA,CAAAa,EAAAE,KAACC,EAAY,CAAAC,GAAI,CAAEC,QAAS,OAAQC,WAAY,UAAUnB,SAAA,CACvDP,EACAQ,IAAYG,GACXgB,MAACC,EAAgB,CAACC,KAAM,GAAIL,GAAI,CAAEM,GAAI,EAAGC,MAAQC,GAAUA,EAAMC,QAAQC,KAAK,QAEhFP,EAAAA,IAACQ,GACChC,SAAUA,EAAQ,aACP,QACXiC,QAASpB,EACTQ,GAAI,CACFa,SAAU,WACVC,MAAO,EACPC,IAAK,EACLR,MAAQC,GAAUA,EAAMC,QAAQC,KAAK,MAGvC3B,SAAAoB,EAAAA,IAACa,EAAY,CAAA,QAGjBpB,EAAAA,KAACqB,EAAI,CAAAxC,UAAWA,KAAeC,EAC7BK,SAAA,CAAAoB,EAAAe,IAACC,EAAc,CAAAC,UAAU,EAAArC,SAAAA,IACxBW,GACCE,EAAAA,KAACyB,EAAa,CAAAtC,SAAA,CACXD,EAAQwC,KAAI,EAAGC,KAAIC,OAAMC,OAAO,SAAUb,UAASL,QAAQ,aAC1DJ,EAAAA,IAACuB,GAAgBD,KAAMA,EAAM9C,SAAUA,EAAUiC,QAASA,EAASL,MAAOA,EAAKxB,SAC5EyC,GADUD,KAIdtC,GACCkB,EAAAe,IAACQ,EAAM,CACLnB,MAAM,QACN5B,SAAUA,GAAYE,EACtB+B,QAAS,KACPrB,IACIL,GACFM,cAIHH,IAIJF,GACCgB,EAAAA,IAACwB,GACCF,KAAMhC,EACNT,QAASA,EACTL,SAAUA,GAAYC,EACtBgC,QAAStB,EAERP,SAAAK,YAMJ,wBCtEgB,EAC3Bb,OACAC,QACAQ,UACAL,WACAiD,cAAc,UACdvC,aAAa,SACbwC,aACA9C,WACA+C,YACAvC,eAEA,MAAOwC,EAAiBC,GAAsBC,EAAAA,SAAS,IACjDC,GAAmBL,GAAcE,IAAoBF,EAE3D,OACEjC,OAACtB,EAAe,CACdE,MAAOA,EACPQ,QAASA,EACTL,SAAUK,GAAWL,EACrBC,eAAgBsD,EAChB3D,KAAMA,EACNiB,QAASD,EACTJ,cACAF,YAAU,EACVC,qBAAqB,EACrBE,WAAYwC,EACZvC,WAAYA,EACZE,SAAUA,EACVD,SAAUwC,YAET/C,EACA8C,GACC1B,MAACgC,EAAS,CACR9B,KAAK,QACL+B,WAAS,EACTC,MAAON,EACPO,SAAWC,GAAMP,EAAmBO,EAAEC,OAAOH,OAC7CI,YAAaZ,MAGD"}
@@ -5,9 +5,9 @@
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "dependencies": {
8
- "@mui/icons-material": "^5.11.16",
9
- "@mui/lab": "^5.0.0-alpha.134",
10
- "@mui/material": "^5.13.6",
11
- "react": "^18.2.0"
8
+ "@mui/icons-material": "^6.4.5",
9
+ "@mui/lab": "^6.0.0-beta.28",
10
+ "@mui/material": "^6.4.5",
11
+ "react": "^19.0.0"
12
12
  }
13
13
  }
@@ -7,5 +7,5 @@ export interface ConfirmDialogProps extends Omit<BootstrapDialogDialogProps, Omi
7
7
  onCancel: () => void;
8
8
  onConfirm: () => void;
9
9
  }
10
- export declare const ConfirmDialog: ({ open, title, loading, disabled, confirmText, cancelText, passphrase, children, onConfirm, onCancel, }: ConfirmDialogProps) => JSX.Element;
10
+ export declare const ConfirmDialog: ({ open, title, loading, disabled, confirmText, cancelText, passphrase, children, onConfirm, onCancel, }: ConfirmDialogProps) => import("react/jsx-runtime").JSX.Element;
11
11
  export {};
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/bootstrap-dialog/bootstrap-dialog.tsx","../../src/confirm-dialog/confirm-dialog.tsx"],"sourcesContent":["import Dialog from \"@mui/material/Dialog\";\nimport DialogTitle from \"@mui/material/DialogTitle\";\nimport DialogActions from \"@mui/material/DialogActions\";\nimport IconButton from \"@mui/material/IconButton\";\nimport DialogContent from \"@mui/material/DialogContent\";\nimport CircularProgress from \"@mui/material/CircularProgress\";\nimport Box from \"@mui/material/Box\";\nimport Button from \"@mui/material/Button\";\nimport LoadingButton from \"@mui/lab/LoadingButton\";\nimport CloseIcon from \"@mui/icons-material/Close\";\nimport { BootstrapDialogDialogProps } from \"../dialog/dialog.types\";\n\nexport const BootstrapDialog = ({\n open,\n title,\n component,\n componentProps = {},\n disabled,\n disableAccept,\n disableCancel,\n actions = [],\n children,\n loading,\n cancelable,\n callCloseWhenCancel = true,\n acceptable,\n acceptText = \"Accept\",\n cancelText = \"Cancel\",\n onAccept,\n onCancel = () => null,\n onClose,\n acceptType = \"button\",\n}: BootstrapDialogDialogProps) => {\n const hasActions = actions.length > 0 || acceptable || cancelable;\n\n return (\n <Dialog open={open} onClose={onClose}>\n <DialogTitle sx={{ display: \"flex\", alignItems: \"center\" }}>\n {title}\n {loading && !acceptable && (\n <CircularProgress size={20} sx={{ ml: 2, color: (theme) => theme.palette.grey[500] }} />\n )}\n <IconButton\n disabled={disabled}\n aria-label=\"close\"\n onClick={onClose}\n sx={{\n position: \"absolute\",\n right: 8,\n top: 8,\n color: (theme) => theme.palette.grey[500],\n }}\n >\n <CloseIcon />\n </IconButton>\n </DialogTitle>\n <Box component={component} {...componentProps}>\n <DialogContent dividers>{children}</DialogContent>\n {hasActions && (\n <DialogActions>\n {actions.map(({ id, text, type = \"button\", onClick, color = \"primary\" }) => (\n <Button key={id} type={type} disabled={disabled} onClick={onClick} color={color}>\n {text}\n </Button>\n ))}\n {cancelable && (\n <Button\n color=\"error\"\n disabled={disabled || disableCancel}\n onClick={() => {\n onCancel();\n callCloseWhenCancel && onClose();\n }}\n >\n {cancelText}\n </Button>\n )}\n\n {acceptable && (\n <LoadingButton\n type={acceptType}\n loading={loading}\n disabled={disabled || disableAccept}\n onClick={onAccept}\n >\n {acceptText}\n </LoadingButton>\n )}\n </DialogActions>\n )}\n </Box>\n </Dialog>\n );\n};\n","import { useState } from \"react\";\nimport { BootstrapDialog } from \"../bootstrap-dialog\";\nimport { BootstrapDialogDialogProps } from \"../dialog/dialog.types\";\nimport TextField from \"@mui/material/TextField\";\n\ntype OmitBaseDialogProps =\n | \"cancelable\"\n | \"acceptable\"\n | \"onAccept\"\n | \"onCancel\"\n | \"onClose\"\n | \"actions\"\n | \"callCloseWhenCancel\"\n | \"component\"\n | \"acceptType\";\nexport interface ConfirmDialogProps extends Omit<BootstrapDialogDialogProps, OmitBaseDialogProps> {\n confirmText?: string;\n canceText?: string;\n passphrase?: string;\n onCancel: () => void;\n onConfirm: () => void;\n}\n\nexport const ConfirmDialog = ({\n open,\n title,\n loading,\n disabled,\n confirmText = \"Confirm\",\n cancelText = \"Cancel\",\n passphrase,\n children,\n onConfirm,\n onCancel,\n}: ConfirmDialogProps) => {\n const [inputPassphrase, setInputPassphrase] = useState(\"\");\n const validPassphrase = !passphrase || inputPassphrase === passphrase;\n\n return (\n <BootstrapDialog\n title={title}\n loading={loading}\n disabled={loading || disabled}\n disableAccept={!validPassphrase}\n open={open}\n onClose={onCancel}\n acceptable\n cancelable\n callCloseWhenCancel={false}\n acceptText={confirmText}\n cancelText={cancelText}\n onCancel={onCancel}\n onAccept={onConfirm}\n >\n {children}\n {passphrase && (\n <TextField\n size=\"small\"\n fullWidth\n value={inputPassphrase}\n onChange={(e) => setInputPassphrase(e.target.value)}\n placeholder={passphrase}\n />\n )}\n </BootstrapDialog>\n );\n};\n"],"names":["BootstrapDialog","open","title","component","componentProps","disabled","disableAccept","disableCancel","actions","children","loading","cancelable","callCloseWhenCancel","acceptable","acceptText","cancelText","onAccept","onCancel","onClose","acceptType","hasActions","length","_jsxs","Dialog","DialogTitle","sx","display","alignItems","_jsx","CircularProgress","size","ml","color","theme","palette","grey","IconButton","onClick","position","right","top","CloseIcon","Box","DialogContent","dividers","DialogActions","map","id","text","type","Button","LoadingButton","ConfirmDialog","confirmText","passphrase","onConfirm","inputPassphrase","setInputPassphrase","useState","TextField","fullWidth","value","onChange","e","target","placeholder"],"mappings":"ugBAYO,MAAMA,EAAkB,EAC7BC,OACAC,QACAC,YACAC,iBAAiB,CAAA,EACjBC,WACAC,gBACAC,gBACAC,UAAU,GACVC,WACAC,UACAC,aACAC,uBAAsB,EACtBC,aACAC,aAAa,SACbC,aAAa,SACbC,WACAC,WAAW,KAAM,MACjBC,UACAC,aAAa,aAEb,MAAMC,EAAaZ,EAAQa,OAAS,GAAKR,GAAcF,EAEvD,OACEW,EAACC,EAAO,CAAAtB,KAAMA,EAAMiB,QAASA,EAC3BT,SAAA,CAAAa,EAACE,EAAY,CAAAC,GAAI,CAAEC,QAAS,OAAQC,WAAY,UAAUlB,SAAA,CACvDP,EACAQ,IAAYG,GACXe,EAACC,EAAgB,CAACC,KAAM,GAAIL,GAAI,CAAEM,GAAI,EAAGC,MAAQC,GAAUA,EAAMC,QAAQC,KAAK,QAEhFP,EAACQ,GACC/B,SAAUA,EAAQ,aACP,QACXgC,QAASnB,EACTO,GAAI,CACFa,SAAU,WACVC,MAAO,EACPC,IAAK,EACLR,MAAQC,GAAUA,EAAMC,QAAQC,KAAK,MAGvC1B,SAAAmB,EAACa,EAAY,CAAA,QAGjBnB,EAACoB,EAAI,CAAAvC,UAAWA,KAAeC,EAC7BK,SAAA,CAAAmB,EAACe,EAAc,CAAAC,UAAU,EAAAnC,SAAAA,IACxBW,GACCE,EAACuB,EAAa,CAAApC,SAAA,CACXD,EAAQsC,KAAI,EAAGC,KAAIC,OAAMC,OAAO,SAAUZ,UAASL,QAAQ,aAC1DJ,EAACsB,GAAgBD,KAAMA,EAAM5C,SAAUA,EAAUgC,QAASA,EAASL,MAAOA,EAAKvB,SAC5EuC,GADUD,KAIdpC,GACCiB,EAACsB,EAAM,CACLlB,MAAM,QACN3B,SAAUA,GAAYE,EACtB8B,QAAS,KACPpB,IACAL,GAAuBM,GAAS,WAGjCH,IAIJF,GACCe,EAACuB,GACCF,KAAM9B,EACNT,QAASA,EACTL,SAAUA,GAAYC,EACtB+B,QAASrB,EAERP,SAAAK,YAOb,ECrESsC,EAAgB,EAC3BnD,OACAC,QACAQ,UACAL,WACAgD,cAAc,UACdtC,aAAa,SACbuC,aACA7C,WACA8C,YACAtC,eAEA,MAAOuC,EAAiBC,GAAsBC,EAAS,IAGvD,OACEpC,EAACtB,EAAe,CACdE,MAAOA,EACPQ,QAASA,EACTL,SAAUK,GAAWL,EACrBC,iBAPqBgD,GAAcE,IAAoBF,GAQvDrD,KAAMA,EACNiB,QAASD,EACTJ,cACAF,YAAU,EACVC,qBAAqB,EACrBE,WAAYuC,EACZtC,WAAYA,EACZE,SAAUA,EACVD,SAAUuC,YAET9C,EACA6C,GACC1B,EAAC+B,EAAS,CACR7B,KAAK,QACL8B,WAAS,EACTC,MAAOL,EACPM,SAAWC,GAAMN,EAAmBM,EAAEC,OAAOH,OAC7CI,YAAaX,MAInB"}
1
+ {"version":3,"file":"index.js","sources":["../../src/bootstrap-dialog/bootstrap-dialog.tsx","../../src/confirm-dialog/confirm-dialog.tsx"],"sourcesContent":["import Dialog from \"@mui/material/Dialog\";\nimport DialogTitle from \"@mui/material/DialogTitle\";\nimport DialogActions from \"@mui/material/DialogActions\";\nimport IconButton from \"@mui/material/IconButton\";\nimport DialogContent from \"@mui/material/DialogContent\";\nimport CircularProgress from \"@mui/material/CircularProgress\";\nimport Box from \"@mui/material/Box\";\nimport Button from \"@mui/material/Button\";\nimport LoadingButton from \"@mui/lab/LoadingButton\";\nimport CloseIcon from \"@mui/icons-material/Close\";\nimport { BootstrapDialogDialogProps } from \"../dialog/dialog.types\";\n\nexport const BootstrapDialog = ({\n open,\n title,\n component,\n componentProps = {},\n disabled,\n disableAccept,\n disableCancel,\n actions = [],\n children,\n loading,\n cancelable,\n callCloseWhenCancel = true,\n acceptable,\n acceptText = \"Accept\",\n cancelText = \"Cancel\",\n onAccept,\n onCancel = () => null,\n onClose,\n acceptType = \"button\",\n}: BootstrapDialogDialogProps) => {\n const hasActions = actions.length > 0 || acceptable || cancelable;\n\n return (\n <Dialog open={open} onClose={onClose}>\n <DialogTitle sx={{ display: \"flex\", alignItems: \"center\" }}>\n {title}\n {loading && !acceptable && (\n <CircularProgress size={20} sx={{ ml: 2, color: (theme) => theme.palette.grey[500] }} />\n )}\n <IconButton\n disabled={disabled}\n aria-label=\"close\"\n onClick={onClose}\n sx={{\n position: \"absolute\",\n right: 8,\n top: 8,\n color: (theme) => theme.palette.grey[500],\n }}\n >\n <CloseIcon />\n </IconButton>\n </DialogTitle>\n <Box component={component} {...componentProps}>\n <DialogContent dividers>{children}</DialogContent>\n {hasActions && (\n <DialogActions>\n {actions.map(({ id, text, type = \"button\", onClick, color = \"primary\" }) => (\n <Button key={id} type={type} disabled={disabled} onClick={onClick} color={color}>\n {text}\n </Button>\n ))}\n {cancelable && (\n <Button\n color=\"error\"\n disabled={disabled || disableCancel}\n onClick={() => {\n onCancel();\n if (callCloseWhenCancel) {\n onClose();\n }\n }}\n >\n {cancelText}\n </Button>\n )}\n\n {acceptable && (\n <LoadingButton\n type={acceptType}\n loading={loading}\n disabled={disabled || disableAccept}\n onClick={onAccept}\n >\n {acceptText}\n </LoadingButton>\n )}\n </DialogActions>\n )}\n </Box>\n </Dialog>\n );\n};\n","import { useState } from \"react\";\nimport { BootstrapDialog } from \"../bootstrap-dialog\";\nimport { BootstrapDialogDialogProps } from \"../dialog/dialog.types\";\nimport TextField from \"@mui/material/TextField\";\n\ntype OmitBaseDialogProps =\n | \"cancelable\"\n | \"acceptable\"\n | \"onAccept\"\n | \"onCancel\"\n | \"onClose\"\n | \"actions\"\n | \"callCloseWhenCancel\"\n | \"component\"\n | \"acceptType\";\nexport interface ConfirmDialogProps extends Omit<BootstrapDialogDialogProps, OmitBaseDialogProps> {\n confirmText?: string;\n canceText?: string;\n passphrase?: string;\n onCancel: () => void;\n onConfirm: () => void;\n}\n\nexport const ConfirmDialog = ({\n open,\n title,\n loading,\n disabled,\n confirmText = \"Confirm\",\n cancelText = \"Cancel\",\n passphrase,\n children,\n onConfirm,\n onCancel,\n}: ConfirmDialogProps) => {\n const [inputPassphrase, setInputPassphrase] = useState(\"\");\n const validPassphrase = !passphrase || inputPassphrase === passphrase;\n\n return (\n <BootstrapDialog\n title={title}\n loading={loading}\n disabled={loading || disabled}\n disableAccept={!validPassphrase}\n open={open}\n onClose={onCancel}\n acceptable\n cancelable\n callCloseWhenCancel={false}\n acceptText={confirmText}\n cancelText={cancelText}\n onCancel={onCancel}\n onAccept={onConfirm}\n >\n {children}\n {passphrase && (\n <TextField\n size=\"small\"\n fullWidth\n value={inputPassphrase}\n onChange={(e) => setInputPassphrase(e.target.value)}\n placeholder={passphrase}\n />\n )}\n </BootstrapDialog>\n );\n};\n"],"names":["BootstrapDialog","open","title","component","componentProps","disabled","disableAccept","disableCancel","actions","children","loading","cancelable","callCloseWhenCancel","acceptable","acceptText","cancelText","onAccept","onCancel","onClose","acceptType","hasActions","length","_jsxs","Dialog","DialogTitle","sx","display","alignItems","_jsx","CircularProgress","size","ml","color","theme","palette","grey","IconButton","onClick","position","right","top","CloseIcon","Box","DialogContent","dividers","DialogActions","map","id","text","type","Button","LoadingButton","ConfirmDialog","confirmText","passphrase","onConfirm","inputPassphrase","setInputPassphrase","useState","TextField","fullWidth","value","onChange","e","target","placeholder"],"mappings":"ugBAYO,MAAMA,EAAkB,EAC7BC,OACAC,QACAC,YACAC,iBAAiB,CAAA,EACjBC,WACAC,gBACAC,gBACAC,UAAU,GACVC,WACAC,UACAC,aACAC,uBAAsB,EACtBC,aACAC,aAAa,SACbC,aAAa,SACbC,WACAC,WAAW,KAAM,MACjBC,UACAC,aAAa,aAEb,MAAMC,EAAaZ,EAAQa,OAAS,GAAKR,GAAcF,EAEvD,OACEW,EAACC,EAAO,CAAAtB,KAAMA,EAAMiB,QAASA,EAC3BT,SAAA,CAAAa,EAACE,EAAY,CAAAC,GAAI,CAAEC,QAAS,OAAQC,WAAY,UAAUlB,SAAA,CACvDP,EACAQ,IAAYG,GACXe,EAACC,EAAgB,CAACC,KAAM,GAAIL,GAAI,CAAEM,GAAI,EAAGC,MAAQC,GAAUA,EAAMC,QAAQC,KAAK,QAEhFP,EAACQ,GACC/B,SAAUA,EAAQ,aACP,QACXgC,QAASnB,EACTO,GAAI,CACFa,SAAU,WACVC,MAAO,EACPC,IAAK,EACLR,MAAQC,GAAUA,EAAMC,QAAQC,KAAK,MAGvC1B,SAAAmB,EAACa,EAAY,CAAA,QAGjBnB,EAACoB,EAAI,CAAAvC,UAAWA,KAAeC,EAC7BK,SAAA,CAAAmB,EAACe,EAAc,CAAAC,UAAU,EAAAnC,SAAAA,IACxBW,GACCE,EAACuB,EAAa,CAAApC,SAAA,CACXD,EAAQsC,KAAI,EAAGC,KAAIC,OAAMC,OAAO,SAAUZ,UAASL,QAAQ,aAC1DJ,EAACsB,GAAgBD,KAAMA,EAAM5C,SAAUA,EAAUgC,QAASA,EAASL,MAAOA,EAAKvB,SAC5EuC,GADUD,KAIdpC,GACCiB,EAACsB,EAAM,CACLlB,MAAM,QACN3B,SAAUA,GAAYE,EACtB8B,QAAS,KACPpB,IACIL,GACFM,cAIHH,IAIJF,GACCe,EAACuB,GACCF,KAAM9B,EACNT,QAASA,EACTL,SAAUA,GAAYC,EACtB+B,QAASrB,EAERP,SAAAK,YAMJ,ECtEAsC,EAAgB,EAC3BnD,OACAC,QACAQ,UACAL,WACAgD,cAAc,UACdtC,aAAa,SACbuC,aACA7C,WACA8C,YACAtC,eAEA,MAAOuC,EAAiBC,GAAsBC,EAAS,IAGvD,OACEpC,EAACtB,EAAe,CACdE,MAAOA,EACPQ,QAASA,EACTL,SAAUK,GAAWL,EACrBC,iBAPqBgD,GAAcE,IAAoBF,GAQvDrD,KAAMA,EACNiB,QAASD,EACTJ,cACAF,YAAU,EACVC,qBAAqB,EACrBE,WAAYuC,EACZtC,WAAYA,EACZE,SAAUA,EACVD,SAAUuC,YAET9C,EACA6C,GACC1B,EAAC+B,EAAS,CACR7B,KAAK,QACL8B,WAAS,EACTC,MAAOL,EACPM,SAAWC,GAAMN,EAAmBM,EAAEC,OAAOH,OAC7CI,YAAaX,MAGD"}
@@ -5,9 +5,9 @@
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "dependencies": {
8
- "@mui/icons-material": "^5.11.16",
9
- "@mui/lab": "^5.0.0-alpha.134",
10
- "@mui/material": "^5.13.6",
11
- "react": "^18.2.0"
8
+ "@mui/icons-material": "^6.4.5",
9
+ "@mui/lab": "^6.0.0-beta.28",
10
+ "@mui/material": "^6.4.5",
11
+ "react": "^19.0.0"
12
12
  }
13
13
  }
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=r(require("@mui/material/Container"));exports.Content=({children:r})=>e.jsx(t.default,{component:"main",sx:{py:3,flexGrow:1},children:r});
1
+ "use strict";var e=require("react/jsx-runtime"),r=require("@mui/material/Container");exports.Content=({children:i})=>e.jsx(r,{component:"main",sx:{py:3,flexGrow:1},children:i});
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/content/content.tsx"],"sourcesContent":["import Container from \"@mui/material/Container\";\nimport { ContentProps } from \"./content.types\";\n\nexport const Content = ({ children }: ContentProps) => {\n return (\n <Container component=\"main\" sx={{ py: 3, flexGrow: 1 }}>\n {children}\n </Container>\n );\n};\n"],"names":["children","_jsx","Container","component","sx","py","flexGrow"],"mappings":"2OAGuB,EAAGA,cAEtBC,MAACC,EAAS,QAAA,CAACC,UAAU,OAAOC,GAAI,CAAEC,GAAI,EAAGC,SAAU,GAChDN,SAAAA"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/content/content.tsx"],"sourcesContent":["import Container from \"@mui/material/Container\";\nimport { ContentProps } from \"./content.types\";\n\nexport const Content = ({ children }: ContentProps) => {\n return (\n <Container component=\"main\" sx={{ py: 3, flexGrow: 1 }}>\n {children}\n </Container>\n );\n};\n"],"names":["children","_jsx","Container","component","sx","py","flexGrow"],"mappings":"qGAGuB,EAAGA,cAEtBC,MAACC,EAAS,CAACC,UAAU,OAAOC,GAAI,CAAEC,GAAI,EAAGC,SAAU,GAChDN,SAAAA"}
@@ -5,7 +5,7 @@
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "dependencies": {
8
- "@mui/material": "^5.13.6",
9
- "react": "^18.2.0"
8
+ "@mui/material": "^6.4.5",
9
+ "react": "^19.0.0"
10
10
  }
11
11
  }
@@ -1,2 +1,2 @@
1
1
  import { ContentProps } from "./content.types";
2
- export declare const Content: ({ children }: ContentProps) => JSX.Element;
2
+ export declare const Content: ({ children }: ContentProps) => import("react/jsx-runtime").JSX.Element;
@@ -5,7 +5,7 @@
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "dependencies": {
8
- "@mui/material": "^5.13.6",
9
- "react": "^18.2.0"
8
+ "@mui/material": "^6.4.5",
9
+ "react": "^19.0.0"
10
10
  }
11
11
  }
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@mui/material/Container"),i=require("@mui/material/Grid");require("@mui/material");var a=require("@mui/material/Box"),r=require("@mui/material/Skeleton");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=n(t),u=n(i),s=n(a),d=n(r);const o=(e,t)=>new Array(e).fill(t),c=({width:t="100%",animation:i=!1})=>e.jsxs(s.default,{width:t,children:[e.jsx(d.default,{animation:i,variant:"rectangular",height:118}),e.jsx(d.default,{animation:i,variant:"rectangular",height:16,sx:{my:1}}),e.jsx(d.default,{animation:i,variant:"rectangular",width:"80%",height:16})]}),m=({size:t=20})=>e.jsx(u.default,{container:!0,spacing:2,children:o(t,0).map(((t,i)=>e.jsx(u.default,{item:!0,xs:4,children:e.jsx(c,{width:1})},i)))});exports.ContentPlaceholder=({size:t=20,children:i,p:a})=>e.jsxs(l.default,{component:"main",sx:{p:a},"data-testid":"content-placeholder-test",children:[i,e.jsx(m,{size:t})]});
1
+ "use strict";var i=require("react/jsx-runtime"),e=require("@mui/material/Container"),r=require("@mui/material/Grid");require("@mui/material");var a=require("@mui/material/Box"),t=require("@mui/material/Skeleton");const n=(i,e)=>new Array(i).fill(e),s=({width:e="100%",animation:r=!1})=>i.jsxs(a,{width:e,children:[i.jsx(t,{animation:r,variant:"rectangular",height:118}),i.jsx(t,{animation:r,variant:"rectangular",height:16,sx:{my:1}}),i.jsx(t,{animation:r,variant:"rectangular",width:"80%",height:16})]}),l=({size:e=20})=>i.jsx(r,{container:!0,spacing:2,children:n(e,0).map(((e,a)=>i.jsx(r,{item:!0,xs:4,children:i.jsx(s,{width:1})},a)))});exports.ContentPlaceholder=({size:r=20,children:a,p:t})=>i.jsxs(e,{component:"main",sx:{p:t},"data-testid":"content-placeholder-test",children:[a,i.jsx(l,{size:r})]});
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/utils/arrays.ts","../../../src/skeleton-card/skeleton-card.tsx","../../../src/skeleton-grid/skeleton-grid.tsx","../../../src/content-placeholder/content-placeholder.tsx"],"sourcesContent":["export const newArrayWithSize = <T>(size: number, fillValue: T) => new Array(size).fill(fillValue);\n\nexport const getRandomItem = <T>(items: T[]): { index: number; item: T } => {\n const index = Math.floor(Math.random() * items.length);\n const item = items[index];\n return { index, item };\n};\n","import Box from \"@mui/material/Box\";\nimport Skeleton from \"@mui/material/Skeleton\";\n\nexport interface SkeletonCardProps {\n width?: number | string;\n animation?: \"pulse\" | \"wave\" | false;\n}\n\nexport const SkeletonCard = ({ width = \"100%\", animation = false }: SkeletonCardProps) => {\n return (\n <Box width={width}>\n <Skeleton animation={animation} variant=\"rectangular\" height={118} />\n <Skeleton animation={animation} variant=\"rectangular\" height={16} sx={{ my: 1 }} />\n <Skeleton animation={animation} variant=\"rectangular\" width=\"80%\" height={16} />\n </Box>\n );\n};\n","import Grid from \"@mui/material/Grid\";\nimport { newArrayWithSize } from \"../utils\";\nimport { SkeletonCard } from \"../skeleton-card\";\n\nexport interface SkeletonGridProps {\n size?: number;\n}\n\nexport const SkeletonGrid = ({ size = 20 }: SkeletonGridProps) => {\n return (\n <Grid container spacing={2}>\n {newArrayWithSize(size, 0).map((_, i) => (\n <Grid item key={i} xs={4}>\n <SkeletonCard width={1} />\n </Grid>\n ))}\n </Grid>\n );\n};\n","import Container from \"@mui/material/Container\";\nimport { PropsWithChildren } from \"react\";\nimport { SkeletonGrid } from \"../skeleton-grid\";\n\nexport type ContentPlaceholderProps = PropsWithChildren<{\n size?: number;\n p?: number;\n}>;\n\nexport const ContentPlaceholder = ({ size = 20, children, p }: ContentPlaceholderProps) => {\n return (\n <Container component=\"main\" sx={{ p }} data-testid=\"content-placeholder-test\">\n {children}\n <SkeletonGrid size={size} />\n </Container>\n );\n};\n"],"names":["newArrayWithSize","size","fillValue","Array","fill","SkeletonCard","width","animation","_jsxs","jsxs","Box","children","_jsx","Skeleton","variant","height","sx","my","jsx","SkeletonGrid","Grid","container","spacing","map","_","i","item","xs","p","Container","component"],"mappings":"oXAAO,MAAMA,EAAmB,CAAIC,EAAcC,IAAiB,IAAIC,MAAMF,GAAMG,KAAKF,GCQ3EG,EAAe,EAAGC,QAAQ,OAAQC,aAAY,KAEvDC,EAAAC,KAACC,UAAG,CAACJ,MAAOA,EACVK,SAAA,CAAAC,EAAAA,IAACC,EAAQ,QAAA,CAACN,UAAWA,EAAWO,QAAQ,cAAcC,OAAQ,MAC9DH,EAAAA,IAACC,EAAQ,QAAA,CAACN,UAAWA,EAAWO,QAAQ,cAAcC,OAAQ,GAAIC,GAAI,CAAEC,GAAI,KAC5EL,EAAAM,IAACL,UAAS,CAAAN,UAAWA,EAAWO,QAAQ,cAAcR,MAAM,MAAMS,OAAQ,QCLnEI,EAAe,EAAGlB,OAAO,MAElCW,EAAAA,IAACQ,EAAAA,QAAI,CAACC,WAAU,EAAAC,QAAS,EACtBX,SAAAX,EAAiBC,EAAM,GAAGsB,KAAI,CAACC,EAAGC,IACjCb,EAAAA,IAACQ,EAAAA,QAAK,CAAAM,QAAaC,GAAI,EAAChB,SACtBC,MAACP,GAAaC,MAAO,KADPmB,kCCHU,EAAGxB,OAAO,GAAIU,WAAUiB,OAEtDpB,EAACC,KAAAoB,EAAS,QAAC,CAAAC,UAAU,OAAOd,GAAI,CAAEY,KAAiB,cAAA,2BAChDjB,SAAA,CAAAA,EACDC,EAAAA,IAACO,EAAY,CAAClB,KAAMA"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/utils/arrays.ts","../../../src/skeleton-card/skeleton-card.tsx","../../../src/skeleton-grid/skeleton-grid.tsx","../../../src/content-placeholder/content-placeholder.tsx"],"sourcesContent":["export const newArrayWithSize = <T>(size: number, fillValue: T) => new Array(size).fill(fillValue);\n\nexport const getRandomItem = <T>(items: T[]): { index: number; item: T } => {\n const index = Math.floor(Math.random() * items.length);\n const item = items[index];\n return { index, item };\n};\n","import Box from \"@mui/material/Box\";\nimport Skeleton from \"@mui/material/Skeleton\";\n\nexport interface SkeletonCardProps {\n width?: number | string;\n animation?: \"pulse\" | \"wave\" | false;\n}\n\nexport const SkeletonCard = ({ width = \"100%\", animation = false }: SkeletonCardProps) => {\n return (\n <Box width={width}>\n <Skeleton animation={animation} variant=\"rectangular\" height={118} />\n <Skeleton animation={animation} variant=\"rectangular\" height={16} sx={{ my: 1 }} />\n <Skeleton animation={animation} variant=\"rectangular\" width=\"80%\" height={16} />\n </Box>\n );\n};\n","import Grid from \"@mui/material/Grid\";\nimport { newArrayWithSize } from \"../utils\";\nimport { SkeletonCard } from \"../skeleton-card\";\n\nexport interface SkeletonGridProps {\n size?: number;\n}\n\nexport const SkeletonGrid = ({ size = 20 }: SkeletonGridProps) => {\n return (\n <Grid container spacing={2}>\n {newArrayWithSize(size, 0).map((_, i) => (\n <Grid item key={i} xs={4}>\n <SkeletonCard width={1} />\n </Grid>\n ))}\n </Grid>\n );\n};\n","import Container from \"@mui/material/Container\";\nimport { PropsWithChildren } from \"react\";\nimport { SkeletonGrid } from \"../skeleton-grid\";\n\nexport type ContentPlaceholderProps = PropsWithChildren<{\n size?: number;\n p?: number;\n}>;\n\nexport const ContentPlaceholder = ({ size = 20, children, p }: ContentPlaceholderProps) => {\n return (\n <Container component=\"main\" sx={{ p }} data-testid=\"content-placeholder-test\">\n {children}\n <SkeletonGrid size={size} />\n </Container>\n );\n};\n"],"names":["newArrayWithSize","size","fillValue","Array","fill","SkeletonCard","width","animation","_jsxs","jsxs","Box","children","_jsx","Skeleton","variant","height","sx","my","SkeletonGrid","Grid","container","spacing","map","_","i","item","xs","jsx","p","Container","component"],"mappings":"qNAAO,MAAMA,EAAmB,CAAIC,EAAcC,IAAiB,IAAIC,MAAMF,GAAMG,KAAKF,GCQ3EG,EAAe,EAAGC,QAAQ,OAAQC,aAAY,KAEvDC,EAAAC,KAACC,EAAG,CAACJ,MAAOA,EACVK,SAAA,CAAAC,MAACC,EAAQ,CAACN,UAAWA,EAAWO,QAAQ,cAAcC,OAAQ,MAC9DH,MAACC,EAAQ,CAACN,UAAWA,EAAWO,QAAQ,cAAcC,OAAQ,GAAIC,GAAI,CAAEC,GAAI,KAC5EL,EAAAA,IAACC,EAAS,CAAAN,UAAWA,EAAWO,QAAQ,cAAcR,MAAM,MAAMS,OAAQ,QCLnEG,EAAe,EAAGjB,OAAO,MAElCW,EAAAA,IAACO,EAAI,CAACC,WAAU,EAAAC,QAAS,EACtBV,SAAAX,EAAiBC,EAAM,GAAGqB,KAAI,CAACC,EAAGC,IACjCZ,EAAAA,IAACO,EAAK,CAAAM,QAAaC,GAAI,EAACf,SACtBC,EAACe,IAAAtB,GAAaC,MAAO,KADPkB,kCCHU,EAAGvB,OAAO,GAAIU,WAAUiB,OAEtDpB,EAACC,KAAAoB,EAAU,CAAAC,UAAU,OAAOd,GAAI,CAAEY,KAAiB,cAAA,2BAChDjB,SAAA,CAAAA,EACDC,MAACM,EAAY,CAACjB,KAAMA"}
@@ -5,7 +5,7 @@
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "dependencies": {
8
- "@mui/material": "^5.13.6",
9
- "react": "^18.2.0"
8
+ "@mui/material": "^6.4.5",
9
+ "react": "^19.0.0"
10
10
  }
11
11
  }
@@ -3,4 +3,4 @@ export type ContentPlaceholderProps = PropsWithChildren<{
3
3
  size?: number;
4
4
  p?: number;
5
5
  }>;
6
- export declare const ContentPlaceholder: ({ size, children, p }: ContentPlaceholderProps) => JSX.Element;
6
+ export declare const ContentPlaceholder: ({ size, children, p }: ContentPlaceholderProps) => import("react/jsx-runtime").JSX.Element;
@@ -5,7 +5,7 @@
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "dependencies": {
8
- "@mui/material": "^5.13.6",
9
- "react": "^18.2.0"
8
+ "@mui/material": "^6.4.5",
9
+ "react": "^19.0.0"
10
10
  }
11
11
  }
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("@mui/material/Box"),r=require("@mui/material/styles"),t=require("@mui/x-date-pickers"),s=require("date-fns"),i=require("date-fns/esm"),d=require("react");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=o(a);const n=r.styled(u.default,{shouldForwardProp:e=>"dayIsBetween"!==e&&"isFirstDay"!==e&&"isLastDay"!==e&&"isStartOfWeek"!==e&&"isEndOfWeek"!==e})((({theme:e,dayIsBetween:a,isFirstDay:r,isLastDay:t})=>({...(r||t||a)&&{borderRadius:0,backgroundColor:`${e.palette.primary.light}40`,margin:0},...r&&{borderTopLeftRadius:"50%",borderBottomLeftRadius:"50%"},...t&&{borderTopRightRadius:"50%",borderBottomRightRadius:"50%"}}))),l=a=>{const{day:r,dateRange:d,...o}=a;if(null==d)return e.jsx(t.PickersDay,{day:r,...o});const[u,l]=d,y=!!l&&s.isAfter(r,u)&&i.isBefore(r,l),c=s.isSameDay(r,u),f=!!l&&s.isSameDay(r,l),m=s.isSameDay(r,s.startOfWeek(r)),D=s.isSameDay(r,s.endOfWeek(r));return e.jsx(n,{dayIsBetween:y,isFirstDay:c||y&&m,isLastDay:f||y&&D,"aria-label":s.format(r,"yyyy-MM-dd"),"aria-selected":y||c||f,role:"gridcell",children:e.jsx(t.PickersDay,{...o,day:r,selected:c||f})})};exports.DateRangeCalendar=({defaultValue:a,onValueChange:r})=>{const[s,i]=d.useState(a),[o,u]=d.useState(0),n=(e,a,t)=>{i(e),r(e,a),u(t)};return e.jsx(t.DateCalendar,{value:null,onChange:e=>{if(e)return 1===o&&e<s[0]||0===o&&s[1]&&e>s[1]?n([e,void 0],0,1):void n([0===o?e:s[0],1===o?e:s[1]],o,0===o?1:0)},slots:{day:l},slotProps:{day:{dateRange:s}},"aria-label":"calendar range picker"})};
1
+ "use strict";var e=require("react/jsx-runtime"),a=require("@mui/material/Box"),r=require("@mui/material/styles"),t=require("@mui/x-date-pickers"),s=require("date-fns"),i=require("react");const d=r.styled(a,{shouldForwardProp:e=>"dayIsBetween"!==e&&"isFirstDay"!==e&&"isLastDay"!==e&&"isStartOfWeek"!==e&&"isEndOfWeek"!==e})((({theme:e,dayIsBetween:a,isFirstDay:r,isLastDay:t})=>({...(r||t||a)&&{borderRadius:0,backgroundColor:`${e.palette.primary.light}40`,margin:0},...r&&{borderTopLeftRadius:"50%",borderBottomLeftRadius:"50%"},...t&&{borderTopRightRadius:"50%",borderBottomRightRadius:"50%"}}))),o=a=>{const{day:r,dateRange:i,...o}=a;if(null==i)return e.jsx(t.PickersDay,{day:r,...o});const[l,n]=i,u=!!n&&s.isAfter(r,l)&&s.isBefore(r,n),y=s.isSameDay(r,l),c=!!n&&s.isSameDay(r,n),m=s.isSameDay(r,s.startOfWeek(r)),D=s.isSameDay(r,s.endOfWeek(r));return e.jsx(d,{dayIsBetween:u,isFirstDay:y||u&&m,isLastDay:c||u&&D,"aria-label":s.format(r,"yyyy-MM-dd"),"aria-selected":u||y||c,role:"gridcell",children:e.jsx(t.PickersDay,{...o,day:r,selected:y||c})})};exports.DateRangeCalendar=({defaultValue:a,onValueChange:r})=>{const[s,d]=i.useState(a),[l,n]=i.useState(0),u=(e,a,t)=>{d(e),r(e,a),n(t)};return e.jsx(t.DateCalendar,{value:null,onChange:e=>{if(e)return 1===l&&e<s[0]||0===l&&s[1]&&e>s[1]?u([e,void 0],0,1):void u([0===l?e:s[0],1===l?e:s[1]],l,0===l?1:0)},slots:{day:o},slotProps:{day:{dateRange:s}},"aria-label":"calendar range picker"})};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/date-range-calendar/date-range-calendar.tsx"],"sourcesContent":["import Box, { BoxProps } from \"@mui/material/Box\";\nimport { styled } from \"@mui/material/styles\";\nimport { DateCalendar, PickersDay, PickersDayProps } from \"@mui/x-date-pickers\";\nimport { endOfWeek, format, isAfter, isSameDay, startOfWeek } from \"date-fns\";\nimport { isBefore } from \"date-fns/esm\";\nimport { useState } from \"react\";\n\ntype DateRange = [Date, Date | undefined];\n\ninterface CustomPickerDayProps extends BoxProps {\n dayIsBetween: boolean;\n isFirstDay: boolean;\n isLastDay: boolean;\n}\n\nconst CustomPickersDayBackground = styled(Box, {\n shouldForwardProp: (prop) =>\n prop !== \"dayIsBetween\" &&\n prop !== \"isFirstDay\" &&\n prop !== \"isLastDay\" &&\n prop !== \"isStartOfWeek\" &&\n prop !== \"isEndOfWeek\",\n})<CustomPickerDayProps>(({ theme, dayIsBetween, isFirstDay, isLastDay }) => {\n return {\n ...((isFirstDay || isLastDay || dayIsBetween) && {\n borderRadius: 0,\n backgroundColor: `${theme.palette.primary.light}40`,\n margin: 0,\n }),\n ...(isFirstDay && {\n borderTopLeftRadius: \"50%\",\n borderBottomLeftRadius: \"50%\",\n }),\n ...(isLastDay && {\n borderTopRightRadius: \"50%\",\n borderBottomRightRadius: \"50%\",\n }),\n };\n}) as React.ComponentType<CustomPickerDayProps>;\n\nconst Day = (props: PickersDayProps<Date> & { dateRange?: DateRange | null }) => {\n const { day, dateRange, ...other } = props;\n\n if (dateRange == null) {\n return <PickersDay day={day} {...other} />;\n }\n\n const [start, end] = dateRange;\n\n const dayIsBetween = !!end && isAfter(day, start) && isBefore(day, end);\n const isFirstDay = isSameDay(day, start);\n const isLastDay = !!end && isSameDay(day, end);\n const isStartOfWeek = isSameDay(day, startOfWeek(day));\n const isEndOfWeek = isSameDay(day, endOfWeek(day));\n\n return (\n <CustomPickersDayBackground\n dayIsBetween={dayIsBetween}\n isFirstDay={isFirstDay || (dayIsBetween && isStartOfWeek)}\n isLastDay={isLastDay || (dayIsBetween && isEndOfWeek)}\n aria-label={format(day, \"yyyy-MM-dd\")}\n aria-selected={dayIsBetween || isFirstDay || isLastDay}\n role=\"gridcell\"\n >\n <PickersDay {...other} day={day} selected={isFirstDay || isLastDay} />\n </CustomPickersDayBackground>\n );\n};\n\nexport interface DateRangeCalendarProps {\n defaultValue: DateRange;\n onValueChange: (value: DateRange, updatedIndex: number) => void;\n}\nexport const DateRangeCalendar = ({ defaultValue, onValueChange }: DateRangeCalendarProps) => {\n const [value, setValue] = useState(defaultValue);\n const [index, setIndex] = useState(0);\n\n const setValueRange = (newRange: DateRange, index: number, newIndex: number) => {\n setValue(newRange);\n onValueChange(newRange, index);\n setIndex(newIndex);\n };\n\n const handleChange = (newValue: Date | null) => {\n if (!newValue) {\n return;\n }\n\n // If is the end date and is minor than the start date\n if (index === 1 && newValue < value[0]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // If is the start date and is bigger than the end date\n if (index === 0 && value[1] && newValue > value[1]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // Default case\n setValueRange(\n [index === 0 ? newValue : value[0], index === 1 ? newValue : value[1]],\n index,\n index === 0 ? 1 : 0,\n );\n };\n return (\n <DateCalendar\n value={null}\n onChange={handleChange}\n slots={{ day: Day }}\n slotProps={{\n day: {\n dateRange: value,\n } as any,\n }}\n aria-label=\"calendar range picker\"\n />\n );\n};\n"],"names":["CustomPickersDayBackground","styled","Box","shouldForwardProp","prop","theme","dayIsBetween","isFirstDay","isLastDay","borderRadius","backgroundColor","palette","primary","light","margin","borderTopLeftRadius","borderBottomLeftRadius","borderTopRightRadius","borderBottomRightRadius","Day","props","day","dateRange","other","_jsx","PickersDay","start","end","isAfter","isBefore","isSameDay","isStartOfWeek","startOfWeek","isEndOfWeek","endOfWeek","format","role","children","selected","defaultValue","onValueChange","value","setValue","useState","index","setIndex","setValueRange","newRange","newIndex","DateCalendar","onChange","newValue","undefined","slots","slotProps"],"mappings":"+VAeA,MAAMA,EAA6BC,EAAMA,OAACC,UAAK,CAC7CC,kBAAoBC,GACT,iBAATA,GACS,eAATA,GACS,cAATA,GACS,kBAATA,GACS,gBAATA,GAN+BH,EAOV,EAAGI,QAAOC,eAAcC,aAAYC,gBACpD,KACAD,GAAcC,GAAaF,IAAiB,CAC/CG,aAAc,EACdC,gBAAiB,GAAGL,EAAMM,QAAQC,QAAQC,UAC1CC,OAAQ,MAENP,GAAc,CAChBQ,oBAAqB,MACrBC,uBAAwB,UAEtBR,GAAa,CACfS,qBAAsB,MACtBC,wBAAyB,WAKzBC,EAAOC,IACX,MAAMC,IAAEA,EAAGC,UAAEA,KAAcC,GAAUH,EAErC,GAAiB,MAAbE,EACF,OAAOE,EAAAA,IAACC,EAAAA,WAAW,CAAAJ,IAAKA,KAASE,IAGnC,MAAOG,EAAOC,GAAOL,EAEfhB,IAAiBqB,GAAOC,UAAQP,EAAKK,IAAUG,EAAQA,SAACR,EAAKM,GAC7DpB,EAAauB,EAAAA,UAAUT,EAAKK,GAC5BlB,IAAcmB,GAAOG,EAAAA,UAAUT,EAAKM,GACpCI,EAAgBD,EAAAA,UAAUT,EAAKW,EAAAA,YAAYX,IAC3CY,EAAcH,EAAAA,UAAUT,EAAKa,EAAAA,UAAUb,IAE7C,OACEG,EAAAA,IAACxB,EAA0B,CACzBM,aAAcA,EACdC,WAAYA,GAAeD,GAAgByB,EAC3CvB,UAAWA,GAAcF,GAAgB2B,EAAY,aACzCE,EAAAA,OAAOd,EAAK,cAAa,gBACtBf,GAAgBC,GAAcC,EAC7C4B,KAAK,WAAUC,SAEfb,EAAAA,IAACC,EAAUA,WAAK,IAAAF,EAAOF,IAAKA,EAAKiB,SAAU/B,GAAcC,KAE3D,4BAO6B,EAAG+B,eAAcC,oBAChD,MAAOC,EAAOC,GAAYC,EAAQA,SAACJ,IAC5BK,EAAOC,GAAYF,EAAQA,SAAC,GAE7BG,EAAgB,CAACC,EAAqBH,EAAeI,KACzDN,EAASK,GACTP,EAAcO,EAAUH,GACxBC,EAASG,EAAS,EAyBpB,OACExB,MAACyB,EAAAA,aAAY,CACXR,MAAO,KACPS,SAzBkBC,IACpB,GAAKA,EAKL,OAAc,IAAVP,GAAeO,EAAWV,EAAM,IAKtB,IAAVG,GAAeH,EAAM,IAAMU,EAAWV,EAAM,GAJvCK,EAAc,CAACK,OAAUC,GAAY,EAAG,QASjDN,EACE,CAAW,IAAVF,EAAcO,EAAWV,EAAM,GAAc,IAAVG,EAAcO,EAAWV,EAAM,IACnEG,EACU,IAAVA,EAAc,EAAI,EACnB,EAMCS,MAAO,CAAEhC,IAAKF,GACdmC,UAAW,CACTjC,IAAK,CACHC,UAAWmB,IAGJ,aAAA,yBAEb"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/date-range-calendar/date-range-calendar.tsx"],"sourcesContent":["import Box, { BoxProps } from \"@mui/material/Box\";\nimport { styled } from \"@mui/material/styles\";\nimport { DateCalendar, PickersDay, PickersDayProps } from \"@mui/x-date-pickers\";\nimport { endOfWeek, format, isAfter, isBefore, isSameDay, startOfWeek } from \"date-fns\";\nimport { useState } from \"react\";\n\ntype DateRange = [Date, Date | undefined];\n\ninterface CustomPickerDayProps extends BoxProps {\n dayIsBetween: boolean;\n isFirstDay: boolean;\n isLastDay: boolean;\n}\n\nconst CustomPickersDayBackground = styled(Box, {\n shouldForwardProp: (prop) =>\n prop !== \"dayIsBetween\" &&\n prop !== \"isFirstDay\" &&\n prop !== \"isLastDay\" &&\n prop !== \"isStartOfWeek\" &&\n prop !== \"isEndOfWeek\",\n})<CustomPickerDayProps>(({ theme, dayIsBetween, isFirstDay, isLastDay }) => {\n return {\n ...((isFirstDay || isLastDay || dayIsBetween) && {\n borderRadius: 0,\n backgroundColor: `${theme.palette.primary.light}40`,\n margin: 0,\n }),\n ...(isFirstDay && {\n borderTopLeftRadius: \"50%\",\n borderBottomLeftRadius: \"50%\",\n }),\n ...(isLastDay && {\n borderTopRightRadius: \"50%\",\n borderBottomRightRadius: \"50%\",\n }),\n };\n}) as React.ComponentType<CustomPickerDayProps>;\n\nconst Day = (props: PickersDayProps<Date> & { dateRange?: DateRange | null }) => {\n const { day, dateRange, ...other } = props;\n\n if (dateRange == null) {\n return <PickersDay day={day} {...other} />;\n }\n\n const [start, end] = dateRange;\n\n const dayIsBetween = !!end && isAfter(day, start) && isBefore(day, end);\n const isFirstDay = isSameDay(day, start);\n const isLastDay = !!end && isSameDay(day, end);\n const isStartOfWeek = isSameDay(day, startOfWeek(day));\n const isEndOfWeek = isSameDay(day, endOfWeek(day));\n\n return (\n <CustomPickersDayBackground\n dayIsBetween={dayIsBetween}\n isFirstDay={isFirstDay || (dayIsBetween && isStartOfWeek)}\n isLastDay={isLastDay || (dayIsBetween && isEndOfWeek)}\n aria-label={format(day, \"yyyy-MM-dd\")}\n aria-selected={dayIsBetween || isFirstDay || isLastDay}\n role=\"gridcell\"\n >\n <PickersDay {...other} day={day} selected={isFirstDay || isLastDay} />\n </CustomPickersDayBackground>\n );\n};\n\nexport interface DateRangeCalendarProps {\n defaultValue: DateRange;\n onValueChange: (value: DateRange, updatedIndex: number) => void;\n}\nexport const DateRangeCalendar = ({ defaultValue, onValueChange }: DateRangeCalendarProps) => {\n const [value, setValue] = useState(defaultValue);\n const [index, setIndex] = useState(0);\n\n const setValueRange = (newRange: DateRange, index: number, newIndex: number) => {\n setValue(newRange);\n onValueChange(newRange, index);\n setIndex(newIndex);\n };\n\n const handleChange = (newValue: Date | null) => {\n if (!newValue) {\n return;\n }\n\n // If is the end date and is minor than the start date\n if (index === 1 && newValue < value[0]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // If is the start date and is bigger than the end date\n if (index === 0 && value[1] && newValue > value[1]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // Default case\n setValueRange(\n [index === 0 ? newValue : value[0], index === 1 ? newValue : value[1]],\n index,\n index === 0 ? 1 : 0,\n );\n };\n return (\n <DateCalendar\n value={null}\n onChange={handleChange}\n slots={{ day: Day }}\n slotProps={{\n day: {\n dateRange: value,\n } as any,\n }}\n aria-label=\"calendar range picker\"\n />\n );\n};\n"],"names":["CustomPickersDayBackground","styled","Box","shouldForwardProp","prop","theme","dayIsBetween","isFirstDay","isLastDay","borderRadius","backgroundColor","palette","primary","light","margin","borderTopLeftRadius","borderBottomLeftRadius","borderTopRightRadius","borderBottomRightRadius","Day","props","day","dateRange","other","_jsx","PickersDay","start","end","isAfter","isBefore","isSameDay","isStartOfWeek","startOfWeek","isEndOfWeek","endOfWeek","format","role","children","selected","defaultValue","onValueChange","value","setValue","useState","index","setIndex","setValueRange","newRange","newIndex","DateCalendar","onChange","newValue","undefined","slots","slotProps"],"mappings":"2LAcA,MAAMA,EAA6BC,EAAMA,OAACC,EAAK,CAC7CC,kBAAoBC,GACT,iBAATA,GACS,eAATA,GACS,cAATA,GACS,kBAATA,GACS,gBAATA,GAN+BH,EAOV,EAAGI,QAAOC,eAAcC,aAAYC,gBACpD,KACAD,GAAcC,GAAaF,IAAiB,CAC/CG,aAAc,EACdC,gBAAiB,GAAGL,EAAMM,QAAQC,QAAQC,UAC1CC,OAAQ,MAENP,GAAc,CAChBQ,oBAAqB,MACrBC,uBAAwB,UAEtBR,GAAa,CACfS,qBAAsB,MACtBC,wBAAyB,WAKzBC,EAAOC,IACX,MAAMC,IAAEA,EAAGC,UAAEA,KAAcC,GAAUH,EAErC,GAAiB,MAAbE,EACF,OAAOE,EAAAA,IAACC,EAAAA,WAAW,CAAAJ,IAAKA,KAASE,IAGnC,MAAOG,EAAOC,GAAOL,EAEfhB,IAAiBqB,GAAOC,EAAOA,QAACP,EAAKK,IAAUG,EAAAA,SAASR,EAAKM,GAC7DpB,EAAauB,EAAAA,UAAUT,EAAKK,GAC5BlB,IAAcmB,GAAOG,EAAAA,UAAUT,EAAKM,GACpCI,EAAgBD,EAASA,UAACT,EAAKW,EAAWA,YAACX,IAC3CY,EAAcH,EAASA,UAACT,EAAKa,EAASA,UAACb,IAE7C,OACEG,EAAAA,IAACxB,EAA0B,CACzBM,aAAcA,EACdC,WAAYA,GAAeD,GAAgByB,EAC3CvB,UAAWA,GAAcF,GAAgB2B,EAAY,aACzCE,EAAMA,OAACd,EAAK,cAAa,gBACtBf,GAAgBC,GAAcC,EAC7C4B,KAAK,WAAUC,SAEfb,MAACC,EAAAA,WAAe,IAAAF,EAAOF,IAAKA,EAAKiB,SAAU/B,GAAcC,KAC9B,4BAQA,EAAG+B,eAAcC,oBAChD,MAAOC,EAAOC,GAAYC,EAAAA,SAASJ,IAC5BK,EAAOC,GAAYF,EAAAA,SAAS,GAE7BG,EAAgB,CAACC,EAAqBH,EAAeI,KACzDN,EAASK,GACTP,EAAcO,EAAUH,GACxBC,EAASG,EAAS,EAyBpB,OACExB,MAACyB,EAAAA,aAAY,CACXR,MAAO,KACPS,SAzBkBC,IACpB,GAAKA,EAKL,OAAc,IAAVP,GAAeO,EAAWV,EAAM,IAKtB,IAAVG,GAAeH,EAAM,IAAMU,EAAWV,EAAM,GAJvCK,EAAc,CAACK,OAAUC,GAAY,EAAG,QASjDN,EACE,CAAW,IAAVF,EAAcO,EAAWV,EAAM,GAAc,IAAVG,EAAcO,EAAWV,EAAM,IACnEG,EACU,IAAVA,EAAc,EAAI,EACnB,EAMCS,MAAO,CAAEhC,IAAKF,GACdmC,UAAW,CACTjC,IAAK,CACHC,UAAWmB,IAGJ,aAAA,yBACX"}
@@ -5,9 +5,9 @@
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "dependencies": {
8
- "@mui/material": "^5.13.6",
9
- "@mui/x-date-pickers": "^6.9.0",
10
- "date-fns": "^2.30.0",
11
- "react": "^18.2.0"
8
+ "@mui/material": "^6.4.5",
9
+ "@mui/x-date-pickers": "^7.27.0",
10
+ "date-fns": "^4.1.0",
11
+ "react": "^19.0.0"
12
12
  }
13
13
  }
@@ -3,5 +3,5 @@ export interface DateRangeCalendarProps {
3
3
  defaultValue: DateRange;
4
4
  onValueChange: (value: DateRange, updatedIndex: number) => void;
5
5
  }
6
- export declare const DateRangeCalendar: ({ defaultValue, onValueChange }: DateRangeCalendarProps) => JSX.Element;
6
+ export declare const DateRangeCalendar: ({ defaultValue, onValueChange }: DateRangeCalendarProps) => import("react/jsx-runtime").JSX.Element;
7
7
  export {};
@@ -1,2 +1,2 @@
1
- import{jsx as e}from"react/jsx-runtime";import r from"@mui/material/Box";import{styled as a}from"@mui/material/styles";import{DateCalendar as t,PickersDay as i}from"@mui/x-date-pickers";import{isAfter as o,isSameDay as s,startOfWeek as d,endOfWeek as l,format as n}from"date-fns";import{isBefore as m}from"date-fns/esm";import{useState as u}from"react";const y=a(r,{shouldForwardProp:e=>"dayIsBetween"!==e&&"isFirstDay"!==e&&"isLastDay"!==e&&"isStartOfWeek"!==e&&"isEndOfWeek"!==e})((({theme:e,dayIsBetween:r,isFirstDay:a,isLastDay:t})=>({...(a||t||r)&&{borderRadius:0,backgroundColor:`${e.palette.primary.light}40`,margin:0},...a&&{borderTopLeftRadius:"50%",borderBottomLeftRadius:"50%"},...t&&{borderTopRightRadius:"50%",borderBottomRightRadius:"50%"}}))),f=r=>{const{day:a,dateRange:t,...u}=r;if(null==t)return e(i,{day:a,...u});const[f,p]=t,c=!!p&&o(a,f)&&m(a,p),g=s(a,f),R=!!p&&s(a,p),b=s(a,d(a)),h=s(a,l(a));return e(y,{dayIsBetween:c,isFirstDay:g||c&&b,isLastDay:R||c&&h,"aria-label":n(a,"yyyy-MM-dd"),"aria-selected":c||g||R,role:"gridcell",children:e(i,{...u,day:a,selected:g||R})})},p=({defaultValue:r,onValueChange:a})=>{const[i,o]=u(r),[s,d]=u(0),l=(e,r,t)=>{o(e),a(e,r),d(t)};return e(t,{value:null,onChange:e=>{if(e)return 1===s&&e<i[0]||0===s&&i[1]&&e>i[1]?l([e,void 0],0,1):void l([0===s?e:i[0],1===s?e:i[1]],s,0===s?1:0)},slots:{day:f},slotProps:{day:{dateRange:i}},"aria-label":"calendar range picker"})};export{p as DateRangeCalendar};
1
+ import{jsx as e}from"react/jsx-runtime";import r from"@mui/material/Box";import{styled as a}from"@mui/material/styles";import{DateCalendar as t,PickersDay as i}from"@mui/x-date-pickers";import{isAfter as o,isBefore as s,isSameDay as d,startOfWeek as l,endOfWeek as n,format as m}from"date-fns";import{useState as u}from"react";const y=a(r,{shouldForwardProp:e=>"dayIsBetween"!==e&&"isFirstDay"!==e&&"isLastDay"!==e&&"isStartOfWeek"!==e&&"isEndOfWeek"!==e})((({theme:e,dayIsBetween:r,isFirstDay:a,isLastDay:t})=>({...(a||t||r)&&{borderRadius:0,backgroundColor:`${e.palette.primary.light}40`,margin:0},...a&&{borderTopLeftRadius:"50%",borderBottomLeftRadius:"50%"},...t&&{borderTopRightRadius:"50%",borderBottomRightRadius:"50%"}}))),p=r=>{const{day:a,dateRange:t,...u}=r;if(null==t)return e(i,{day:a,...u});const[p,c]=t,f=!!c&&o(a,p)&&s(a,c),g=d(a,p),R=!!c&&d(a,c),b=d(a,l(a)),h=d(a,n(a));return e(y,{dayIsBetween:f,isFirstDay:g||f&&b,isLastDay:R||f&&h,"aria-label":m(a,"yyyy-MM-dd"),"aria-selected":f||g||R,role:"gridcell",children:e(i,{...u,day:a,selected:g||R})})},c=({defaultValue:r,onValueChange:a})=>{const[i,o]=u(r),[s,d]=u(0),l=(e,r,t)=>{o(e),a(e,r),d(t)};return e(t,{value:null,onChange:e=>{if(e)return 1===s&&e<i[0]||0===s&&i[1]&&e>i[1]?l([e,void 0],0,1):void l([0===s?e:i[0],1===s?e:i[1]],s,0===s?1:0)},slots:{day:p},slotProps:{day:{dateRange:i}},"aria-label":"calendar range picker"})};export{c as DateRangeCalendar};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/date-range-calendar/date-range-calendar.tsx"],"sourcesContent":["import Box, { BoxProps } from \"@mui/material/Box\";\nimport { styled } from \"@mui/material/styles\";\nimport { DateCalendar, PickersDay, PickersDayProps } from \"@mui/x-date-pickers\";\nimport { endOfWeek, format, isAfter, isSameDay, startOfWeek } from \"date-fns\";\nimport { isBefore } from \"date-fns/esm\";\nimport { useState } from \"react\";\n\ntype DateRange = [Date, Date | undefined];\n\ninterface CustomPickerDayProps extends BoxProps {\n dayIsBetween: boolean;\n isFirstDay: boolean;\n isLastDay: boolean;\n}\n\nconst CustomPickersDayBackground = styled(Box, {\n shouldForwardProp: (prop) =>\n prop !== \"dayIsBetween\" &&\n prop !== \"isFirstDay\" &&\n prop !== \"isLastDay\" &&\n prop !== \"isStartOfWeek\" &&\n prop !== \"isEndOfWeek\",\n})<CustomPickerDayProps>(({ theme, dayIsBetween, isFirstDay, isLastDay }) => {\n return {\n ...((isFirstDay || isLastDay || dayIsBetween) && {\n borderRadius: 0,\n backgroundColor: `${theme.palette.primary.light}40`,\n margin: 0,\n }),\n ...(isFirstDay && {\n borderTopLeftRadius: \"50%\",\n borderBottomLeftRadius: \"50%\",\n }),\n ...(isLastDay && {\n borderTopRightRadius: \"50%\",\n borderBottomRightRadius: \"50%\",\n }),\n };\n}) as React.ComponentType<CustomPickerDayProps>;\n\nconst Day = (props: PickersDayProps<Date> & { dateRange?: DateRange | null }) => {\n const { day, dateRange, ...other } = props;\n\n if (dateRange == null) {\n return <PickersDay day={day} {...other} />;\n }\n\n const [start, end] = dateRange;\n\n const dayIsBetween = !!end && isAfter(day, start) && isBefore(day, end);\n const isFirstDay = isSameDay(day, start);\n const isLastDay = !!end && isSameDay(day, end);\n const isStartOfWeek = isSameDay(day, startOfWeek(day));\n const isEndOfWeek = isSameDay(day, endOfWeek(day));\n\n return (\n <CustomPickersDayBackground\n dayIsBetween={dayIsBetween}\n isFirstDay={isFirstDay || (dayIsBetween && isStartOfWeek)}\n isLastDay={isLastDay || (dayIsBetween && isEndOfWeek)}\n aria-label={format(day, \"yyyy-MM-dd\")}\n aria-selected={dayIsBetween || isFirstDay || isLastDay}\n role=\"gridcell\"\n >\n <PickersDay {...other} day={day} selected={isFirstDay || isLastDay} />\n </CustomPickersDayBackground>\n );\n};\n\nexport interface DateRangeCalendarProps {\n defaultValue: DateRange;\n onValueChange: (value: DateRange, updatedIndex: number) => void;\n}\nexport const DateRangeCalendar = ({ defaultValue, onValueChange }: DateRangeCalendarProps) => {\n const [value, setValue] = useState(defaultValue);\n const [index, setIndex] = useState(0);\n\n const setValueRange = (newRange: DateRange, index: number, newIndex: number) => {\n setValue(newRange);\n onValueChange(newRange, index);\n setIndex(newIndex);\n };\n\n const handleChange = (newValue: Date | null) => {\n if (!newValue) {\n return;\n }\n\n // If is the end date and is minor than the start date\n if (index === 1 && newValue < value[0]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // If is the start date and is bigger than the end date\n if (index === 0 && value[1] && newValue > value[1]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // Default case\n setValueRange(\n [index === 0 ? newValue : value[0], index === 1 ? newValue : value[1]],\n index,\n index === 0 ? 1 : 0,\n );\n };\n return (\n <DateCalendar\n value={null}\n onChange={handleChange}\n slots={{ day: Day }}\n slotProps={{\n day: {\n dateRange: value,\n } as any,\n }}\n aria-label=\"calendar range picker\"\n />\n );\n};\n"],"names":["CustomPickersDayBackground","styled","Box","shouldForwardProp","prop","theme","dayIsBetween","isFirstDay","isLastDay","borderRadius","backgroundColor","palette","primary","light","margin","borderTopLeftRadius","borderBottomLeftRadius","borderTopRightRadius","borderBottomRightRadius","Day","props","day","dateRange","other","_jsx","PickersDay","start","end","isAfter","isBefore","isSameDay","isStartOfWeek","startOfWeek","isEndOfWeek","endOfWeek","format","role","children","selected","DateRangeCalendar","defaultValue","onValueChange","value","setValue","useState","index","setIndex","setValueRange","newRange","newIndex","DateCalendar","onChange","newValue","undefined","slots","slotProps"],"mappings":"iWAeA,MAAMA,EAA6BC,EAAOC,EAAK,CAC7CC,kBAAoBC,GACT,iBAATA,GACS,eAATA,GACS,cAATA,GACS,kBAATA,GACS,gBAATA,GAN+BH,EAOV,EAAGI,QAAOC,eAAcC,aAAYC,gBACpD,KACAD,GAAcC,GAAaF,IAAiB,CAC/CG,aAAc,EACdC,gBAAiB,GAAGL,EAAMM,QAAQC,QAAQC,UAC1CC,OAAQ,MAENP,GAAc,CAChBQ,oBAAqB,MACrBC,uBAAwB,UAEtBR,GAAa,CACfS,qBAAsB,MACtBC,wBAAyB,WAKzBC,EAAOC,IACX,MAAMC,IAAEA,EAAGC,UAAEA,KAAcC,GAAUH,EAErC,GAAiB,MAAbE,EACF,OAAOE,EAACC,EAAW,CAAAJ,IAAKA,KAASE,IAGnC,MAAOG,EAAOC,GAAOL,EAEfhB,IAAiBqB,GAAOC,EAAQP,EAAKK,IAAUG,EAASR,EAAKM,GAC7DpB,EAAauB,EAAUT,EAAKK,GAC5BlB,IAAcmB,GAAOG,EAAUT,EAAKM,GACpCI,EAAgBD,EAAUT,EAAKW,EAAYX,IAC3CY,EAAcH,EAAUT,EAAKa,EAAUb,IAE7C,OACEG,EAACxB,EAA0B,CACzBM,aAAcA,EACdC,WAAYA,GAAeD,GAAgByB,EAC3CvB,UAAWA,GAAcF,GAAgB2B,EAAY,aACzCE,EAAOd,EAAK,cAAa,gBACtBf,GAAgBC,GAAcC,EAC7C4B,KAAK,WAAUC,SAEfb,EAACC,EAAe,IAAAF,EAAOF,IAAKA,EAAKiB,SAAU/B,GAAcC,KAE3D,EAOS+B,EAAoB,EAAGC,eAAcC,oBAChD,MAAOC,EAAOC,GAAYC,EAASJ,IAC5BK,EAAOC,GAAYF,EAAS,GAE7BG,EAAgB,CAACC,EAAqBH,EAAeI,KACzDN,EAASK,GACTP,EAAcO,EAAUH,GACxBC,EAASG,EAAS,EAyBpB,OACEzB,EAAC0B,EAAY,CACXR,MAAO,KACPS,SAzBkBC,IACpB,GAAKA,EAKL,OAAc,IAAVP,GAAeO,EAAWV,EAAM,IAKtB,IAAVG,GAAeH,EAAM,IAAMU,EAAWV,EAAM,GAJvCK,EAAc,CAACK,OAAUC,GAAY,EAAG,QASjDN,EACE,CAAW,IAAVF,EAAcO,EAAWV,EAAM,GAAc,IAAVG,EAAcO,EAAWV,EAAM,IACnEG,EACU,IAAVA,EAAc,EAAI,EACnB,EAMCS,MAAO,CAAEjC,IAAKF,GACdoC,UAAW,CACTlC,IAAK,CACHC,UAAWoB,IAGJ,aAAA,yBAEb"}
1
+ {"version":3,"file":"index.js","sources":["../../src/date-range-calendar/date-range-calendar.tsx"],"sourcesContent":["import Box, { BoxProps } from \"@mui/material/Box\";\nimport { styled } from \"@mui/material/styles\";\nimport { DateCalendar, PickersDay, PickersDayProps } from \"@mui/x-date-pickers\";\nimport { endOfWeek, format, isAfter, isBefore, isSameDay, startOfWeek } from \"date-fns\";\nimport { useState } from \"react\";\n\ntype DateRange = [Date, Date | undefined];\n\ninterface CustomPickerDayProps extends BoxProps {\n dayIsBetween: boolean;\n isFirstDay: boolean;\n isLastDay: boolean;\n}\n\nconst CustomPickersDayBackground = styled(Box, {\n shouldForwardProp: (prop) =>\n prop !== \"dayIsBetween\" &&\n prop !== \"isFirstDay\" &&\n prop !== \"isLastDay\" &&\n prop !== \"isStartOfWeek\" &&\n prop !== \"isEndOfWeek\",\n})<CustomPickerDayProps>(({ theme, dayIsBetween, isFirstDay, isLastDay }) => {\n return {\n ...((isFirstDay || isLastDay || dayIsBetween) && {\n borderRadius: 0,\n backgroundColor: `${theme.palette.primary.light}40`,\n margin: 0,\n }),\n ...(isFirstDay && {\n borderTopLeftRadius: \"50%\",\n borderBottomLeftRadius: \"50%\",\n }),\n ...(isLastDay && {\n borderTopRightRadius: \"50%\",\n borderBottomRightRadius: \"50%\",\n }),\n };\n}) as React.ComponentType<CustomPickerDayProps>;\n\nconst Day = (props: PickersDayProps<Date> & { dateRange?: DateRange | null }) => {\n const { day, dateRange, ...other } = props;\n\n if (dateRange == null) {\n return <PickersDay day={day} {...other} />;\n }\n\n const [start, end] = dateRange;\n\n const dayIsBetween = !!end && isAfter(day, start) && isBefore(day, end);\n const isFirstDay = isSameDay(day, start);\n const isLastDay = !!end && isSameDay(day, end);\n const isStartOfWeek = isSameDay(day, startOfWeek(day));\n const isEndOfWeek = isSameDay(day, endOfWeek(day));\n\n return (\n <CustomPickersDayBackground\n dayIsBetween={dayIsBetween}\n isFirstDay={isFirstDay || (dayIsBetween && isStartOfWeek)}\n isLastDay={isLastDay || (dayIsBetween && isEndOfWeek)}\n aria-label={format(day, \"yyyy-MM-dd\")}\n aria-selected={dayIsBetween || isFirstDay || isLastDay}\n role=\"gridcell\"\n >\n <PickersDay {...other} day={day} selected={isFirstDay || isLastDay} />\n </CustomPickersDayBackground>\n );\n};\n\nexport interface DateRangeCalendarProps {\n defaultValue: DateRange;\n onValueChange: (value: DateRange, updatedIndex: number) => void;\n}\nexport const DateRangeCalendar = ({ defaultValue, onValueChange }: DateRangeCalendarProps) => {\n const [value, setValue] = useState(defaultValue);\n const [index, setIndex] = useState(0);\n\n const setValueRange = (newRange: DateRange, index: number, newIndex: number) => {\n setValue(newRange);\n onValueChange(newRange, index);\n setIndex(newIndex);\n };\n\n const handleChange = (newValue: Date | null) => {\n if (!newValue) {\n return;\n }\n\n // If is the end date and is minor than the start date\n if (index === 1 && newValue < value[0]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // If is the start date and is bigger than the end date\n if (index === 0 && value[1] && newValue > value[1]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // Default case\n setValueRange(\n [index === 0 ? newValue : value[0], index === 1 ? newValue : value[1]],\n index,\n index === 0 ? 1 : 0,\n );\n };\n return (\n <DateCalendar\n value={null}\n onChange={handleChange}\n slots={{ day: Day }}\n slotProps={{\n day: {\n dateRange: value,\n } as any,\n }}\n aria-label=\"calendar range picker\"\n />\n );\n};\n"],"names":["CustomPickersDayBackground","styled","Box","shouldForwardProp","prop","theme","dayIsBetween","isFirstDay","isLastDay","borderRadius","backgroundColor","palette","primary","light","margin","borderTopLeftRadius","borderBottomLeftRadius","borderTopRightRadius","borderBottomRightRadius","Day","props","day","dateRange","other","_jsx","PickersDay","start","end","isAfter","isBefore","isSameDay","isStartOfWeek","startOfWeek","isEndOfWeek","endOfWeek","format","role","children","selected","DateRangeCalendar","defaultValue","onValueChange","value","setValue","useState","index","setIndex","setValueRange","newRange","newIndex","DateCalendar","onChange","newValue","undefined","slots","slotProps"],"mappings":"uUAcA,MAAMA,EAA6BC,EAAOC,EAAK,CAC7CC,kBAAoBC,GACT,iBAATA,GACS,eAATA,GACS,cAATA,GACS,kBAATA,GACS,gBAATA,GAN+BH,EAOV,EAAGI,QAAOC,eAAcC,aAAYC,gBACpD,KACAD,GAAcC,GAAaF,IAAiB,CAC/CG,aAAc,EACdC,gBAAiB,GAAGL,EAAMM,QAAQC,QAAQC,UAC1CC,OAAQ,MAENP,GAAc,CAChBQ,oBAAqB,MACrBC,uBAAwB,UAEtBR,GAAa,CACfS,qBAAsB,MACtBC,wBAAyB,WAKzBC,EAAOC,IACX,MAAMC,IAAEA,EAAGC,UAAEA,KAAcC,GAAUH,EAErC,GAAiB,MAAbE,EACF,OAAOE,EAACC,EAAW,CAAAJ,IAAKA,KAASE,IAGnC,MAAOG,EAAOC,GAAOL,EAEfhB,IAAiBqB,GAAOC,EAAQP,EAAKK,IAAUG,EAASR,EAAKM,GAC7DpB,EAAauB,EAAUT,EAAKK,GAC5BlB,IAAcmB,GAAOG,EAAUT,EAAKM,GACpCI,EAAgBD,EAAUT,EAAKW,EAAYX,IAC3CY,EAAcH,EAAUT,EAAKa,EAAUb,IAE7C,OACEG,EAACxB,EAA0B,CACzBM,aAAcA,EACdC,WAAYA,GAAeD,GAAgByB,EAC3CvB,UAAWA,GAAcF,GAAgB2B,EAAY,aACzCE,EAAOd,EAAK,cAAa,gBACtBf,GAAgBC,GAAcC,EAC7C4B,KAAK,WAAUC,SAEfb,EAACC,EAAe,IAAAF,EAAOF,IAAKA,EAAKiB,SAAU/B,GAAcC,KAC9B,EAQpB+B,EAAoB,EAAGC,eAAcC,oBAChD,MAAOC,EAAOC,GAAYC,EAASJ,IAC5BK,EAAOC,GAAYF,EAAS,GAE7BG,EAAgB,CAACC,EAAqBH,EAAeI,KACzDN,EAASK,GACTP,EAAcO,EAAUH,GACxBC,EAASG,EAAS,EAyBpB,OACEzB,EAAC0B,EAAY,CACXR,MAAO,KACPS,SAzBkBC,IACpB,GAAKA,EAKL,OAAc,IAAVP,GAAeO,EAAWV,EAAM,IAKtB,IAAVG,GAAeH,EAAM,IAAMU,EAAWV,EAAM,GAJvCK,EAAc,CAACK,OAAUC,GAAY,EAAG,QASjDN,EACE,CAAW,IAAVF,EAAcO,EAAWV,EAAM,GAAc,IAAVG,EAAcO,EAAWV,EAAM,IACnEG,EACU,IAAVA,EAAc,EAAI,EACnB,EAMCS,MAAO,CAAEjC,IAAKF,GACdoC,UAAW,CACTlC,IAAK,CACHC,UAAWoB,IAGJ,aAAA,yBACX"}
@@ -5,9 +5,9 @@
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "dependencies": {
8
- "@mui/material": "^5.13.6",
9
- "@mui/x-date-pickers": "^6.9.0",
10
- "date-fns": "^2.30.0",
11
- "react": "^18.2.0"
8
+ "@mui/material": "^6.4.5",
9
+ "@mui/x-date-pickers": "^7.27.0",
10
+ "date-fns": "^4.1.0",
11
+ "react": "^19.0.0"
12
12
  }
13
13
  }
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("react"),r=require("date-fns"),t=require("@mui/material/Collapse"),i=require("@mui/material/IconButton"),s=require("@mui/material/InputAdornment"),l=require("@mui/material/TextField"),u=require("@mui/material/Paper"),d=require("@mui/icons-material/Event"),n=require("@mui/material/Box"),o=require("@mui/material/styles"),m=require("@mui/x-date-pickers"),c=require("date-fns/esm");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var y=f(t),p=f(i),x=f(s),h=f(l),g=f(u),j=f(d),b=f(n);const D=o.styled(b.default,{shouldForwardProp:e=>"dayIsBetween"!==e&&"isFirstDay"!==e&&"isLastDay"!==e&&"isStartOfWeek"!==e&&"isEndOfWeek"!==e})((({theme:e,dayIsBetween:a,isFirstDay:r,isLastDay:t})=>({...(r||t||a)&&{borderRadius:0,backgroundColor:`${e.palette.primary.light}40`,margin:0},...r&&{borderTopLeftRadius:"50%",borderBottomLeftRadius:"50%"},...t&&{borderTopRightRadius:"50%",borderBottomRightRadius:"50%"}}))),q=a=>{const{day:t,dateRange:i,...s}=a;if(null==i)return e.jsx(m.PickersDay,{day:t,...s});const[l,u]=i,d=!!u&&r.isAfter(t,l)&&c.isBefore(t,u),n=r.isSameDay(t,l),o=!!u&&r.isSameDay(t,u),f=r.isSameDay(t,r.startOfWeek(t)),y=r.isSameDay(t,r.endOfWeek(t));return e.jsx(D,{dayIsBetween:d,isFirstDay:n||d&&f,isLastDay:o||d&&y,"aria-label":r.format(t,"yyyy-MM-dd"),"aria-selected":d||n||o,role:"gridcell",children:e.jsx(m.PickersDay,{...s,day:t,selected:n||o})})},k=({defaultValue:r,onValueChange:t})=>{const[i,s]=a.useState(r),[l,u]=a.useState(0),d=(e,a,r)=>{s(e),t(e,a),u(r)};return e.jsx(m.DateCalendar,{value:null,onChange:e=>{if(e)return 1===l&&e<i[0]||0===l&&i[1]&&e>i[1]?d([e,void 0],0,1):void d([0===l?e:i[0],1===l?e:i[1]],l,0===l?1:0)},slots:{day:q},slotProps:{day:{dateRange:i}},"aria-label":"calendar range picker"})};exports.DateRangePicker=({defaultValue:t,format:i,label:s,fullWidth:l,onValueChange:u,size:d="medium"})=>{const[n,o]=a.useState(!1),[m,c]=a.useState(t);return e.jsxs(e.Fragment,{children:[e.jsx(h.default,{label:s,fullWidth:l,size:d,value:`${r.format(m[0],i)} - ${m[1]?r.format(m[1],i):i.toUpperCase()}`,InputProps:{endAdornment:e.jsx(x.default,{position:"end",children:e.jsx(p.default,{onClick:()=>o((e=>!e)),"aria-label":"open calendar",children:e.jsx(j.default,{})})})}}),e.jsx(g.default,{children:e.jsx(y.default,{in:n,"aria-label":"calendar collapse",children:e.jsx(k,{defaultValue:t,onValueChange:(e,a)=>{c(e),u(e,a),o(a<1)}})})})]})};
1
+ "use strict";var e=require("react/jsx-runtime"),a=require("react"),r=require("date-fns"),i=require("@mui/material/Collapse"),t=require("@mui/material/IconButton"),s=require("@mui/material/InputAdornment"),l=require("@mui/material/TextField"),n=require("@mui/material/Paper"),u=require("@mui/icons-material/Event"),d=require("@mui/material/Box"),o=require("@mui/material/styles"),m=require("@mui/x-date-pickers");const c=o.styled(d,{shouldForwardProp:e=>"dayIsBetween"!==e&&"isFirstDay"!==e&&"isLastDay"!==e&&"isStartOfWeek"!==e&&"isEndOfWeek"!==e})((({theme:e,dayIsBetween:a,isFirstDay:r,isLastDay:i})=>({...(r||i||a)&&{borderRadius:0,backgroundColor:`${e.palette.primary.light}40`,margin:0},...r&&{borderTopLeftRadius:"50%",borderBottomLeftRadius:"50%"},...i&&{borderTopRightRadius:"50%",borderBottomRightRadius:"50%"}}))),y=a=>{const{day:i,dateRange:t,...s}=a;if(null==t)return e.jsx(m.PickersDay,{day:i,...s});const[l,n]=t,u=!!n&&r.isAfter(i,l)&&r.isBefore(i,n),d=r.isSameDay(i,l),o=!!n&&r.isSameDay(i,n),y=r.isSameDay(i,r.startOfWeek(i)),f=r.isSameDay(i,r.endOfWeek(i));return e.jsx(c,{dayIsBetween:u,isFirstDay:d||u&&y,isLastDay:o||u&&f,"aria-label":r.format(i,"yyyy-MM-dd"),"aria-selected":u||d||o,role:"gridcell",children:e.jsx(m.PickersDay,{...s,day:i,selected:d||o})})},f=({defaultValue:r,onValueChange:i})=>{const[t,s]=a.useState(r),[l,n]=a.useState(0),u=(e,a,r)=>{s(e),i(e,a),n(r)};return e.jsx(m.DateCalendar,{value:null,onChange:e=>{if(e)return 1===l&&e<t[0]||0===l&&t[1]&&e>t[1]?u([e,void 0],0,1):void u([0===l?e:t[0],1===l?e:t[1]],l,0===l?1:0)},slots:{day:y},slotProps:{day:{dateRange:t}},"aria-label":"calendar range picker"})};exports.DateRangePicker=({defaultValue:d,format:o,label:m,fullWidth:c,onValueChange:y,size:p="medium"})=>{const[h,x]=a.useState(!1),[g,D]=a.useState(d);return e.jsxs(e.Fragment,{children:[e.jsx(l,{label:m,fullWidth:c,size:p,value:`${r.format(g[0],o)} - ${g[1]?r.format(g[1],o):o.toUpperCase()}`,InputProps:{endAdornment:e.jsx(s,{position:"end",children:e.jsx(t,{onClick:()=>x((e=>!e)),"aria-label":"open calendar",children:e.jsx(u,{})})})}}),e.jsx(n,{children:e.jsx(i,{in:h,"aria-label":"calendar collapse",children:e.jsx(f,{defaultValue:d,onValueChange:(e,a)=>{D(e),y(e,a),x(a<1)}})})})]})};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/date-range-calendar/date-range-calendar.tsx","../../../src/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import Box, { BoxProps } from \"@mui/material/Box\";\nimport { styled } from \"@mui/material/styles\";\nimport { DateCalendar, PickersDay, PickersDayProps } from \"@mui/x-date-pickers\";\nimport { endOfWeek, format, isAfter, isSameDay, startOfWeek } from \"date-fns\";\nimport { isBefore } from \"date-fns/esm\";\nimport { useState } from \"react\";\n\ntype DateRange = [Date, Date | undefined];\n\ninterface CustomPickerDayProps extends BoxProps {\n dayIsBetween: boolean;\n isFirstDay: boolean;\n isLastDay: boolean;\n}\n\nconst CustomPickersDayBackground = styled(Box, {\n shouldForwardProp: (prop) =>\n prop !== \"dayIsBetween\" &&\n prop !== \"isFirstDay\" &&\n prop !== \"isLastDay\" &&\n prop !== \"isStartOfWeek\" &&\n prop !== \"isEndOfWeek\",\n})<CustomPickerDayProps>(({ theme, dayIsBetween, isFirstDay, isLastDay }) => {\n return {\n ...((isFirstDay || isLastDay || dayIsBetween) && {\n borderRadius: 0,\n backgroundColor: `${theme.palette.primary.light}40`,\n margin: 0,\n }),\n ...(isFirstDay && {\n borderTopLeftRadius: \"50%\",\n borderBottomLeftRadius: \"50%\",\n }),\n ...(isLastDay && {\n borderTopRightRadius: \"50%\",\n borderBottomRightRadius: \"50%\",\n }),\n };\n}) as React.ComponentType<CustomPickerDayProps>;\n\nconst Day = (props: PickersDayProps<Date> & { dateRange?: DateRange | null }) => {\n const { day, dateRange, ...other } = props;\n\n if (dateRange == null) {\n return <PickersDay day={day} {...other} />;\n }\n\n const [start, end] = dateRange;\n\n const dayIsBetween = !!end && isAfter(day, start) && isBefore(day, end);\n const isFirstDay = isSameDay(day, start);\n const isLastDay = !!end && isSameDay(day, end);\n const isStartOfWeek = isSameDay(day, startOfWeek(day));\n const isEndOfWeek = isSameDay(day, endOfWeek(day));\n\n return (\n <CustomPickersDayBackground\n dayIsBetween={dayIsBetween}\n isFirstDay={isFirstDay || (dayIsBetween && isStartOfWeek)}\n isLastDay={isLastDay || (dayIsBetween && isEndOfWeek)}\n aria-label={format(day, \"yyyy-MM-dd\")}\n aria-selected={dayIsBetween || isFirstDay || isLastDay}\n role=\"gridcell\"\n >\n <PickersDay {...other} day={day} selected={isFirstDay || isLastDay} />\n </CustomPickersDayBackground>\n );\n};\n\nexport interface DateRangeCalendarProps {\n defaultValue: DateRange;\n onValueChange: (value: DateRange, updatedIndex: number) => void;\n}\nexport const DateRangeCalendar = ({ defaultValue, onValueChange }: DateRangeCalendarProps) => {\n const [value, setValue] = useState(defaultValue);\n const [index, setIndex] = useState(0);\n\n const setValueRange = (newRange: DateRange, index: number, newIndex: number) => {\n setValue(newRange);\n onValueChange(newRange, index);\n setIndex(newIndex);\n };\n\n const handleChange = (newValue: Date | null) => {\n if (!newValue) {\n return;\n }\n\n // If is the end date and is minor than the start date\n if (index === 1 && newValue < value[0]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // If is the start date and is bigger than the end date\n if (index === 0 && value[1] && newValue > value[1]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // Default case\n setValueRange(\n [index === 0 ? newValue : value[0], index === 1 ? newValue : value[1]],\n index,\n index === 0 ? 1 : 0,\n );\n };\n return (\n <DateCalendar\n value={null}\n onChange={handleChange}\n slots={{ day: Day }}\n slotProps={{\n day: {\n dateRange: value,\n } as any,\n }}\n aria-label=\"calendar range picker\"\n />\n );\n};\n","import { useState } from \"react\";\nimport { format } from \"date-fns\";\nimport Collapse from \"@mui/material/Collapse\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport TextField from \"@mui/material/TextField\";\nimport Paper from \"@mui/material/Paper\";\nimport EventIcon from \"@mui/icons-material/Event\";\nimport { DateRangeCalendar } from \"../date-range-calendar\";\n\ntype DateRange = [Date, Date | undefined];\nexport interface DateRangePickerProps {\n label: string;\n defaultValue: DateRange;\n format: string;\n fullWidth?: boolean;\n size?: \"small\" | \"medium\";\n onValueChange: (value: DateRange, index: number) => void;\n}\n\nexport const DateRangePicker = ({\n defaultValue,\n format: fmt,\n label,\n fullWidth,\n onValueChange,\n size = \"medium\",\n}: DateRangePickerProps) => {\n const [isPopoverOpened, setIsPopoverOpened] = useState(false);\n const [value, setValue] = useState(defaultValue);\n\n const handleValueChange = (newValue: DateRange, index: number) => {\n setValue(newValue);\n onValueChange(newValue, index);\n setIsPopoverOpened(index < 1);\n };\n\n return (\n <>\n <TextField\n label={label}\n fullWidth={fullWidth}\n size={size}\n value={`${format(value[0], fmt)} - ${value[1] ? format(value[1], fmt) : fmt.toUpperCase()}`}\n InputProps={{\n endAdornment: (\n <InputAdornment position=\"end\">\n <IconButton onClick={() => setIsPopoverOpened((o) => !o)} aria-label=\"open calendar\">\n <EventIcon />\n </IconButton>\n </InputAdornment>\n ),\n }}\n />\n <Paper>\n <Collapse in={isPopoverOpened} aria-label=\"calendar collapse\">\n <DateRangeCalendar defaultValue={defaultValue} onValueChange={handleValueChange} />\n </Collapse>\n </Paper>\n </>\n );\n};\n"],"names":["CustomPickersDayBackground","styled","Box","shouldForwardProp","prop","theme","dayIsBetween","isFirstDay","isLastDay","borderRadius","backgroundColor","palette","primary","light","margin","borderTopLeftRadius","borderBottomLeftRadius","borderTopRightRadius","borderBottomRightRadius","Day","props","day","dateRange","other","_jsx","PickersDay","start","end","isAfter","isBefore","isSameDay","isStartOfWeek","startOfWeek","isEndOfWeek","endOfWeek","format","role","children","selected","DateRangeCalendar","defaultValue","onValueChange","value","setValue","useState","index","setIndex","setValueRange","newRange","newIndex","DateCalendar","onChange","newValue","undefined","slots","slotProps","fmt","label","fullWidth","size","isPopoverOpened","setIsPopoverOpened","_jsxs","_Fragment","TextField","toUpperCase","InputProps","endAdornment","jsx","InputAdornment","position","IconButton","onClick","o","EventIcon","Paper","Collapse","in"],"mappings":"0mBAeA,MAAMA,EAA6BC,EAAMA,OAACC,UAAK,CAC7CC,kBAAoBC,GACT,iBAATA,GACS,eAATA,GACS,cAATA,GACS,kBAATA,GACS,gBAATA,GAN+BH,EAOV,EAAGI,QAAOC,eAAcC,aAAYC,gBACpD,KACAD,GAAcC,GAAaF,IAAiB,CAC/CG,aAAc,EACdC,gBAAiB,GAAGL,EAAMM,QAAQC,QAAQC,UAC1CC,OAAQ,MAENP,GAAc,CAChBQ,oBAAqB,MACrBC,uBAAwB,UAEtBR,GAAa,CACfS,qBAAsB,MACtBC,wBAAyB,WAKzBC,EAAOC,IACX,MAAMC,IAAEA,EAAGC,UAAEA,KAAcC,GAAUH,EAErC,GAAiB,MAAbE,EACF,OAAOE,EAAAA,IAACC,EAAAA,WAAW,CAAAJ,IAAKA,KAASE,IAGnC,MAAOG,EAAOC,GAAOL,EAEfhB,IAAiBqB,GAAOC,UAAQP,EAAKK,IAAUG,EAAQA,SAACR,EAAKM,GAC7DpB,EAAauB,EAAAA,UAAUT,EAAKK,GAC5BlB,IAAcmB,GAAOG,EAAAA,UAAUT,EAAKM,GACpCI,EAAgBD,EAAAA,UAAUT,EAAKW,EAAAA,YAAYX,IAC3CY,EAAcH,EAAAA,UAAUT,EAAKa,EAAAA,UAAUb,IAE7C,OACEG,EAAAA,IAACxB,EAA0B,CACzBM,aAAcA,EACdC,WAAYA,GAAeD,GAAgByB,EAC3CvB,UAAWA,GAAcF,GAAgB2B,EAAY,aACzCE,EAAAA,OAAOd,EAAK,cAAa,gBACtBf,GAAgBC,GAAcC,EAC7C4B,KAAK,WAAUC,SAEfb,EAAAA,IAACC,EAAUA,WAAK,IAAAF,EAAOF,IAAKA,EAAKiB,SAAU/B,GAAcC,KAE3D,EAOS+B,EAAoB,EAAGC,eAAcC,oBAChD,MAAOC,EAAOC,GAAYC,EAAQA,SAACJ,IAC5BK,EAAOC,GAAYF,EAAQA,SAAC,GAE7BG,EAAgB,CAACC,EAAqBH,EAAeI,KACzDN,EAASK,GACTP,EAAcO,EAAUH,GACxBC,EAASG,EAAS,EAyBpB,OACEzB,MAAC0B,EAAAA,aAAY,CACXR,MAAO,KACPS,SAzBkBC,IACpB,GAAKA,EAKL,OAAc,IAAVP,GAAeO,EAAWV,EAAM,IAKtB,IAAVG,GAAeH,EAAM,IAAMU,EAAWV,EAAM,GAJvCK,EAAc,CAACK,OAAUC,GAAY,EAAG,QASjDN,EACE,CAAW,IAAVF,EAAcO,EAAWV,EAAM,GAAc,IAAVG,EAAcO,EAAWV,EAAM,IACnEG,EACU,IAAVA,EAAc,EAAI,EACnB,EAMCS,MAAO,CAAEjC,IAAKF,GACdoC,UAAW,CACTlC,IAAK,CACHC,UAAWoB,IAGJ,aAAA,yBAEb,0BCjG2B,EAC7BF,eACAL,OAAQqB,EACRC,QACAC,YACAjB,gBACAkB,OAAO,aAEP,MAAOC,EAAiBC,GAAsBjB,EAAQA,UAAC,IAChDF,EAAOC,GAAYC,EAAQA,SAACJ,GAQnC,OACEsB,EAAAA,KACEC,EAAAA,SAAA,CAAA1B,SAAA,CAAAb,EAAAA,IAACwC,EAAAA,QAAS,CACRP,MAAOA,EACPC,UAAWA,EACXC,KAAMA,EACNjB,MAAO,GAAGP,EAAMA,OAACO,EAAM,GAAIc,QAAUd,EAAM,GAAKP,EAAMA,OAACO,EAAM,GAAIc,GAAOA,EAAIS,gBAC5EC,WAAY,CACVC,aACE3C,EAAC4C,IAAAC,WAAeC,SAAS,MAAKjC,SAC5Bb,MAAC+C,EAAAA,QAAU,CAACC,QAAS,IAAMX,GAAoBY,IAAOA,IAAe,aAAA,yBACnEjD,EAAC4C,IAAAM,UAAY,CAAA,UAMvBlD,EAAAA,IAACmD,EAAK,QAAA,CAAAtC,SACJb,MAACoD,EAAAA,QAAS,CAAAC,GAAIjB,EAA4B,aAAA,oBACxCvB,SAAAb,EAAAA,IAACe,EAAiB,CAACC,aAAcA,EAAcC,cAzB7B,CAACW,EAAqBP,KAC9CF,EAASS,GACTX,EAAcW,EAAUP,GACxBgB,EAAmBhB,EAAQ,EAAE,UA0B7B"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/date-range-calendar/date-range-calendar.tsx","../../../src/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import Box, { BoxProps } from \"@mui/material/Box\";\nimport { styled } from \"@mui/material/styles\";\nimport { DateCalendar, PickersDay, PickersDayProps } from \"@mui/x-date-pickers\";\nimport { endOfWeek, format, isAfter, isBefore, isSameDay, startOfWeek } from \"date-fns\";\nimport { useState } from \"react\";\n\ntype DateRange = [Date, Date | undefined];\n\ninterface CustomPickerDayProps extends BoxProps {\n dayIsBetween: boolean;\n isFirstDay: boolean;\n isLastDay: boolean;\n}\n\nconst CustomPickersDayBackground = styled(Box, {\n shouldForwardProp: (prop) =>\n prop !== \"dayIsBetween\" &&\n prop !== \"isFirstDay\" &&\n prop !== \"isLastDay\" &&\n prop !== \"isStartOfWeek\" &&\n prop !== \"isEndOfWeek\",\n})<CustomPickerDayProps>(({ theme, dayIsBetween, isFirstDay, isLastDay }) => {\n return {\n ...((isFirstDay || isLastDay || dayIsBetween) && {\n borderRadius: 0,\n backgroundColor: `${theme.palette.primary.light}40`,\n margin: 0,\n }),\n ...(isFirstDay && {\n borderTopLeftRadius: \"50%\",\n borderBottomLeftRadius: \"50%\",\n }),\n ...(isLastDay && {\n borderTopRightRadius: \"50%\",\n borderBottomRightRadius: \"50%\",\n }),\n };\n}) as React.ComponentType<CustomPickerDayProps>;\n\nconst Day = (props: PickersDayProps<Date> & { dateRange?: DateRange | null }) => {\n const { day, dateRange, ...other } = props;\n\n if (dateRange == null) {\n return <PickersDay day={day} {...other} />;\n }\n\n const [start, end] = dateRange;\n\n const dayIsBetween = !!end && isAfter(day, start) && isBefore(day, end);\n const isFirstDay = isSameDay(day, start);\n const isLastDay = !!end && isSameDay(day, end);\n const isStartOfWeek = isSameDay(day, startOfWeek(day));\n const isEndOfWeek = isSameDay(day, endOfWeek(day));\n\n return (\n <CustomPickersDayBackground\n dayIsBetween={dayIsBetween}\n isFirstDay={isFirstDay || (dayIsBetween && isStartOfWeek)}\n isLastDay={isLastDay || (dayIsBetween && isEndOfWeek)}\n aria-label={format(day, \"yyyy-MM-dd\")}\n aria-selected={dayIsBetween || isFirstDay || isLastDay}\n role=\"gridcell\"\n >\n <PickersDay {...other} day={day} selected={isFirstDay || isLastDay} />\n </CustomPickersDayBackground>\n );\n};\n\nexport interface DateRangeCalendarProps {\n defaultValue: DateRange;\n onValueChange: (value: DateRange, updatedIndex: number) => void;\n}\nexport const DateRangeCalendar = ({ defaultValue, onValueChange }: DateRangeCalendarProps) => {\n const [value, setValue] = useState(defaultValue);\n const [index, setIndex] = useState(0);\n\n const setValueRange = (newRange: DateRange, index: number, newIndex: number) => {\n setValue(newRange);\n onValueChange(newRange, index);\n setIndex(newIndex);\n };\n\n const handleChange = (newValue: Date | null) => {\n if (!newValue) {\n return;\n }\n\n // If is the end date and is minor than the start date\n if (index === 1 && newValue < value[0]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // If is the start date and is bigger than the end date\n if (index === 0 && value[1] && newValue > value[1]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // Default case\n setValueRange(\n [index === 0 ? newValue : value[0], index === 1 ? newValue : value[1]],\n index,\n index === 0 ? 1 : 0,\n );\n };\n return (\n <DateCalendar\n value={null}\n onChange={handleChange}\n slots={{ day: Day }}\n slotProps={{\n day: {\n dateRange: value,\n } as any,\n }}\n aria-label=\"calendar range picker\"\n />\n );\n};\n","import { useState } from \"react\";\nimport { format } from \"date-fns\";\nimport Collapse from \"@mui/material/Collapse\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport TextField from \"@mui/material/TextField\";\nimport Paper from \"@mui/material/Paper\";\nimport EventIcon from \"@mui/icons-material/Event\";\nimport { DateRangeCalendar } from \"../date-range-calendar\";\n\ntype DateRange = [Date, Date | undefined];\nexport interface DateRangePickerProps {\n label: string;\n defaultValue: DateRange;\n format: string;\n fullWidth?: boolean;\n size?: \"small\" | \"medium\";\n onValueChange: (value: DateRange, index: number) => void;\n}\n\nexport const DateRangePicker = ({\n defaultValue,\n format: fmt,\n label,\n fullWidth,\n onValueChange,\n size = \"medium\",\n}: DateRangePickerProps) => {\n const [isPopoverOpened, setIsPopoverOpened] = useState(false);\n const [value, setValue] = useState(defaultValue);\n\n const handleValueChange = (newValue: DateRange, index: number) => {\n setValue(newValue);\n onValueChange(newValue, index);\n setIsPopoverOpened(index < 1);\n };\n\n return (\n <>\n <TextField\n label={label}\n fullWidth={fullWidth}\n size={size}\n value={`${format(value[0], fmt)} - ${value[1] ? format(value[1], fmt) : fmt.toUpperCase()}`}\n InputProps={{\n endAdornment: (\n <InputAdornment position=\"end\">\n <IconButton onClick={() => setIsPopoverOpened((o) => !o)} aria-label=\"open calendar\">\n <EventIcon />\n </IconButton>\n </InputAdornment>\n ),\n }}\n />\n <Paper>\n <Collapse in={isPopoverOpened} aria-label=\"calendar collapse\">\n <DateRangeCalendar defaultValue={defaultValue} onValueChange={handleValueChange} />\n </Collapse>\n </Paper>\n </>\n );\n};\n"],"names":["CustomPickersDayBackground","styled","Box","shouldForwardProp","prop","theme","dayIsBetween","isFirstDay","isLastDay","borderRadius","backgroundColor","palette","primary","light","margin","borderTopLeftRadius","borderBottomLeftRadius","borderTopRightRadius","borderBottomRightRadius","Day","props","day","dateRange","other","_jsx","PickersDay","start","end","isAfter","isBefore","isSameDay","isStartOfWeek","startOfWeek","isEndOfWeek","endOfWeek","format","role","children","selected","DateRangeCalendar","defaultValue","onValueChange","value","setValue","useState","index","setIndex","setValueRange","newRange","newIndex","DateCalendar","onChange","newValue","undefined","slots","slotProps","fmt","label","fullWidth","size","isPopoverOpened","setIsPopoverOpened","_jsxs","_Fragment","TextField","toUpperCase","InputProps","endAdornment","jsx","InputAdornment","position","IconButton","onClick","o","EventIcon","Paper","Collapse","in"],"mappings":"4ZAcA,MAAMA,EAA6BC,EAAMA,OAACC,EAAK,CAC7CC,kBAAoBC,GACT,iBAATA,GACS,eAATA,GACS,cAATA,GACS,kBAATA,GACS,gBAATA,GAN+BH,EAOV,EAAGI,QAAOC,eAAcC,aAAYC,gBACpD,KACAD,GAAcC,GAAaF,IAAiB,CAC/CG,aAAc,EACdC,gBAAiB,GAAGL,EAAMM,QAAQC,QAAQC,UAC1CC,OAAQ,MAENP,GAAc,CAChBQ,oBAAqB,MACrBC,uBAAwB,UAEtBR,GAAa,CACfS,qBAAsB,MACtBC,wBAAyB,WAKzBC,EAAOC,IACX,MAAMC,IAAEA,EAAGC,UAAEA,KAAcC,GAAUH,EAErC,GAAiB,MAAbE,EACF,OAAOE,EAAAA,IAACC,EAAAA,WAAW,CAAAJ,IAAKA,KAASE,IAGnC,MAAOG,EAAOC,GAAOL,EAEfhB,IAAiBqB,GAAOC,EAAOA,QAACP,EAAKK,IAAUG,EAAAA,SAASR,EAAKM,GAC7DpB,EAAauB,EAAAA,UAAUT,EAAKK,GAC5BlB,IAAcmB,GAAOG,EAAAA,UAAUT,EAAKM,GACpCI,EAAgBD,EAASA,UAACT,EAAKW,EAAWA,YAACX,IAC3CY,EAAcH,EAASA,UAACT,EAAKa,EAASA,UAACb,IAE7C,OACEG,EAAAA,IAACxB,EAA0B,CACzBM,aAAcA,EACdC,WAAYA,GAAeD,GAAgByB,EAC3CvB,UAAWA,GAAcF,GAAgB2B,EAAY,aACzCE,EAAMA,OAACd,EAAK,cAAa,gBACtBf,GAAgBC,GAAcC,EAC7C4B,KAAK,WAAUC,SAEfb,MAACC,EAAAA,WAAe,IAAAF,EAAOF,IAAKA,EAAKiB,SAAU/B,GAAcC,KAC9B,EAQpB+B,EAAoB,EAAGC,eAAcC,oBAChD,MAAOC,EAAOC,GAAYC,EAAAA,SAASJ,IAC5BK,EAAOC,GAAYF,EAAAA,SAAS,GAE7BG,EAAgB,CAACC,EAAqBH,EAAeI,KACzDN,EAASK,GACTP,EAAcO,EAAUH,GACxBC,EAASG,EAAS,EAyBpB,OACEzB,MAAC0B,EAAAA,aAAY,CACXR,MAAO,KACPS,SAzBkBC,IACpB,GAAKA,EAKL,OAAc,IAAVP,GAAeO,EAAWV,EAAM,IAKtB,IAAVG,GAAeH,EAAM,IAAMU,EAAWV,EAAM,GAJvCK,EAAc,CAACK,OAAUC,GAAY,EAAG,QASjDN,EACE,CAAW,IAAVF,EAAcO,EAAWV,EAAM,GAAc,IAAVG,EAAcO,EAAWV,EAAM,IACnEG,EACU,IAAVA,EAAc,EAAI,EACnB,EAMCS,MAAO,CAAEjC,IAAKF,GACdoC,UAAW,CACTlC,IAAK,CACHC,UAAWoB,IAGJ,aAAA,yBACX,0BC/FyB,EAC7BF,eACAL,OAAQqB,EACRC,QACAC,YACAjB,gBACAkB,OAAO,aAEP,MAAOC,EAAiBC,GAAsBjB,EAAAA,UAAS,IAChDF,EAAOC,GAAYC,EAAAA,SAASJ,GAQnC,OACEsB,EAAAA,KACEC,EAAAA,SAAA,CAAA1B,SAAA,CAAAb,EAAAA,IAACwC,EAAS,CACRP,MAAOA,EACPC,UAAWA,EACXC,KAAMA,EACNjB,MAAO,GAAGP,EAAMA,OAACO,EAAM,GAAIc,QAAUd,EAAM,GAAKP,EAAMA,OAACO,EAAM,GAAIc,GAAOA,EAAIS,gBAC5EC,WAAY,CACVC,aACE3C,EAAC4C,IAAAC,GAAeC,SAAS,MAAKjC,SAC5Bb,MAAC+C,EAAU,CAACC,QAAS,IAAMX,GAAoBY,IAAOA,IAAe,aAAA,yBACnEjD,EAAC4C,IAAAM,EAAY,CAAA,UAMvBlD,EAAAA,IAACmD,EAAK,CAAAtC,SACJb,MAACoD,EAAS,CAAAC,GAAIjB,EAA4B,aAAA,oBACxCvB,SAAAb,MAACe,EAAiB,CAACC,aAAcA,EAAcC,cAzB7B,CAACW,EAAqBP,KAC9CF,EAASS,GACTX,EAAcW,EAAUP,GACxBgB,EAAmBhB,EAAQ,EAAE,UAyB1B"}
@@ -5,10 +5,10 @@
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "dependencies": {
8
- "@mui/icons-material": "^5.11.16",
9
- "@mui/material": "^5.13.6",
10
- "@mui/x-date-pickers": "^6.9.0",
11
- "date-fns": "^2.30.0",
12
- "react": "^18.2.0"
8
+ "@mui/icons-material": "^6.4.5",
9
+ "@mui/material": "^6.4.5",
10
+ "@mui/x-date-pickers": "^7.27.0",
11
+ "date-fns": "^4.1.0",
12
+ "react": "^19.0.0"
13
13
  }
14
14
  }
@@ -7,5 +7,5 @@ export interface DateRangePickerProps {
7
7
  size?: "small" | "medium";
8
8
  onValueChange: (value: DateRange, index: number) => void;
9
9
  }
10
- export declare const DateRangePicker: ({ defaultValue, format: fmt, label, fullWidth, onValueChange, size, }: DateRangePickerProps) => JSX.Element;
10
+ export declare const DateRangePicker: ({ defaultValue, format: fmt, label, fullWidth, onValueChange, size, }: DateRangePickerProps) => import("react/jsx-runtime").JSX.Element;
11
11
  export {};
@@ -1,2 +1,2 @@
1
- import{jsx as e,jsxs as a,Fragment as r}from"react/jsx-runtime";import{useState as t}from"react";import{isAfter as i,isSameDay as o,startOfWeek as l,endOfWeek as n,format as m}from"date-fns";import d from"@mui/material/Collapse";import s from"@mui/material/IconButton";import u from"@mui/material/InputAdornment";import p from"@mui/material/TextField";import f from"@mui/material/Paper";import c from"@mui/icons-material/Event";import y from"@mui/material/Box";import{styled as h}from"@mui/material/styles";import{DateCalendar as g,PickersDay as b}from"@mui/x-date-pickers";import{isBefore as R}from"date-fns/esm";const C=h(y,{shouldForwardProp:e=>"dayIsBetween"!==e&&"isFirstDay"!==e&&"isLastDay"!==e&&"isStartOfWeek"!==e&&"isEndOfWeek"!==e})((({theme:e,dayIsBetween:a,isFirstDay:r,isLastDay:t})=>({...(r||t||a)&&{borderRadius:0,backgroundColor:`${e.palette.primary.light}40`,margin:0},...r&&{borderTopLeftRadius:"50%",borderBottomLeftRadius:"50%"},...t&&{borderTopRightRadius:"50%",borderBottomRightRadius:"50%"}}))),B=a=>{const{day:r,dateRange:t,...d}=a;if(null==t)return e(b,{day:r,...d});const[s,u]=t,p=!!u&&i(r,s)&&R(r,u),f=o(r,s),c=!!u&&o(r,u),y=o(r,l(r)),h=o(r,n(r));return e(C,{dayIsBetween:p,isFirstDay:f||p&&y,isLastDay:c||p&&h,"aria-label":m(r,"yyyy-MM-dd"),"aria-selected":p||f||c,role:"gridcell",children:e(b,{...d,day:r,selected:f||c})})},k=({defaultValue:a,onValueChange:r})=>{const[i,o]=t(a),[l,n]=t(0),m=(e,a,t)=>{o(e),r(e,a),n(t)};return e(g,{value:null,onChange:e=>{if(e)return 1===l&&e<i[0]||0===l&&i[1]&&e>i[1]?m([e,void 0],0,1):void m([0===l?e:i[0],1===l?e:i[1]],l,0===l?1:0)},slots:{day:B},slotProps:{day:{dateRange:i}},"aria-label":"calendar range picker"})},D=({defaultValue:i,format:o,label:l,fullWidth:n,onValueChange:y,size:h="medium"})=>{const[g,b]=t(!1),[R,C]=t(i);return a(r,{children:[e(p,{label:l,fullWidth:n,size:h,value:`${m(R[0],o)} - ${R[1]?m(R[1],o):o.toUpperCase()}`,InputProps:{endAdornment:e(u,{position:"end",children:e(s,{onClick:()=>b((e=>!e)),"aria-label":"open calendar",children:e(c,{})})})}}),e(f,{children:e(d,{in:g,"aria-label":"calendar collapse",children:e(k,{defaultValue:i,onValueChange:(e,a)=>{C(e),y(e,a),b(a<1)}})})})]})};export{D as DateRangePicker};
1
+ import{jsx as e,jsxs as a,Fragment as r}from"react/jsx-runtime";import{useState as t}from"react";import{isAfter as i,isBefore as o,isSameDay as l,startOfWeek as n,endOfWeek as d,format as m}from"date-fns";import s from"@mui/material/Collapse";import u from"@mui/material/IconButton";import p from"@mui/material/InputAdornment";import c from"@mui/material/TextField";import f from"@mui/material/Paper";import y from"@mui/icons-material/Event";import h from"@mui/material/Box";import{styled as g}from"@mui/material/styles";import{DateCalendar as b,PickersDay as R}from"@mui/x-date-pickers";const C=g(h,{shouldForwardProp:e=>"dayIsBetween"!==e&&"isFirstDay"!==e&&"isLastDay"!==e&&"isStartOfWeek"!==e&&"isEndOfWeek"!==e})((({theme:e,dayIsBetween:a,isFirstDay:r,isLastDay:t})=>({...(r||t||a)&&{borderRadius:0,backgroundColor:`${e.palette.primary.light}40`,margin:0},...r&&{borderTopLeftRadius:"50%",borderBottomLeftRadius:"50%"},...t&&{borderTopRightRadius:"50%",borderBottomRightRadius:"50%"}}))),B=a=>{const{day:r,dateRange:t,...s}=a;if(null==t)return e(R,{day:r,...s});const[u,p]=t,c=!!p&&i(r,u)&&o(r,p),f=l(r,u),y=!!p&&l(r,p),h=l(r,n(r)),g=l(r,d(r));return e(C,{dayIsBetween:c,isFirstDay:f||c&&h,isLastDay:y||c&&g,"aria-label":m(r,"yyyy-MM-dd"),"aria-selected":c||f||y,role:"gridcell",children:e(R,{...s,day:r,selected:f||y})})},k=({defaultValue:a,onValueChange:r})=>{const[i,o]=t(a),[l,n]=t(0),d=(e,a,t)=>{o(e),r(e,a),n(t)};return e(b,{value:null,onChange:e=>{if(e)return 1===l&&e<i[0]||0===l&&i[1]&&e>i[1]?d([e,void 0],0,1):void d([0===l?e:i[0],1===l?e:i[1]],l,0===l?1:0)},slots:{day:B},slotProps:{day:{dateRange:i}},"aria-label":"calendar range picker"})},D=({defaultValue:i,format:o,label:l,fullWidth:n,onValueChange:d,size:h="medium"})=>{const[g,b]=t(!1),[R,C]=t(i);return a(r,{children:[e(c,{label:l,fullWidth:n,size:h,value:`${m(R[0],o)} - ${R[1]?m(R[1],o):o.toUpperCase()}`,InputProps:{endAdornment:e(p,{position:"end",children:e(u,{onClick:()=>b((e=>!e)),"aria-label":"open calendar",children:e(y,{})})})}}),e(f,{children:e(s,{in:g,"aria-label":"calendar collapse",children:e(k,{defaultValue:i,onValueChange:(e,a)=>{C(e),d(e,a),b(a<1)}})})})]})};export{D as DateRangePicker};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/date-range-calendar/date-range-calendar.tsx","../../src/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import Box, { BoxProps } from \"@mui/material/Box\";\nimport { styled } from \"@mui/material/styles\";\nimport { DateCalendar, PickersDay, PickersDayProps } from \"@mui/x-date-pickers\";\nimport { endOfWeek, format, isAfter, isSameDay, startOfWeek } from \"date-fns\";\nimport { isBefore } from \"date-fns/esm\";\nimport { useState } from \"react\";\n\ntype DateRange = [Date, Date | undefined];\n\ninterface CustomPickerDayProps extends BoxProps {\n dayIsBetween: boolean;\n isFirstDay: boolean;\n isLastDay: boolean;\n}\n\nconst CustomPickersDayBackground = styled(Box, {\n shouldForwardProp: (prop) =>\n prop !== \"dayIsBetween\" &&\n prop !== \"isFirstDay\" &&\n prop !== \"isLastDay\" &&\n prop !== \"isStartOfWeek\" &&\n prop !== \"isEndOfWeek\",\n})<CustomPickerDayProps>(({ theme, dayIsBetween, isFirstDay, isLastDay }) => {\n return {\n ...((isFirstDay || isLastDay || dayIsBetween) && {\n borderRadius: 0,\n backgroundColor: `${theme.palette.primary.light}40`,\n margin: 0,\n }),\n ...(isFirstDay && {\n borderTopLeftRadius: \"50%\",\n borderBottomLeftRadius: \"50%\",\n }),\n ...(isLastDay && {\n borderTopRightRadius: \"50%\",\n borderBottomRightRadius: \"50%\",\n }),\n };\n}) as React.ComponentType<CustomPickerDayProps>;\n\nconst Day = (props: PickersDayProps<Date> & { dateRange?: DateRange | null }) => {\n const { day, dateRange, ...other } = props;\n\n if (dateRange == null) {\n return <PickersDay day={day} {...other} />;\n }\n\n const [start, end] = dateRange;\n\n const dayIsBetween = !!end && isAfter(day, start) && isBefore(day, end);\n const isFirstDay = isSameDay(day, start);\n const isLastDay = !!end && isSameDay(day, end);\n const isStartOfWeek = isSameDay(day, startOfWeek(day));\n const isEndOfWeek = isSameDay(day, endOfWeek(day));\n\n return (\n <CustomPickersDayBackground\n dayIsBetween={dayIsBetween}\n isFirstDay={isFirstDay || (dayIsBetween && isStartOfWeek)}\n isLastDay={isLastDay || (dayIsBetween && isEndOfWeek)}\n aria-label={format(day, \"yyyy-MM-dd\")}\n aria-selected={dayIsBetween || isFirstDay || isLastDay}\n role=\"gridcell\"\n >\n <PickersDay {...other} day={day} selected={isFirstDay || isLastDay} />\n </CustomPickersDayBackground>\n );\n};\n\nexport interface DateRangeCalendarProps {\n defaultValue: DateRange;\n onValueChange: (value: DateRange, updatedIndex: number) => void;\n}\nexport const DateRangeCalendar = ({ defaultValue, onValueChange }: DateRangeCalendarProps) => {\n const [value, setValue] = useState(defaultValue);\n const [index, setIndex] = useState(0);\n\n const setValueRange = (newRange: DateRange, index: number, newIndex: number) => {\n setValue(newRange);\n onValueChange(newRange, index);\n setIndex(newIndex);\n };\n\n const handleChange = (newValue: Date | null) => {\n if (!newValue) {\n return;\n }\n\n // If is the end date and is minor than the start date\n if (index === 1 && newValue < value[0]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // If is the start date and is bigger than the end date\n if (index === 0 && value[1] && newValue > value[1]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // Default case\n setValueRange(\n [index === 0 ? newValue : value[0], index === 1 ? newValue : value[1]],\n index,\n index === 0 ? 1 : 0,\n );\n };\n return (\n <DateCalendar\n value={null}\n onChange={handleChange}\n slots={{ day: Day }}\n slotProps={{\n day: {\n dateRange: value,\n } as any,\n }}\n aria-label=\"calendar range picker\"\n />\n );\n};\n","import { useState } from \"react\";\nimport { format } from \"date-fns\";\nimport Collapse from \"@mui/material/Collapse\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport TextField from \"@mui/material/TextField\";\nimport Paper from \"@mui/material/Paper\";\nimport EventIcon from \"@mui/icons-material/Event\";\nimport { DateRangeCalendar } from \"../date-range-calendar\";\n\ntype DateRange = [Date, Date | undefined];\nexport interface DateRangePickerProps {\n label: string;\n defaultValue: DateRange;\n format: string;\n fullWidth?: boolean;\n size?: \"small\" | \"medium\";\n onValueChange: (value: DateRange, index: number) => void;\n}\n\nexport const DateRangePicker = ({\n defaultValue,\n format: fmt,\n label,\n fullWidth,\n onValueChange,\n size = \"medium\",\n}: DateRangePickerProps) => {\n const [isPopoverOpened, setIsPopoverOpened] = useState(false);\n const [value, setValue] = useState(defaultValue);\n\n const handleValueChange = (newValue: DateRange, index: number) => {\n setValue(newValue);\n onValueChange(newValue, index);\n setIsPopoverOpened(index < 1);\n };\n\n return (\n <>\n <TextField\n label={label}\n fullWidth={fullWidth}\n size={size}\n value={`${format(value[0], fmt)} - ${value[1] ? format(value[1], fmt) : fmt.toUpperCase()}`}\n InputProps={{\n endAdornment: (\n <InputAdornment position=\"end\">\n <IconButton onClick={() => setIsPopoverOpened((o) => !o)} aria-label=\"open calendar\">\n <EventIcon />\n </IconButton>\n </InputAdornment>\n ),\n }}\n />\n <Paper>\n <Collapse in={isPopoverOpened} aria-label=\"calendar collapse\">\n <DateRangeCalendar defaultValue={defaultValue} onValueChange={handleValueChange} />\n </Collapse>\n </Paper>\n </>\n );\n};\n"],"names":["CustomPickersDayBackground","styled","Box","shouldForwardProp","prop","theme","dayIsBetween","isFirstDay","isLastDay","borderRadius","backgroundColor","palette","primary","light","margin","borderTopLeftRadius","borderBottomLeftRadius","borderTopRightRadius","borderBottomRightRadius","Day","props","day","dateRange","other","_jsx","PickersDay","start","end","isAfter","isBefore","isSameDay","isStartOfWeek","startOfWeek","isEndOfWeek","endOfWeek","format","role","children","selected","DateRangeCalendar","defaultValue","onValueChange","value","setValue","useState","index","setIndex","setValueRange","newRange","newIndex","DateCalendar","onChange","newValue","undefined","slots","slotProps","DateRangePicker","fmt","label","fullWidth","size","isPopoverOpened","setIsPopoverOpened","_jsxs","_Fragment","TextField","toUpperCase","InputProps","endAdornment","InputAdornment","position","IconButton","onClick","o","EventIcon","Paper","Collapse","in"],"mappings":"smBAeA,MAAMA,EAA6BC,EAAOC,EAAK,CAC7CC,kBAAoBC,GACT,iBAATA,GACS,eAATA,GACS,cAATA,GACS,kBAATA,GACS,gBAATA,GAN+BH,EAOV,EAAGI,QAAOC,eAAcC,aAAYC,gBACpD,KACAD,GAAcC,GAAaF,IAAiB,CAC/CG,aAAc,EACdC,gBAAiB,GAAGL,EAAMM,QAAQC,QAAQC,UAC1CC,OAAQ,MAENP,GAAc,CAChBQ,oBAAqB,MACrBC,uBAAwB,UAEtBR,GAAa,CACfS,qBAAsB,MACtBC,wBAAyB,WAKzBC,EAAOC,IACX,MAAMC,IAAEA,EAAGC,UAAEA,KAAcC,GAAUH,EAErC,GAAiB,MAAbE,EACF,OAAOE,EAACC,EAAW,CAAAJ,IAAKA,KAASE,IAGnC,MAAOG,EAAOC,GAAOL,EAEfhB,IAAiBqB,GAAOC,EAAQP,EAAKK,IAAUG,EAASR,EAAKM,GAC7DpB,EAAauB,EAAUT,EAAKK,GAC5BlB,IAAcmB,GAAOG,EAAUT,EAAKM,GACpCI,EAAgBD,EAAUT,EAAKW,EAAYX,IAC3CY,EAAcH,EAAUT,EAAKa,EAAUb,IAE7C,OACEG,EAACxB,EAA0B,CACzBM,aAAcA,EACdC,WAAYA,GAAeD,GAAgByB,EAC3CvB,UAAWA,GAAcF,GAAgB2B,EAAY,aACzCE,EAAOd,EAAK,cAAa,gBACtBf,GAAgBC,GAAcC,EAC7C4B,KAAK,WAAUC,SAEfb,EAACC,EAAe,IAAAF,EAAOF,IAAKA,EAAKiB,SAAU/B,GAAcC,KAE3D,EAOS+B,EAAoB,EAAGC,eAAcC,oBAChD,MAAOC,EAAOC,GAAYC,EAASJ,IAC5BK,EAAOC,GAAYF,EAAS,GAE7BG,EAAgB,CAACC,EAAqBH,EAAeI,KACzDN,EAASK,GACTP,EAAcO,EAAUH,GACxBC,EAASG,EAAS,EAyBpB,OACEzB,EAAC0B,EAAY,CACXR,MAAO,KACPS,SAzBkBC,IACpB,GAAKA,EAKL,OAAc,IAAVP,GAAeO,EAAWV,EAAM,IAKtB,IAAVG,GAAeH,EAAM,IAAMU,EAAWV,EAAM,GAJvCK,EAAc,CAACK,OAAUC,GAAY,EAAG,QASjDN,EACE,CAAW,IAAVF,EAAcO,EAAWV,EAAM,GAAc,IAAVG,EAAcO,EAAWV,EAAM,IACnEG,EACU,IAAVA,EAAc,EAAI,EACnB,EAMCS,MAAO,CAAEjC,IAAKF,GACdoC,UAAW,CACTlC,IAAK,CACHC,UAAWoB,IAGJ,aAAA,yBAEb,ECjGSc,EAAkB,EAC7BhB,eACAL,OAAQsB,EACRC,QACAC,YACAlB,gBACAmB,OAAO,aAEP,MAAOC,EAAiBC,GAAsBlB,GAAS,IAChDF,EAAOC,GAAYC,EAASJ,GAQnC,OACEuB,EACEC,EAAA,CAAA3B,SAAA,CAAAb,EAACyC,EAAS,CACRP,MAAOA,EACPC,UAAWA,EACXC,KAAMA,EACNlB,MAAO,GAAGP,EAAOO,EAAM,GAAIe,QAAUf,EAAM,GAAKP,EAAOO,EAAM,GAAIe,GAAOA,EAAIS,gBAC5EC,WAAY,CACVC,aACE5C,EAAC6C,GAAeC,SAAS,MAAKjC,SAC5Bb,EAAC+C,EAAU,CAACC,QAAS,IAAMV,GAAoBW,IAAOA,IAAe,aAAA,yBACnEjD,EAACkD,EAAY,CAAA,UAMvBlD,EAACmD,EAAK,CAAAtC,SACJb,EAACoD,EAAS,CAAAC,GAAIhB,EAA4B,aAAA,oBACxCxB,SAAAb,EAACe,EAAiB,CAACC,aAAcA,EAAcC,cAzB7B,CAACW,EAAqBP,KAC9CF,EAASS,GACTX,EAAcW,EAAUP,GACxBiB,EAAmBjB,EAAQ,EAAE,UA0B7B"}
1
+ {"version":3,"file":"index.js","sources":["../../src/date-range-calendar/date-range-calendar.tsx","../../src/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import Box, { BoxProps } from \"@mui/material/Box\";\nimport { styled } from \"@mui/material/styles\";\nimport { DateCalendar, PickersDay, PickersDayProps } from \"@mui/x-date-pickers\";\nimport { endOfWeek, format, isAfter, isBefore, isSameDay, startOfWeek } from \"date-fns\";\nimport { useState } from \"react\";\n\ntype DateRange = [Date, Date | undefined];\n\ninterface CustomPickerDayProps extends BoxProps {\n dayIsBetween: boolean;\n isFirstDay: boolean;\n isLastDay: boolean;\n}\n\nconst CustomPickersDayBackground = styled(Box, {\n shouldForwardProp: (prop) =>\n prop !== \"dayIsBetween\" &&\n prop !== \"isFirstDay\" &&\n prop !== \"isLastDay\" &&\n prop !== \"isStartOfWeek\" &&\n prop !== \"isEndOfWeek\",\n})<CustomPickerDayProps>(({ theme, dayIsBetween, isFirstDay, isLastDay }) => {\n return {\n ...((isFirstDay || isLastDay || dayIsBetween) && {\n borderRadius: 0,\n backgroundColor: `${theme.palette.primary.light}40`,\n margin: 0,\n }),\n ...(isFirstDay && {\n borderTopLeftRadius: \"50%\",\n borderBottomLeftRadius: \"50%\",\n }),\n ...(isLastDay && {\n borderTopRightRadius: \"50%\",\n borderBottomRightRadius: \"50%\",\n }),\n };\n}) as React.ComponentType<CustomPickerDayProps>;\n\nconst Day = (props: PickersDayProps<Date> & { dateRange?: DateRange | null }) => {\n const { day, dateRange, ...other } = props;\n\n if (dateRange == null) {\n return <PickersDay day={day} {...other} />;\n }\n\n const [start, end] = dateRange;\n\n const dayIsBetween = !!end && isAfter(day, start) && isBefore(day, end);\n const isFirstDay = isSameDay(day, start);\n const isLastDay = !!end && isSameDay(day, end);\n const isStartOfWeek = isSameDay(day, startOfWeek(day));\n const isEndOfWeek = isSameDay(day, endOfWeek(day));\n\n return (\n <CustomPickersDayBackground\n dayIsBetween={dayIsBetween}\n isFirstDay={isFirstDay || (dayIsBetween && isStartOfWeek)}\n isLastDay={isLastDay || (dayIsBetween && isEndOfWeek)}\n aria-label={format(day, \"yyyy-MM-dd\")}\n aria-selected={dayIsBetween || isFirstDay || isLastDay}\n role=\"gridcell\"\n >\n <PickersDay {...other} day={day} selected={isFirstDay || isLastDay} />\n </CustomPickersDayBackground>\n );\n};\n\nexport interface DateRangeCalendarProps {\n defaultValue: DateRange;\n onValueChange: (value: DateRange, updatedIndex: number) => void;\n}\nexport const DateRangeCalendar = ({ defaultValue, onValueChange }: DateRangeCalendarProps) => {\n const [value, setValue] = useState(defaultValue);\n const [index, setIndex] = useState(0);\n\n const setValueRange = (newRange: DateRange, index: number, newIndex: number) => {\n setValue(newRange);\n onValueChange(newRange, index);\n setIndex(newIndex);\n };\n\n const handleChange = (newValue: Date | null) => {\n if (!newValue) {\n return;\n }\n\n // If is the end date and is minor than the start date\n if (index === 1 && newValue < value[0]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // If is the start date and is bigger than the end date\n if (index === 0 && value[1] && newValue > value[1]) {\n return setValueRange([newValue, undefined], 0, 1);\n }\n\n // Default case\n setValueRange(\n [index === 0 ? newValue : value[0], index === 1 ? newValue : value[1]],\n index,\n index === 0 ? 1 : 0,\n );\n };\n return (\n <DateCalendar\n value={null}\n onChange={handleChange}\n slots={{ day: Day }}\n slotProps={{\n day: {\n dateRange: value,\n } as any,\n }}\n aria-label=\"calendar range picker\"\n />\n );\n};\n","import { useState } from \"react\";\nimport { format } from \"date-fns\";\nimport Collapse from \"@mui/material/Collapse\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport TextField from \"@mui/material/TextField\";\nimport Paper from \"@mui/material/Paper\";\nimport EventIcon from \"@mui/icons-material/Event\";\nimport { DateRangeCalendar } from \"../date-range-calendar\";\n\ntype DateRange = [Date, Date | undefined];\nexport interface DateRangePickerProps {\n label: string;\n defaultValue: DateRange;\n format: string;\n fullWidth?: boolean;\n size?: \"small\" | \"medium\";\n onValueChange: (value: DateRange, index: number) => void;\n}\n\nexport const DateRangePicker = ({\n defaultValue,\n format: fmt,\n label,\n fullWidth,\n onValueChange,\n size = \"medium\",\n}: DateRangePickerProps) => {\n const [isPopoverOpened, setIsPopoverOpened] = useState(false);\n const [value, setValue] = useState(defaultValue);\n\n const handleValueChange = (newValue: DateRange, index: number) => {\n setValue(newValue);\n onValueChange(newValue, index);\n setIsPopoverOpened(index < 1);\n };\n\n return (\n <>\n <TextField\n label={label}\n fullWidth={fullWidth}\n size={size}\n value={`${format(value[0], fmt)} - ${value[1] ? format(value[1], fmt) : fmt.toUpperCase()}`}\n InputProps={{\n endAdornment: (\n <InputAdornment position=\"end\">\n <IconButton onClick={() => setIsPopoverOpened((o) => !o)} aria-label=\"open calendar\">\n <EventIcon />\n </IconButton>\n </InputAdornment>\n ),\n }}\n />\n <Paper>\n <Collapse in={isPopoverOpened} aria-label=\"calendar collapse\">\n <DateRangeCalendar defaultValue={defaultValue} onValueChange={handleValueChange} />\n </Collapse>\n </Paper>\n </>\n );\n};\n"],"names":["CustomPickersDayBackground","styled","Box","shouldForwardProp","prop","theme","dayIsBetween","isFirstDay","isLastDay","borderRadius","backgroundColor","palette","primary","light","margin","borderTopLeftRadius","borderBottomLeftRadius","borderTopRightRadius","borderBottomRightRadius","Day","props","day","dateRange","other","_jsx","PickersDay","start","end","isAfter","isBefore","isSameDay","isStartOfWeek","startOfWeek","isEndOfWeek","endOfWeek","format","role","children","selected","DateRangeCalendar","defaultValue","onValueChange","value","setValue","useState","index","setIndex","setValueRange","newRange","newIndex","DateCalendar","onChange","newValue","undefined","slots","slotProps","DateRangePicker","fmt","label","fullWidth","size","isPopoverOpened","setIsPopoverOpened","_jsxs","_Fragment","TextField","toUpperCase","InputProps","endAdornment","InputAdornment","position","IconButton","onClick","o","EventIcon","Paper","Collapse","in"],"mappings":"4kBAcA,MAAMA,EAA6BC,EAAOC,EAAK,CAC7CC,kBAAoBC,GACT,iBAATA,GACS,eAATA,GACS,cAATA,GACS,kBAATA,GACS,gBAATA,GAN+BH,EAOV,EAAGI,QAAOC,eAAcC,aAAYC,gBACpD,KACAD,GAAcC,GAAaF,IAAiB,CAC/CG,aAAc,EACdC,gBAAiB,GAAGL,EAAMM,QAAQC,QAAQC,UAC1CC,OAAQ,MAENP,GAAc,CAChBQ,oBAAqB,MACrBC,uBAAwB,UAEtBR,GAAa,CACfS,qBAAsB,MACtBC,wBAAyB,WAKzBC,EAAOC,IACX,MAAMC,IAAEA,EAAGC,UAAEA,KAAcC,GAAUH,EAErC,GAAiB,MAAbE,EACF,OAAOE,EAACC,EAAW,CAAAJ,IAAKA,KAASE,IAGnC,MAAOG,EAAOC,GAAOL,EAEfhB,IAAiBqB,GAAOC,EAAQP,EAAKK,IAAUG,EAASR,EAAKM,GAC7DpB,EAAauB,EAAUT,EAAKK,GAC5BlB,IAAcmB,GAAOG,EAAUT,EAAKM,GACpCI,EAAgBD,EAAUT,EAAKW,EAAYX,IAC3CY,EAAcH,EAAUT,EAAKa,EAAUb,IAE7C,OACEG,EAACxB,EAA0B,CACzBM,aAAcA,EACdC,WAAYA,GAAeD,GAAgByB,EAC3CvB,UAAWA,GAAcF,GAAgB2B,EAAY,aACzCE,EAAOd,EAAK,cAAa,gBACtBf,GAAgBC,GAAcC,EAC7C4B,KAAK,WAAUC,SAEfb,EAACC,EAAe,IAAAF,EAAOF,IAAKA,EAAKiB,SAAU/B,GAAcC,KAC9B,EAQpB+B,EAAoB,EAAGC,eAAcC,oBAChD,MAAOC,EAAOC,GAAYC,EAASJ,IAC5BK,EAAOC,GAAYF,EAAS,GAE7BG,EAAgB,CAACC,EAAqBH,EAAeI,KACzDN,EAASK,GACTP,EAAcO,EAAUH,GACxBC,EAASG,EAAS,EAyBpB,OACEzB,EAAC0B,EAAY,CACXR,MAAO,KACPS,SAzBkBC,IACpB,GAAKA,EAKL,OAAc,IAAVP,GAAeO,EAAWV,EAAM,IAKtB,IAAVG,GAAeH,EAAM,IAAMU,EAAWV,EAAM,GAJvCK,EAAc,CAACK,OAAUC,GAAY,EAAG,QASjDN,EACE,CAAW,IAAVF,EAAcO,EAAWV,EAAM,GAAc,IAAVG,EAAcO,EAAWV,EAAM,IACnEG,EACU,IAAVA,EAAc,EAAI,EACnB,EAMCS,MAAO,CAAEjC,IAAKF,GACdoC,UAAW,CACTlC,IAAK,CACHC,UAAWoB,IAGJ,aAAA,yBACX,EC/FOc,EAAkB,EAC7BhB,eACAL,OAAQsB,EACRC,QACAC,YACAlB,gBACAmB,OAAO,aAEP,MAAOC,EAAiBC,GAAsBlB,GAAS,IAChDF,EAAOC,GAAYC,EAASJ,GAQnC,OACEuB,EACEC,EAAA,CAAA3B,SAAA,CAAAb,EAACyC,EAAS,CACRP,MAAOA,EACPC,UAAWA,EACXC,KAAMA,EACNlB,MAAO,GAAGP,EAAOO,EAAM,GAAIe,QAAUf,EAAM,GAAKP,EAAOO,EAAM,GAAIe,GAAOA,EAAIS,gBAC5EC,WAAY,CACVC,aACE5C,EAAC6C,GAAeC,SAAS,MAAKjC,SAC5Bb,EAAC+C,EAAU,CAACC,QAAS,IAAMV,GAAoBW,IAAOA,IAAe,aAAA,yBACnEjD,EAACkD,EAAY,CAAA,UAMvBlD,EAACmD,EAAK,CAAAtC,SACJb,EAACoD,EAAS,CAAAC,GAAIhB,EAA4B,aAAA,oBACxCxB,SAAAb,EAACe,EAAiB,CAACC,aAAcA,EAAcC,cAzB7B,CAACW,EAAqBP,KAC9CF,EAASS,GACTX,EAAcW,EAAUP,GACxBiB,EAAmBjB,EAAQ,EAAE,UAyB1B"}
@@ -5,10 +5,10 @@
5
5
  "module": "./index.js",
6
6
  "types": "./index.d.ts",
7
7
  "dependencies": {
8
- "@mui/icons-material": "^5.11.16",
9
- "@mui/material": "^5.13.6",
10
- "@mui/x-date-pickers": "^6.9.0",
11
- "date-fns": "^2.30.0",
12
- "react": "^18.2.0"
8
+ "@mui/icons-material": "^6.4.5",
9
+ "@mui/material": "^6.4.5",
10
+ "@mui/x-date-pickers": "^7.27.0",
11
+ "date-fns": "^4.1.0",
12
+ "react": "^19.0.0"
13
13
  }
14
14
  }