@oliasoft-open-source/react-ui-library 4.11.0-beta-3 → 4.12.0-beta-1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (166) hide show
  1. package/dist/assets/{index-BpSdrNXy.css → index-BU9wzZv9.css} +336 -336
  2. package/dist/assets/{index-DoFa61ar.js → index-BVCFmQTa.js} +144 -164
  3. package/dist/index.d.ts +2 -6
  4. package/dist/index.html +1 -1
  5. package/dist/index.js +190 -181
  6. package/dist/index.js.map +1 -1
  7. package/dist/storybook/assets/{Color-KGDBMAHA-DeGjmgTY.js → Color-KGDBMAHA-CK3d59Om.js} +1 -1
  8. package/dist/storybook/assets/{DocsRenderer-PKQXORMH-DJIj_qEG.js → DocsRenderer-PKQXORMH-C_QE44cn.js} +1 -1
  9. package/dist/storybook/assets/{accordion.stories-BTxV-ybU.js → accordion.stories-C3VY77Jy.js} +2 -2
  10. package/dist/storybook/assets/{actions-D-uVCDzk.js → actions-Bax0KeqM.js} +2 -2
  11. package/dist/storybook/assets/{actions.stories-gKfuiKQy.js → actions.stories-BnPZKqOJ.js} +1 -1
  12. package/dist/storybook/assets/{afe.stories-DFQsvqIV.js → afe.stories-C9XjJj62.js} +2 -2
  13. package/dist/storybook/assets/{badge.stories-Dkq_XgEW.js → badge.stories-DA_eeQyi.js} +1 -1
  14. package/dist/storybook/assets/{blowout.stories-DHdofVc-.js → blowout.stories-DH-sYHgB.js} +1 -1
  15. package/dist/storybook/assets/button-Cbv7WK6k.js +1 -0
  16. package/dist/storybook/assets/button-DtgxLQCF.css +1 -0
  17. package/dist/storybook/assets/{button-group-1DEZPmxq.js → button-group-D2fGP_bX.js} +1 -1
  18. package/dist/storybook/assets/{button-group.stories-C4V1k0z_.js → button-group.stories-BETADGti.js} +1 -1
  19. package/dist/storybook/assets/{button.stories-DA9DGYD2.js → button.stories-C03VvX8K.js} +1 -1
  20. package/dist/storybook/assets/{buttons-and-links-BHGzZGPV.js → buttons-and-links-FQEbqz9H.js} +1 -1
  21. package/dist/storybook/assets/{casing-loads.stories-CJpnsmsZ.js → casing-loads.stories-B7JIoJVk.js} +2 -2
  22. package/dist/storybook/assets/{cell.stories-Bpl0Squh.js → cell.stories-xZiHEc0P.js} +2 -2
  23. package/dist/storybook/assets/check-box.stories-BJ0ShmeC.js +97 -0
  24. package/dist/storybook/assets/check-box.test-case.stories-CzuYZkUh.js +30 -0
  25. package/dist/storybook/assets/{chunk-HLWAVYOI-D2p4xoma.js → chunk-HLWAVYOI-EhWEisNT.js} +1 -1
  26. package/dist/storybook/assets/{color-D9KYOiNh.js → color-B3dajHjs.js} +1 -1
  27. package/dist/storybook/assets/{dialog-BelCA1mt.js → dialog-DkpQscuI.js} +1 -1
  28. package/dist/storybook/assets/drawer-BVc1xI9q.css +1 -0
  29. package/dist/storybook/assets/drawer-DaQ1xGjV.js +3 -0
  30. package/dist/storybook/assets/{drawer.stories-DcjyDHEs.js → drawer.stories-C08XBVTq.js} +1 -1
  31. package/dist/storybook/assets/{empty.stories-DcwF0pkK.js → empty.stories-L7LSMcLe.js} +1 -1
  32. package/dist/storybook/assets/enum-Bnn40S8Q.js +1 -0
  33. package/dist/storybook/assets/{field.stories-DUGMwi1O.js → field.stories-CYpQ669-.js} +1 -1
  34. package/dist/storybook/assets/{file-button.stories-CU2pZcEO.js → file-button.stories-CRaTdLfv.js} +1 -1
  35. package/dist/storybook/assets/{file-input-B0-ERX66.js → file-input-yalPf7-m.js} +1 -1
  36. package/dist/storybook/assets/{file-input.stories-Cpd1NHbq.js → file-input.stories-DMTQqAF8.js} +1 -1
  37. package/dist/storybook/assets/{flex.stories-BhvJpHpN.js → flex.stories-CLwPyEMp.js} +1 -1
  38. package/dist/storybook/assets/footer.stories-BxzKeFAK.js +3 -0
  39. package/dist/storybook/assets/form.stories-BNORsn6Z.js +49 -0
  40. package/dist/storybook/assets/formation.stories-C5Hkb3iK.js +74 -0
  41. package/dist/storybook/assets/helpers-JJxzGegQ.js +1 -0
  42. package/dist/storybook/assets/iframe-DOUoMheZ.js +2 -0
  43. package/dist/storybook/assets/{index-C0Iaso0O.js → index-AKsHS-dO.js} +4 -4
  44. package/dist/storybook/assets/{index-CNkaN_wz.js → index-KVAIZqzA.js} +1 -1
  45. package/dist/storybook/assets/initialize-context-rEvM6bdZ.js +1 -0
  46. package/dist/storybook/assets/input-Db9WkmPP.js +1 -0
  47. package/dist/storybook/assets/input-Dz1ZZYN5.css +1 -0
  48. package/dist/storybook/assets/{input-group.stories-CElwRt3p.js → input-group.stories-BCajsqAk.js} +3 -3
  49. package/dist/storybook/assets/{input-validation-Ccgprl1C.js → input-validation-BNoUk3q6.js} +2 -2
  50. package/dist/storybook/assets/{input.stories-FKl0qVhm.js → input.stories-SJy3TKkD.js} +1 -1
  51. package/dist/storybook/assets/{inputs-DtQ245kS.js → inputs-Dql6Fq32.js} +2 -2
  52. package/dist/storybook/assets/{layout-forms-Bm7FYA3V.js → layout-forms-DuFo_rwV.js} +5 -5
  53. package/dist/storybook/assets/{layout-general-V7ekuEG7.js → layout-general-C-UddRr1.js} +1 -1
  54. package/dist/storybook/assets/{list-bKpz6I9Q.js → list-By3wp5Wa.js} +1 -1
  55. package/dist/storybook/assets/{list.stories-Cgmt29Wv.js → list.stories-BcDHHHYJ.js} +1 -1
  56. package/dist/storybook/assets/{list.stories-data-D_Aj3AN4.js → list.stories-data-Doo2Rqun.js} +1 -1
  57. package/dist/storybook/assets/{loader.stories-pS8zRM4u.js → loader.stories-Q0U2BqZX.js} +1 -1
  58. package/dist/storybook/assets/menu.stories-1I5AGGQx.js +82 -0
  59. package/dist/storybook/assets/menu.test-case.stories-BFYhvtSH.js +3 -0
  60. package/dist/storybook/assets/message-BRyKdRaX.js +1 -0
  61. package/dist/storybook/assets/message-C2ZCkHX6.css +1 -0
  62. package/dist/storybook/assets/{message.stories-r_UlbshI.js → message.stories-bCqCYIuN.js} +1 -1
  63. package/dist/storybook/assets/meta-content-ByVTG0hd.css +1 -0
  64. package/dist/storybook/assets/meta-content-DNgQbAW0.js +9 -0
  65. package/dist/storybook/assets/modal.stories-C2d-Em5V.js +200 -0
  66. package/dist/storybook/assets/modal.test-case.stories-H8AYyvAl.js +21 -0
  67. package/dist/storybook/assets/{number-input-Bpg4Yqmo.js → number-input-CNnU6gOF.js} +2 -2
  68. package/dist/storybook/assets/number-input.stories-Bo26PJmJ.js +89 -0
  69. package/dist/storybook/assets/number-input.test-case.stories-BBKpBWfA.js +92 -0
  70. package/dist/storybook/assets/{option-dropdown.stories-CIvqMhQ3.js → option-dropdown.stories-CznUbXVi.js} +1 -1
  71. package/dist/storybook/assets/{padding-and-spacing-IKi7rvQ-.js → padding-and-spacing-B9ObVTUS.js} +1 -1
  72. package/dist/storybook/assets/{page.stories-DnCh8h8y.js → page.stories-DthnK8qb.js} +1 -1
  73. package/dist/storybook/assets/{pagination-CLt-kUlx.js → pagination-CR1nxnnq.js} +1 -1
  74. package/dist/storybook/assets/{pagination.stories-CTRM0Xou.js → pagination.stories-qXmBYwYc.js} +2 -2
  75. package/dist/storybook/assets/{pop-confirm.stories-DCpooB2O.js → pop-confirm.stories-CHa0qUBe.js} +1 -1
  76. package/dist/storybook/assets/{popover-rq33c1W2.js → popover-C_2P8LFJ.js} +1 -1
  77. package/dist/storybook/assets/popover.stories-DZTfimDf.js +10 -0
  78. package/dist/storybook/assets/{preview-ZgLLfBPl.js → preview-_21fnvwa.js} +2 -2
  79. package/dist/storybook/assets/{preview-CtQzjqBP.js → preview-dBqj-M8_.js} +1 -1
  80. package/dist/storybook/assets/projects.stories-BPm6ucAe.js +47 -0
  81. package/dist/storybook/assets/{radio-button-DmDuw4DA.js → radio-button-C4ljBRED.js} +1 -1
  82. package/dist/storybook/assets/radio-button.stories-D1rWr6ms.js +61 -0
  83. package/dist/storybook/assets/radio-button.test-case.stories-DglmHlWs.js +11 -0
  84. package/dist/storybook/assets/{reservoirs.stories-B12tIrmZ.js → reservoirs.stories-r1Ip90kJ.js} +2 -2
  85. package/dist/storybook/assets/{rich-text-input-dDjxXFl-.css → rich-text-input-BJfL0Me_.css} +1 -1
  86. package/dist/storybook/assets/{rich-text-input.stories-DkaOBgbE.js → rich-text-input.stories-DwaseXZv.js} +3 -3
  87. package/dist/storybook/assets/{row.stories-msEoNdGI.js → row.stories-BrPMTnKK.js} +2 -2
  88. package/dist/storybook/assets/select-BmYXTl_0.css +1 -0
  89. package/dist/storybook/assets/select-Cwks-WA0.js +61 -0
  90. package/dist/storybook/assets/select.input-CJed_LLR.js +1 -0
  91. package/dist/storybook/assets/select.stories-DjGSNDXK.js +498 -0
  92. package/dist/storybook/assets/select.stories-data-DxgWKlU6.js +1 -0
  93. package/dist/storybook/assets/select.test-case.stories-B6On-PjA.js +82 -0
  94. package/dist/storybook/assets/side-bar-fBbBqyAT.css +1 -0
  95. package/dist/storybook/assets/side-bar-wpFQ5NEE.js +24 -0
  96. package/dist/storybook/assets/{side-bar.stories-M6FsuCrQ.js → side-bar.stories-LjClxJcG.js} +1 -1
  97. package/dist/storybook/assets/{site.stories-umpPYjkq.js → site.stories-BnWmALGd.js} +2 -2
  98. package/dist/storybook/assets/{slider-C7vnj_3M.js → slider-CcpE4BLD.js} +1 -1
  99. package/dist/storybook/assets/{slider.stories-BzBb3PkP.js → slider.stories-BqlRLY_C.js} +1 -1
  100. package/dist/storybook/assets/{smart-upload-modal.stories-xqiXR6jV.js → smart-upload-modal.stories-BlTSF64K.js} +1 -1
  101. package/dist/storybook/assets/{spacer.stories-BBTt2LdE.js → spacer.stories-BT2S6B0R.js} +1 -1
  102. package/dist/storybook/assets/table-BtBtDwPu.css +1 -0
  103. package/dist/storybook/assets/table-iVsvoMpy.js +86 -0
  104. package/dist/storybook/assets/{table.stories-Clltxls0.js → table.stories-DmGMjcFw.js} +2 -2
  105. package/dist/storybook/assets/{table.stories-data-C3vJedB1.js → table.stories-data-C7mC5R8Q.js} +1 -1
  106. package/dist/storybook/assets/{tabs-C3NG6m9W.js → tabs-BoToLVEP.js} +1 -1
  107. package/dist/storybook/assets/tabs.stories-B52iEaHf.js +30 -0
  108. package/dist/storybook/assets/{textarea-D6ltcKhz.js → textarea-DflOOrxV.js} +2 -2
  109. package/dist/storybook/assets/textarea-TqxidmV4.css +1 -0
  110. package/dist/storybook/assets/{textarea.stories-CJ-Oqytp.js → textarea.stories-CzsqRVpC.js} +1 -1
  111. package/dist/storybook/assets/{title.stories-CsrYTGde.js → title.stories-D2LDNgbT.js} +3 -3
  112. package/dist/storybook/assets/{toaster-BoBcvmf9.js → toaster-O8ftrUAJ.js} +1 -1
  113. package/dist/storybook/assets/toaster.stories-CdpwLBSo.js +84 -0
  114. package/dist/storybook/assets/toaster.test-case.stories-BhWnh4Cd.js +6 -0
  115. package/dist/storybook/assets/toggle.stories-BAislK3I.js +106 -0
  116. package/dist/storybook/assets/toggle.test-case.stories-CeUwdhGD.js +36 -0
  117. package/dist/storybook/assets/{tooltip.test-case.stories-CHibN8rC.js → tooltip.test-case.stories-De9h8ThH.js} +1 -1
  118. package/dist/storybook/assets/{top-bar-DkXSzzqt.js → top-bar-Bjf6PQE1.js} +1 -1
  119. package/dist/storybook/assets/{top-bar.stories-HDmWT243.js → top-bar.stories-1hZmlzDT.js} +1 -1
  120. package/dist/storybook/assets/{top-bar.testcase.stories-DfmrkEpT.js → top-bar.testcase.stories-BsFYqaw6.js} +1 -1
  121. package/dist/storybook/assets/{tree.stories-feLUcTtm.js → tree.stories-NGZfmH_B.js} +1 -1
  122. package/dist/storybook/assets/unit-input-Byipu-z0.js +10 -0
  123. package/dist/storybook/assets/unit-input.stories-CChVbxmI.js +198 -0
  124. package/dist/storybook/assets/unit-input.test-case.stories-BwKiucyc.js +220 -0
  125. package/dist/storybook/assets/unit-table.stories-B7rN0MF0.js +152 -0
  126. package/dist/storybook/assets/unit-table.test-case.stories-BIMbgiTz.js +1 -0
  127. package/dist/storybook/iframe.html +1 -1
  128. package/dist/storybook/index.json +1 -1
  129. package/dist/storybook/project.json +1 -1
  130. package/package.json +1 -1
  131. package/dist/storybook/assets/button-DHevvVBE.js +0 -1
  132. package/dist/storybook/assets/button-fAxt_G4d.css +0 -1
  133. package/dist/storybook/assets/check-box.stories-DfbWw6mD.js +0 -126
  134. package/dist/storybook/assets/drawer-DOWJp9T4.js +0 -3
  135. package/dist/storybook/assets/drawer-DhrjYsQu.css +0 -1
  136. package/dist/storybook/assets/footer.stories-DgjDE_JR.js +0 -3
  137. package/dist/storybook/assets/form.stories-BrUnmw7R.js +0 -49
  138. package/dist/storybook/assets/formation.stories-BT8VrcqV.js +0 -74
  139. package/dist/storybook/assets/iframe-B8VgeFPT.js +0 -2
  140. package/dist/storybook/assets/initialize-context-DOqEe1Xq.js +0 -1
  141. package/dist/storybook/assets/input-DD7t4kHm.css +0 -1
  142. package/dist/storybook/assets/input-DTXbDJaL.js +0 -1
  143. package/dist/storybook/assets/menu.stories-xWX80Eh2.js +0 -84
  144. package/dist/storybook/assets/message-Cl3kn7ZD.css +0 -1
  145. package/dist/storybook/assets/message-Y48EomV-.js +0 -1
  146. package/dist/storybook/assets/meta-content-DWZbURV2.js +0 -9
  147. package/dist/storybook/assets/meta-content-DnZPPeTF.css +0 -1
  148. package/dist/storybook/assets/modal.stories-LhoWfDE6.js +0 -220
  149. package/dist/storybook/assets/number-input.stories-DhCjZ37u.js +0 -180
  150. package/dist/storybook/assets/popover.stories-CGm0M5fv.js +0 -10
  151. package/dist/storybook/assets/projects.stories-BQswWVCx.js +0 -47
  152. package/dist/storybook/assets/radio-button.stories-5gvV0LD0.js +0 -71
  153. package/dist/storybook/assets/select-DnRuRG_N.js +0 -61
  154. package/dist/storybook/assets/select-H-9tdhwc.css +0 -1
  155. package/dist/storybook/assets/select.input-D0UkAPd9.js +0 -1
  156. package/dist/storybook/assets/select.stories-B9w9ONzj.js +0 -579
  157. package/dist/storybook/assets/side-bar-CSx5wI-k.js +0 -24
  158. package/dist/storybook/assets/side-bar-auov230-.css +0 -1
  159. package/dist/storybook/assets/table-5Y5KPNSk.js +0 -86
  160. package/dist/storybook/assets/table-B8ojy8Nj.css +0 -1
  161. package/dist/storybook/assets/tabs.stories-dsXjRHJy.js +0 -30
  162. package/dist/storybook/assets/textarea-H-YTEwr8.css +0 -1
  163. package/dist/storybook/assets/toaster.stories-HO4VBTy-.js +0 -89
  164. package/dist/storybook/assets/toggle.stories-qTHFTXxI.js +0 -141
  165. package/dist/storybook/assets/unit-input.stories-QnEpR0rY.js +0 -426
  166. package/dist/storybook/assets/unit-table.stories-BZCc0yfc.js +0 -152
@@ -0,0 +1,200 @@
1
+ import{j as e}from"./jsx-runtime-eps93zm2.js";import{r as h}from"./index-DhsZuJvc.js";import{T as X}from"./common-types-Sih75Sav.js";import{M,D as C}from"./dialog-DkpQscuI.js";import{B as o}from"./button-Cbv7WK6k.js";import{P as Z}from"./popover-C_2P8LFJ.js";import{I as Q}from"./input-Db9WkmPP.js";import{I as $}from"./input-group-BaRSJAEN.js";import{F as j}from"./field-HrLaMLbx.js";import{M as ee}from"./actions-Bax0KeqM.js";import{S as oe}from"./select-Cwks-WA0.js";import{S as le}from"./spacer-BWoNR27H.js";import{T as ne}from"./tooltip-1V7clEnw.js";import{M as k}from"./types-BmbYqTX_.js";import"./index-Bk2sglWO.js";import"./portal-GQ0_cLB6.js";import"./index-CUZDtIZe.js";import"./lodash-c4VUpsOs.js";import"./heading-CRNoBc7q.js";import"./help-icon-Buhx5nl6.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./disabled-context-rmpd7YJS.js";import"./spinner-AWUe4xwQ.js";import"./types-Dx2TtIG9.js";import"./label-CqmyC9he.js";import"./badge-CLQ59MDF.js";import"./enum-Bnn40S8Q.js";import"./assertThisInitialized-B9jnkVVz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./text-B3-TSWok.js";import"./select.input-CJed_LLR.js";import"./helpers-JJxzGegQ.js";const{useArgs:se}=__STORYBOOK_MODULE_PREVIEW_API__,Ke={title:"Modals/Modal",component:M,args:{visible:!0,centered:!0,width:"300px",heading:"Are you sure?",content:e.jsx(e.Fragment,{children:"This will complete the transaction"}),footer:e.jsxs(e.Fragment,{children:[e.jsx(o,{label:"Okay",colored:!0,onClick:()=>{}}),e.jsx(o,{label:"Cancel",onClick:()=>{}})]}),onClose:()=>{}},parameters:{docs:{story:{inline:!1,iframeHeight:400}}}},a=()=>{const[{visible:n,centered:r,...s},l]=se(),t=()=>{l({visible:!n})};return e.jsxs(e.Fragment,{children:[e.jsx(M,{visible:n,centered:r,children:e.jsx(C,{dialog:{...s,onClose:t}})}),e.jsx(o,{label:"Open Modal",onClick:t})]})},v=a.bind({}),i=a.bind({});i.args={centered:!0};const d=a.bind({});d.args={content:["This is a","new line!"]};const c=a.bind({});c.args={scroll:!0,content:e.jsx("div",{children:"Example modal content goes here lorem ipsum. ".repeat(100)})};const g=a.bind({});g.args={width:"100%",content:e.jsx("div",{children:"Example modal content goes here lorem ipsum. ".repeat(100)})};const p=a.bind({});p.args={contentPadding:0};const m=a.bind({});m.args={content:e.jsxs(e.Fragment,{children:[e.jsx(ne,{text:"Tooltip text",children:"Hover for tooltip"}),e.jsx(le,{}),e.jsx(j,{label:"Custom Select",helpText:"Select an animal",children:e.jsx(oe,{name:"example",options:["Aardvarks","Kangaroos","Monkeys","Possums","Gorilla","Puma","Patagonian Mara","Tarsier","Koala","Panda","Red Panda","Impala","Tiger","Crocodile","Bat"],onChange:()=>{},value:"Monkeys",error:"Bad value"})}),e.jsx(j,{label:"Nested Menu",children:e.jsx(ee,{maxHeight:"240px",menu:{label:"Menu",trigger:X.DROP_DOWN_BUTTON,sections:[{type:k.MENU,menu:{trigger:"Text",label:"Children",sections:[...Array(100).keys()].map(()=>({type:"Option",label:Math.random().toString(36).substring(7),onClick:()=>{}}))}},...[...Array(100).keys()].map(()=>({type:k.OPTION,label:Math.random().toString(36).substring(7),onClick:()=>{}}))]}})}),e.jsx(Z,{content:e.jsxs($,{small:!0,children:[e.jsx(Q,{value:"Value",width:"150px",error:"Bad value"}),e.jsx(o,{colored:!0,label:"Save",onClick:()=>{}}),e.jsx(o,{label:"Cancel",onClick:()=>{}})]}),children:e.jsx(o,{colored:!0,label:"Toggle me",onClick:()=>{}})})]})};const u=()=>{const[n,r]=h.useState(!1),s=()=>{r(!0)},l=()=>{r(!1)},t=()=>{console.log("Submit action"),l()};return e.jsxs(e.Fragment,{children:[e.jsx(M,{visible:n,onEnter:()=>{console.log("Enter"),t()},onEscape:()=>{console.log("Escape"),l()},children:e.jsx(C,{dialog:{heading:"Test key handling",content:e.jsx(Q,{}),footer:e.jsxs(e.Fragment,{children:[e.jsx(o,{label:"Done",colored:"red",onClick:t}),e.jsx(o,{label:"Cancel",onClick:l})]}),onClose:l}})}),e.jsx(o,{label:"Open Modal",onClick:s})]})},b=()=>{const[n,r]=h.useState(!1),s=()=>r(!n),[l,t]=h.useState(!1),x=()=>t(!l);return e.jsxs(e.Fragment,{children:[e.jsx(M,{visible:n,children:e.jsx(C,{dialog:{heading:"Modal 1",content:"Lorem ipsum dolor sit amet",footer:e.jsxs(e.Fragment,{children:[e.jsx(o,{label:"Open modal 2",colored:!0,onClick:x}),e.jsx(M,{visible:l,children:e.jsx(C,{dialog:{heading:"Modal 2",content:"Lorem ipsum dolor sit amet",footer:e.jsx(o,{label:"Close",onClick:x}),onClose:x}})}),e.jsx(o,{label:"Close",onClick:s})]}),onClose:s}})}),e.jsx(o,{label:"Open modal 1",onClick:s})]})};u.__docgenInfo={description:"",methods:[],displayName:"KeyHandle"};b.__docgenInfo={description:"",methods:[],displayName:"MultipleModals"};var f,S,P;v.parameters={...v.parameters,docs:{...(f=v.parameters)==null?void 0:f.docs,source:{originalSource:`() => {
2
+ const [{
3
+ visible,
4
+ centered,
5
+ ...dialogProps
6
+ }, updateArgs] = useArgs();
7
+ const toggleModal = () => {
8
+ updateArgs({
9
+ visible: !visible
10
+ });
11
+ };
12
+ return <>
13
+ <Modal visible={visible} centered={centered}>
14
+ <Dialog dialog={{
15
+ ...dialogProps,
16
+ onClose: toggleModal
17
+ }} />
18
+ </Modal>
19
+ <Button label="Open Modal" onClick={toggleModal} />
20
+ </>;
21
+ }`,...(P=(S=v.parameters)==null?void 0:S.docs)==null?void 0:P.source}}};var A,O,y;i.parameters={...i.parameters,docs:{...(A=i.parameters)==null?void 0:A.docs,source:{originalSource:`() => {
22
+ const [{
23
+ visible,
24
+ centered,
25
+ ...dialogProps
26
+ }, updateArgs] = useArgs();
27
+ const toggleModal = () => {
28
+ updateArgs({
29
+ visible: !visible
30
+ });
31
+ };
32
+ return <>
33
+ <Modal visible={visible} centered={centered}>
34
+ <Dialog dialog={{
35
+ ...dialogProps,
36
+ onClose: toggleModal
37
+ }} />
38
+ </Modal>
39
+ <Button label="Open Modal" onClick={toggleModal} />
40
+ </>;
41
+ }`,...(y=(O=i.parameters)==null?void 0:O.docs)==null?void 0:y.source}}};var B,V,T;d.parameters={...d.parameters,docs:{...(B=d.parameters)==null?void 0:B.docs,source:{originalSource:`() => {
42
+ const [{
43
+ visible,
44
+ centered,
45
+ ...dialogProps
46
+ }, updateArgs] = useArgs();
47
+ const toggleModal = () => {
48
+ updateArgs({
49
+ visible: !visible
50
+ });
51
+ };
52
+ return <>
53
+ <Modal visible={visible} centered={centered}>
54
+ <Dialog dialog={{
55
+ ...dialogProps,
56
+ onClose: toggleModal
57
+ }} />
58
+ </Modal>
59
+ <Button label="Open Modal" onClick={toggleModal} />
60
+ </>;
61
+ }`,...(T=(V=d.parameters)==null?void 0:V.docs)==null?void 0:T.source}}};var D,E,_;c.parameters={...c.parameters,docs:{...(D=c.parameters)==null?void 0:D.docs,source:{originalSource:`() => {
62
+ const [{
63
+ visible,
64
+ centered,
65
+ ...dialogProps
66
+ }, updateArgs] = useArgs();
67
+ const toggleModal = () => {
68
+ updateArgs({
69
+ visible: !visible
70
+ });
71
+ };
72
+ return <>
73
+ <Modal visible={visible} centered={centered}>
74
+ <Dialog dialog={{
75
+ ...dialogProps,
76
+ onClose: toggleModal
77
+ }} />
78
+ </Modal>
79
+ <Button label="Open Modal" onClick={toggleModal} />
80
+ </>;
81
+ }`,...(_=(E=c.parameters)==null?void 0:E.docs)==null?void 0:_.source}}};var F,I,L;g.parameters={...g.parameters,docs:{...(F=g.parameters)==null?void 0:F.docs,source:{originalSource:`() => {
82
+ const [{
83
+ visible,
84
+ centered,
85
+ ...dialogProps
86
+ }, updateArgs] = useArgs();
87
+ const toggleModal = () => {
88
+ updateArgs({
89
+ visible: !visible
90
+ });
91
+ };
92
+ return <>
93
+ <Modal visible={visible} centered={centered}>
94
+ <Dialog dialog={{
95
+ ...dialogProps,
96
+ onClose: toggleModal
97
+ }} />
98
+ </Modal>
99
+ <Button label="Open Modal" onClick={toggleModal} />
100
+ </>;
101
+ }`,...(L=(I=g.parameters)==null?void 0:I.docs)==null?void 0:L.source}}};var N,H,K;p.parameters={...p.parameters,docs:{...(N=p.parameters)==null?void 0:N.docs,source:{originalSource:`() => {
102
+ const [{
103
+ visible,
104
+ centered,
105
+ ...dialogProps
106
+ }, updateArgs] = useArgs();
107
+ const toggleModal = () => {
108
+ updateArgs({
109
+ visible: !visible
110
+ });
111
+ };
112
+ return <>
113
+ <Modal visible={visible} centered={centered}>
114
+ <Dialog dialog={{
115
+ ...dialogProps,
116
+ onClose: toggleModal
117
+ }} />
118
+ </Modal>
119
+ <Button label="Open Modal" onClick={toggleModal} />
120
+ </>;
121
+ }`,...(K=(H=p.parameters)==null?void 0:H.docs)==null?void 0:K.source}}};var W,w,R;m.parameters={...m.parameters,docs:{...(W=m.parameters)==null?void 0:W.docs,source:{originalSource:`() => {
122
+ const [{
123
+ visible,
124
+ centered,
125
+ ...dialogProps
126
+ }, updateArgs] = useArgs();
127
+ const toggleModal = () => {
128
+ updateArgs({
129
+ visible: !visible
130
+ });
131
+ };
132
+ return <>
133
+ <Modal visible={visible} centered={centered}>
134
+ <Dialog dialog={{
135
+ ...dialogProps,
136
+ onClose: toggleModal
137
+ }} />
138
+ </Modal>
139
+ <Button label="Open Modal" onClick={toggleModal} />
140
+ </>;
141
+ }`,...(R=(w=m.parameters)==null?void 0:w.docs)==null?void 0:R.source}}};var U,G,Y;u.parameters={...u.parameters,docs:{...(U=u.parameters)==null?void 0:U.docs,source:{originalSource:`() => {
142
+ const [visible, setVisible] = useState(false);
143
+ const openModal = () => {
144
+ setVisible(true);
145
+ };
146
+ const closeModal = () => {
147
+ setVisible(false);
148
+ };
149
+ const handleSubmit = () => {
150
+ console.log('Submit action');
151
+ closeModal();
152
+ };
153
+ return <>
154
+ <Modal visible={visible} onEnter={() => {
155
+ console.log('Enter');
156
+ handleSubmit();
157
+ }} onEscape={() => {
158
+ console.log('Escape');
159
+ closeModal();
160
+ }}>
161
+ <Dialog dialog={{
162
+ heading: 'Test key handling',
163
+ content: <Input />,
164
+ footer: <>
165
+ <Button label="Done" colored="red" onClick={handleSubmit} />
166
+ <Button label="Cancel" onClick={closeModal} />
167
+ </>,
168
+ onClose: closeModal
169
+ }} />
170
+ </Modal>
171
+ <Button label="Open Modal" onClick={openModal} />
172
+ </>;
173
+ }`,...(Y=(G=u.parameters)==null?void 0:G.docs)==null?void 0:Y.source}}};var q,z,J;b.parameters={...b.parameters,docs:{...(q=b.parameters)==null?void 0:q.docs,source:{originalSource:`() => {
174
+ const [visible1, setVisible1] = useState(false);
175
+ const toggleVisible1 = () => setVisible1(!visible1);
176
+ const [visible2, setVisible2] = useState(false);
177
+ const toggleVisible2 = () => setVisible2(!visible2);
178
+ return <>
179
+ <Modal visible={visible1}>
180
+ <Dialog dialog={{
181
+ heading: 'Modal 1',
182
+ content: 'Lorem ipsum dolor sit amet',
183
+ footer: <>
184
+ <Button label="Open modal 2" colored onClick={toggleVisible2} />
185
+ <Modal visible={visible2}>
186
+ <Dialog dialog={{
187
+ heading: 'Modal 2',
188
+ content: 'Lorem ipsum dolor sit amet',
189
+ footer: <Button label="Close" onClick={toggleVisible2} />,
190
+ onClose: toggleVisible2
191
+ }} />
192
+ </Modal>
193
+ <Button label="Close" onClick={toggleVisible1} />
194
+ </>,
195
+ onClose: toggleVisible1
196
+ }} />
197
+ </Modal>
198
+ <Button label="Open modal 1" onClick={toggleVisible1} />
199
+ </>;
200
+ }`,...(J=(z=b.parameters)==null?void 0:z.docs)==null?void 0:J.source}}};const We=["Default","Centered","LineBreak","Scroll","FullWidth","NoContentPadding","WithPopoverLayers","KeyHandle","MultipleModals"];export{i as Centered,v as Default,g as FullWidth,u as KeyHandle,d as LineBreak,b as MultipleModals,p as NoContentPadding,c as Scroll,m as WithPopoverLayers,We as __namedExportsOrder,Ke as default};
@@ -0,0 +1,21 @@
1
+ import{j as e}from"./jsx-runtime-eps93zm2.js";import{w as u,e as i,u as d}from"./index-DMAnyMX5.js";import{M as g,D as h}from"./dialog-DkpQscuI.js";import{B as l}from"./button-Cbv7WK6k.js";import"./index-DhsZuJvc.js";import"./index-CF7H4eMJ.js";import"./index-Bk2sglWO.js";import"./portal-GQ0_cLB6.js";import"./index-CUZDtIZe.js";import"./lodash-c4VUpsOs.js";import"./common-types-Sih75Sav.js";import"./heading-CRNoBc7q.js";import"./help-icon-Buhx5nl6.js";import"./tooltip-1V7clEnw.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./disabled-context-rmpd7YJS.js";import"./spinner-AWUe4xwQ.js";const{useArgs:M}=__STORYBOOK_MODULE_PREVIEW_API__,H={title:"Modals/Modal/Test Cases",component:g,args:{visible:!0,centered:!0,width:"300px",heading:"Are you sure?",content:e.jsx(e.Fragment,{children:"This will complete the transaction"}),footer:e.jsxs(e.Fragment,{children:[e.jsx(l,{label:"Okay",colored:!0,onClick:()=>{}}),e.jsx(l,{label:"Cancel",onClick:()=>{}})]}),onClose:()=>{}},parameters:{docs:{story:{inline:!1,iframeHeight:400}}},tags:["!autodocs"]},x=()=>{const[{visible:a,centered:n,...t},r]=M(),o=()=>{r({visible:!a})};return e.jsxs(e.Fragment,{children:[e.jsx(g,{visible:a,centered:n,children:e.jsx(h,{dialog:{...t,onClose:o}})}),e.jsx(l,{label:"Open Modal",onClick:o})]})},s=x.bind({});s.args={testId:"testId"};s.play=async({canvasElement:a,step:n})=>{const t=a.parentElement?u(a.parentElement):null;await i(t).toBeTruthy(),t&&(await n("Modal should appear when triggered",async()=>{const r=t.getByText("Open Modal");await d.click(r);const o=t.getByTestId("testId");await i(o).toBeInTheDocument()}),await n("Modal should disappear when close button pressed",async()=>{const r=t.getByTestId("testId"),o=t.getByTestId("testId-dismiss");await d.click(o),await i(r).not.toBeInTheDocument()}))};var c,p,m;s.parameters={...s.parameters,docs:{...(c=s.parameters)==null?void 0:c.docs,source:{originalSource:`() => {
2
+ const [{
3
+ visible,
4
+ centered,
5
+ ...dialogProps
6
+ }, updateArgs] = useArgs();
7
+ const toggleModal = () => {
8
+ updateArgs({
9
+ visible: !visible
10
+ });
11
+ };
12
+ return <>
13
+ <Modal visible={visible} centered={centered}>
14
+ <Dialog dialog={{
15
+ ...dialogProps,
16
+ onClose: toggleModal
17
+ }} />
18
+ </Modal>
19
+ <Button label="Open Modal" onClick={toggleModal} />
20
+ </>;
21
+ }`,...(m=(p=s.parameters)==null?void 0:p.docs)==null?void 0:m.source}}};const K=["Test"];export{s as Test,K as __namedExportsOrder,H as default};
@@ -1,4 +1,4 @@
1
- import{j as R}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJvc.js";import{d as a}from"./index-C0x1JmaP.js";import{K as J,E as Q}from"./select-DnRuRG_N.js";import{l as X}from"./lodash-c4VUpsOs.js";import{i as S}from"./select.input-D0UkAPd9.js";import{I as Y}from"./input-DTXbDJaL.js";const $=14,s=n=>String(a.toString(n)),ee=n=>a.isScientificStringNum(n)?n:s(a.roundToPrecision(a.toNum(n),$)),ne=n=>n?typeof n=="string"?n:X.isArray(n)?n[0]:n.fieldName:"",te=({name:n,placeholder:p="",disabled:C=!1,error:E=!1,left:L=!1,small:k=!1,width:x="100%",value:c="",onChange:j=()=>{},onFocus:M=()=>{},onBlur:O=()=>{},tabIndex:H=0,testId:K,tooltip:P=null,warning:_=!1,validationCallback:w=()=>{},allowEmpty:A=!1,isInTable:D,groupOrder:W,enableCosmeticRounding:N=!0,enableDisplayRounding:g=!1,roundDisplayValue:q,disableInternalErrorValidationMessages:B=!1})=>{const y=e=>{const t=a.validateNumber(e);return p&&S(e)?{valid:!0,errors:[]}:A&&e===""||t.valid?{...t,valid:!0,errors:void 0}:t},h=e=>{var d;const t=!!(e!=null&&e.endsWith("0")),f=N&&e&&!t&&((d=y(e))==null?void 0:d.valid)?ee(e):e;return s(f)},i=l.useRef(null),[r,V]=l.useState(h(s(c))),[u,I]=l.useState(!1),o=ne(n),{valid:v,errors:T}=y(r),F=T&&T.length&&!B?T[0]:null;l.useEffect(()=>{const e=h(s(c));a.toNum(r)!==a.toNum(e)&&V(e)},[c,N,g]),l.useEffect(()=>{!u&&!v?w(o,F):w(o,null)},[u,v,E]);const b=e=>{var f,d;const t=e instanceof KeyboardEvent?r:(f=e==null?void 0:e.target)==null?void 0:f.value,m=a.cleanNumStr(t.replaceAll(" ","").replaceAll("|",""));if(V(m),(d=y(m))!=null&&d.valid||p&&S(t)){const z={...e,target:{...e.target,value:a.stripLeadingZeros(s(m)),name:o}};j(z)}};l.useEffect(()=>{if(i&&(i!=null&&i.current)&&g&&u){const e=i.current;e&&setTimeout(()=>{const{length:t}=s(r);e.setSelectionRange(t,t)},0)}},[u]);const U=e=>{I(!0),M(e)},Z=e=>{I(!1),b(e),O(e)},G=g&&!u&&v?q?s(q(r)):a.roundToFixed(r,2):r;return R.jsx(J,{handleKeys:[Q.ENTER],onKeyEvent:(e,t)=>b(t),children:R.jsx(Y,{type:"text",name:o,testId:K,disabled:C,placeholder:p,value:G,onChange:b,onFocus:U,onBlur:Z,error:F||E,warning:_,right:!L,small:k,width:x,isInTable:D,groupOrder:W,tabIndex:H,tooltip:P,ref:i},o)})};te.__docgenInfo={description:"",methods:[],displayName:"NumberInput",props:{name:{required:!1,tsType:{name:"union",raw:"string | { fieldName: string }",elements:[{name:"string"},{name:"signature",type:"object",raw:"{ fieldName: string }",signature:{properties:[{key:"fieldName",value:{name:"string",required:!0}}]}}]},description:""},placeholder:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"''",computed:!1}},disabled:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},error:{required:!1,tsType:{name:"union",raw:"string | boolean",elements:[{name:"string"},{name:"boolean"}]},description:"",defaultValue:{value:"false",computed:!1}},left:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},small:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},width:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"'100%'",computed:!1}},value:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"''",computed:!1}},onChange:{required:!1,tsType:{name:"signature",type:"function",raw:`(
1
+ import{j as R}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJvc.js";import{d as a}from"./index-C0x1JmaP.js";import{K as J,E as Q}from"./enum-Bnn40S8Q.js";import{l as X}from"./lodash-c4VUpsOs.js";import{i as S}from"./helpers-JJxzGegQ.js";import{I as Y}from"./input-Db9WkmPP.js";const $=14,s=n=>String(a.toString(n)),ee=n=>a.isScientificStringNum(n)?n:s(a.roundToPrecision(a.toNum(n),$)),ne=n=>n?typeof n=="string"?n:X.isArray(n)?n[0]:n.fieldName:"",te=({name:n,placeholder:p="",disabled:C=!1,error:b=!1,left:L=!1,small:k=!1,width:x="100%",value:c="",onChange:j=()=>{},onFocus:M=()=>{},onBlur:O=()=>{},tabIndex:H=0,testId:K,tooltip:P=null,warning:_=!1,validationCallback:E=()=>{},allowEmpty:A=!1,isInTable:D,groupOrder:W,enableCosmeticRounding:w=!0,enableDisplayRounding:g=!1,roundDisplayValue:N,disableInternalErrorValidationMessages:B=!1})=>{const y=e=>{const t=a.validateNumber(e);return p&&S(e)?{valid:!0,errors:[]}:A&&e===""||t.valid?{...t,valid:!0,errors:void 0}:t},q=e=>{var d;const t=!!(e!=null&&e.endsWith("0")),f=w&&e&&!t&&((d=y(e))==null?void 0:d.valid)?ee(e):e;return s(f)},i=l.useRef(null),[r,h]=l.useState(q(s(c))),[u,V]=l.useState(!1),o=ne(n),{valid:v,errors:T}=y(r),I=T&&T.length&&!B?T[0]:null;l.useEffect(()=>{const e=q(s(c));a.toNum(r)!==a.toNum(e)&&h(e)},[c,w,g]),l.useEffect(()=>{!u&&!v?E(o,I):E(o,null)},[u,v,b]);const F=e=>{var f,d;const t=e instanceof KeyboardEvent?r:(f=e==null?void 0:e.target)==null?void 0:f.value,m=a.cleanNumStr(t.replaceAll(" ","").replaceAll("|",""));if(h(m),(d=y(m))!=null&&d.valid||p&&S(t)){const z={...e,target:{...e.target,value:a.stripLeadingZeros(s(m)),name:o}};j(z)}};l.useEffect(()=>{if(i&&(i!=null&&i.current)&&g&&u){const e=i.current;e&&setTimeout(()=>{const{length:t}=s(r);e.setSelectionRange(t,t)},0)}},[u]);const U=e=>{V(!0),M(e)},Z=e=>{V(!1),O(e)},G=g&&!u&&v?N?s(N(r)):a.roundToFixed(r,2):r;return R.jsx(J,{handleKeys:[Q.ENTER],onKeyEvent:(e,t)=>F(t),children:R.jsx(Y,{type:"text",name:o,testId:K,disabled:C,placeholder:p,value:G,onChange:F,onFocus:U,onBlur:Z,error:I||b,warning:_,right:!L,small:k,width:x,isInTable:D,groupOrder:W,tabIndex:H,tooltip:P,ref:i},o)})};te.__docgenInfo={description:"",methods:[],displayName:"NumberInput",props:{name:{required:!1,tsType:{name:"union",raw:"string | { fieldName: string }",elements:[{name:"string"},{name:"signature",type:"object",raw:"{ fieldName: string }",signature:{properties:[{key:"fieldName",value:{name:"string",required:!0}}]}}]},description:""},placeholder:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"''",computed:!1}},disabled:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},error:{required:!1,tsType:{name:"union",raw:"string | boolean",elements:[{name:"string"},{name:"boolean"}]},description:"",defaultValue:{value:"false",computed:!1}},left:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},small:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},width:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"'100%'",computed:!1}},value:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"''",computed:!1}},onChange:{required:!1,tsType:{name:"signature",type:"function",raw:`(
2
2
  event: TChangeEvent<T>,
3
3
  ...additionalProps: { [key: string]: any }[]
4
4
  ) => void`,signature:{arguments:[{type:{name:"intersection",raw:`ChangeEvent<T> & {
@@ -13,4 +13,4 @@ import{j as R}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJv
13
13
  | { name: string; value: any; label?: string; files?: FileList | null }`,elements:[{name:"T"},{name:"signature",type:"object",raw:"{ name: string; value: any; label?: string; files?: FileList | null }",signature:{properties:[{key:"name",value:{name:"string",required:!0}},{key:"value",value:{name:"any",required:!0}},{key:"label",value:{name:"string",required:!1}},{key:"files",value:{name:"union",raw:"FileList | null",elements:[{name:"FileList"},{name:"null"}],required:!1}}]}}],required:!0}}]}}]},name:"event"},{type:{name:"Array",elements:[{name:"signature",type:"object",raw:"{ [key: string]: any }",signature:{properties:[{key:{name:"string"},value:{name:"any",required:!0}}]}}],raw:"{ [key: string]: any }[]"},name:"additionalProps",rest:!0}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},onFocus:{required:!1,tsType:{name:"signature",type:"function",raw:"(evt: FocusEvent<HTMLInputElement>) => void",signature:{arguments:[{type:{name:"FocusEvent",elements:[{name:"HTMLInputElement"}],raw:"FocusEvent<HTMLInputElement>"},name:"evt"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},onBlur:{required:!1,tsType:{name:"signature",type:"function",raw:"(evt: FocusEvent<HTMLInputElement>) => void",signature:{arguments:[{type:{name:"FocusEvent",elements:[{name:"HTMLInputElement"}],raw:"FocusEvent<HTMLInputElement>"},name:"evt"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},tabIndex:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"0",computed:!1}},testId:{required:!1,tsType:{name:"string"},description:""},tooltip:{required:!1,tsType:{name:"union",raw:"TStringOrNumber | React.ReactNode",elements:[{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},{name:"ReactReactNode",raw:"React.ReactNode"}]},description:"",defaultValue:{value:"null",computed:!1}},warning:{required:!1,tsType:{name:"union",raw:"string | boolean",elements:[{name:"string"},{name:"boolean"}]},description:"",defaultValue:{value:"false",computed:!1}},validationCallback:{required:!1,tsType:{name:"signature",type:"function",raw:`(
14
14
  name: string | { fieldName: string },
15
15
  error: string | null,
16
- ) => void`,signature:{arguments:[{type:{name:"union",raw:"string | { fieldName: string }",elements:[{name:"string"},{name:"signature",type:"object",raw:"{ fieldName: string }",signature:{properties:[{key:"fieldName",value:{name:"string",required:!0}}]}}]},name:"name"},{type:{name:"union",raw:"string | null",elements:[{name:"string"},{name:"null"}]},name:"error"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},allowEmpty:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},isInTable:{required:!1,tsType:{name:"boolean"},description:""},groupOrder:{required:!1,tsType:{name:"any"},description:""},enableCosmeticRounding:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}},enableDisplayRounding:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},roundDisplayValue:{required:!1,tsType:{name:"signature",type:"function",raw:"(args: TStringOrNumber) => TStringOrNumber",signature:{arguments:[{type:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},name:"args"}],return:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]}}},description:""},disableInternalErrorValidationMessages:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}}}};export{te as N,ee as r};
16
+ ) => void`,signature:{arguments:[{type:{name:"union",raw:"string | { fieldName: string }",elements:[{name:"string"},{name:"signature",type:"object",raw:"{ fieldName: string }",signature:{properties:[{key:"fieldName",value:{name:"string",required:!0}}]}}]},name:"name"},{type:{name:"union",raw:"string | null",elements:[{name:"string"},{name:"null"}]},name:"error"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},allowEmpty:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},isInTable:{required:!1,tsType:{name:"boolean"},description:""},groupOrder:{required:!1,tsType:{name:"any"},description:""},enableCosmeticRounding:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}},enableDisplayRounding:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},roundDisplayValue:{required:!1,tsType:{name:"signature",type:"function",raw:"(args: TStringOrNumber) => TStringOrNumber",signature:{arguments:[{type:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},name:"args"}],return:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]}}},description:""},disableInternalErrorValidationMessages:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}}}};export{te as N,ee as r,s};
@@ -0,0 +1,89 @@
1
+ import{j as Q}from"./jsx-runtime-eps93zm2.js";import{d as X}from"./index-C0x1JmaP.js";import{N as q}from"./number-input-CNnU6gOF.js";import"./index-DhsZuJvc.js";import"./index-DRSy5Ssd.js";import"./enum-Bnn40S8Q.js";import"./index-CEuq6vkz.js";import"./lodash-c4VUpsOs.js";import"./helpers-JJxzGegQ.js";import"./input-Db9WkmPP.js";import"./index-Bk2sglWO.js";import"./disabled-context-rmpd7YJS.js";import"./types-Dx2TtIG9.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";const{useArgs:Z}=__STORYBOOK_MODULE_PREVIEW_API__,he={title:"Forms/NumberInput",component:q,parameters:{canvas:{page:null}},args:{label:"Label"}},e=c=>{const[$,z]=Z(),G=J=>{z({value:J.target.value})};return Q.jsx(q,{onChange:G,value:123,...c})},d=e.bind({}),n=e.bind({});n.args={small:!0};const a=e.bind({});a.args={width:"150px"};const r=e.bind({});r.args={left:!0};const t=e.bind({});t.args={disabled:!0};const s=e.bind({});s.args={allowEmpty:!0,value:""};const u=e.bind({});u.args={warning:"This input number is almost 100!",value:"99"};const o=e.bind({});o.args={error:"This is a error message"};const g=e.bind({});g.args={value:"123test"};const p=e.bind({});p.args={value:"123.123456789",enableDisplayRounding:!0};const l=e.bind({});l.args={value:"123.123456789",enableDisplayRounding:!0,roundDisplayValue:c=>X.roundToFixed(c,4)};var m,i,h;d.parameters={...d.parameters,docs:{...(m=d.parameters)==null?void 0:m.docs,source:{originalSource:`args => {
2
+ const [_, updateArgs] = useArgs();
3
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
4
+ updateArgs({
5
+ value: evt.target.value
6
+ });
7
+ };
8
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
9
+ }`,...(h=(i=d.parameters)==null?void 0:i.docs)==null?void 0:h.source}}};var v,C,A;n.parameters={...n.parameters,docs:{...(v=n.parameters)==null?void 0:v.docs,source:{originalSource:`args => {
10
+ const [_, updateArgs] = useArgs();
11
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
12
+ updateArgs({
13
+ value: evt.target.value
14
+ });
15
+ };
16
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
17
+ }`,...(A=(C=n.parameters)==null?void 0:C.docs)==null?void 0:A.source}}};var b,E,I;a.parameters={...a.parameters,docs:{...(b=a.parameters)==null?void 0:b.docs,source:{originalSource:`args => {
18
+ const [_, updateArgs] = useArgs();
19
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
20
+ updateArgs({
21
+ value: evt.target.value
22
+ });
23
+ };
24
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
25
+ }`,...(I=(E=a.parameters)==null?void 0:E.docs)==null?void 0:I.source}}};var _,T,L;r.parameters={...r.parameters,docs:{...(_=r.parameters)==null?void 0:_.docs,source:{originalSource:`args => {
26
+ const [_, updateArgs] = useArgs();
27
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
28
+ updateArgs({
29
+ value: evt.target.value
30
+ });
31
+ };
32
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
33
+ }`,...(L=(T=r.parameters)==null?void 0:T.docs)==null?void 0:L.source}}};var N,S,D;t.parameters={...t.parameters,docs:{...(N=t.parameters)==null?void 0:N.docs,source:{originalSource:`args => {
34
+ const [_, updateArgs] = useArgs();
35
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
36
+ updateArgs({
37
+ value: evt.target.value
38
+ });
39
+ };
40
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
41
+ }`,...(D=(S=t.parameters)==null?void 0:S.docs)==null?void 0:D.source}}};var M,H,y;s.parameters={...s.parameters,docs:{...(M=s.parameters)==null?void 0:M.docs,source:{originalSource:`args => {
42
+ const [_, updateArgs] = useArgs();
43
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
44
+ updateArgs({
45
+ value: evt.target.value
46
+ });
47
+ };
48
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
49
+ }`,...(y=(H=s.parameters)==null?void 0:H.docs)==null?void 0:y.source}}};var f,R,W;u.parameters={...u.parameters,docs:{...(f=u.parameters)==null?void 0:f.docs,source:{originalSource:`args => {
50
+ const [_, updateArgs] = useArgs();
51
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
52
+ updateArgs({
53
+ value: evt.target.value
54
+ });
55
+ };
56
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
57
+ }`,...(W=(R=u.parameters)==null?void 0:R.docs)==null?void 0:W.source}}};var x,w,O;o.parameters={...o.parameters,docs:{...(x=o.parameters)==null?void 0:x.docs,source:{originalSource:`args => {
58
+ const [_, updateArgs] = useArgs();
59
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
60
+ updateArgs({
61
+ value: evt.target.value
62
+ });
63
+ };
64
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
65
+ }`,...(O=(w=o.parameters)==null?void 0:w.docs)==null?void 0:O.source}}};var j,B,F;g.parameters={...g.parameters,docs:{...(j=g.parameters)==null?void 0:j.docs,source:{originalSource:`args => {
66
+ const [_, updateArgs] = useArgs();
67
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
68
+ updateArgs({
69
+ value: evt.target.value
70
+ });
71
+ };
72
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
73
+ }`,...(F=(B=g.parameters)==null?void 0:B.docs)==null?void 0:F.source}}};var P,V,K;p.parameters={...p.parameters,docs:{...(P=p.parameters)==null?void 0:P.docs,source:{originalSource:`args => {
74
+ const [_, updateArgs] = useArgs();
75
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
76
+ updateArgs({
77
+ value: evt.target.value
78
+ });
79
+ };
80
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
81
+ }`,...(K=(V=p.parameters)==null?void 0:V.docs)==null?void 0:K.source}}};var U,Y,k;l.parameters={...l.parameters,docs:{...(U=l.parameters)==null?void 0:U.docs,source:{originalSource:`args => {
82
+ const [_, updateArgs] = useArgs();
83
+ const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {
84
+ updateArgs({
85
+ value: evt.target.value
86
+ });
87
+ };
88
+ return <NumberInput onChange={handleChange} value={123} {...args} />;
89
+ }`,...(k=(Y=l.parameters)==null?void 0:Y.docs)==null?void 0:k.source}}};const ve=["Default","Small","Width","Left","Disabled","AllowEmpty","Warning","Error","BadInput","WithDisplayRounding","WithCustomDisplayRounding"];export{s as AllowEmpty,g as BadInput,d as Default,t as Disabled,o as Error,r as Left,n as Small,u as Warning,a as Width,l as WithCustomDisplayRounding,p as WithDisplayRounding,ve as __namedExportsOrder,he as default};
@@ -0,0 +1,92 @@
1
+ import{j as a}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJvc.js";import{w as c,u as n,e as o,f as B,a as C}from"./index-DMAnyMX5.js";import{S as x}from"./spacer-BWoNR27H.js";import{G as K}from"./grid-DRkC-bt8.js";import{C as m}from"./card-EcjmryU9.js";import{B as Q}from"./button-Cbv7WK6k.js";import{H as p}from"./heading-CRNoBc7q.js";import{I as ee}from"./input-group-addon-D68iUKV2.js";import{S as te}from"./select-Cwks-WA0.js";import{I as ae}from"./input-group-BaRSJAEN.js";import{F as V}from"./field-HrLaMLbx.js";import{T as R}from"./toggle-BbFVf61v.js";import{T as ne}from"./text-B3-TSWok.js";import{M as se}from"./message-BRyKdRaX.js";import{I as X}from"./icon-BSFY3vDO.js";import{N as u}from"./number-input-CNnU6gOF.js";import"./index-CF7H4eMJ.js";import"./styled-components.browser.esm-BQ9GQzDc.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./spinner-AWUe4xwQ.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./help-icon-Buhx5nl6.js";import"./lodash-c4VUpsOs.js";import"./types-Dx2TtIG9.js";import"./enum-Bnn40S8Q.js";import"./index-CEuq6vkz.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./types-BmbYqTX_.js";import"./actions-Bax0KeqM.js";import"./badge-CLQ59MDF.js";import"./select.input-CJed_LLR.js";import"./helpers-JJxzGegQ.js";import"./label-CqmyC9he.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./index-C0x1JmaP.js";import"./index-DRSy5Ssd.js";import"./input-Db9WkmPP.js";const Ke={title:"Forms/NumberInput/Test Cases",component:u,parameters:{canvas:{page:null}},args:{label:"Label"},tags:["!autodocs"]},v=()=>a.jsxs(ae,{small:!0,children:[a.jsx(u,{value:123}),a.jsx(ee,{children:"to"}),a.jsx(u,{value:123}),a.jsx(te,{options:[{value:"units",label:"units"}],width:"auto",value:"units"})]}),g=()=>{const[r,s]=l.useState("123|m");return a.jsx(u,{name:"example",onChange:t=>s(t.target.value),placeholder:"Type a value...",value:r,testId:"testId"})};g.play=async({canvasElement:r,step:s})=>{const t=c(r),i=c(r.ownerDocument.body);await s("Shows validation error for non-numeric input",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123x45s6"),await o(t.getByDisplayValue("123x45s6")).toBeInTheDocument(),await B.mouseOver(e),await o(e.getAttribute("data-error")).toEqual("Must be a numerical value"),await C(()=>{o(i.getByText("Must be a numerical value")).toBeInTheDocument()})})};const y=()=>{const[r,s]=l.useState("123");return a.jsx(u,{value:r,onChange:t=>{s(t.target.value)},testId:"testId",enableDisplayRounding:!0})};y.play=async({canvasElement:r,step:s})=>{const t=c(r);await s("Value should be rounded on blur",async()=>{const i=t.getByTestId("testId");await n.clear(i),await n.type(i,"123.123456789"),await n.click(r),await o(t.getByDisplayValue("123.12")).toBeInTheDocument()}),await s("Full value shown on focus",async()=>{const i=t.getByTestId("testId");await n.click(i),await o(t.getByDisplayValue("123.123456789")).toBeInTheDocument()})};const w=()=>{const[r,s]=l.useState(!0),t=()=>{s(!1),setTimeout(()=>s(!0),0)},[i,e]=l.useState("123");return a.jsxs(K,{columns:"1fr 1fr",gap:!0,children:[a.jsxs(m,{heading:a.jsx(p,{children:"Storage State (Redux)"}),children:[i,a.jsx(x,{}),a.jsx(Q,{label:"Change value",onClick:()=>e(String(Math.floor(Math.random()*100)))})]}),a.jsx(m,{heading:a.jsx(p,{icon:a.jsx(X,{icon:"refresh"}),onIconClick:t,children:"NumberInput"}),children:r&&a.jsx(u,{value:i,onChange:h=>{e(h.target.value)},error:Number(i)>=0?"":"Value must be positive"})})]})},I=()=>{const[r,s]=l.useState(!0),t=()=>{s(!1),setTimeout(()=>s(!0),0)},[i,e]=l.useState(!1),[h,Y]=l.useState(!0),[f,D]=l.useState("0.6889763779527558"),[S,Z]=l.useState(""),$=Number(f)*.3048;return a.jsxs(K,{columns:"1fr 1fr",gap:!0,children:[a.jsxs(m,{heading:a.jsx(p,{children:"Settings"}),children:[a.jsx(V,{label:"Enable display rounding:",labelLeft:!0,labelWidth:200,children:a.jsx(R,{checked:i,onChange:d=>e(d.target.checked)})}),a.jsx(V,{label:"Enable cosmetic rounding:",labelLeft:!0,labelWidth:200,children:a.jsx(R,{checked:h,onChange:d=>Y(d.target.checked)})})]}),a.jsxs(m,{heading:a.jsx(p,{icon:a.jsx(X,{icon:"refresh",testId:"triggerRerenderTestId"}),onIconClick:t,children:"NumberInput (displayed in Meters)"}),children:[a.jsx(ne,{faint:!0,children:"Cosmetic Rounding Test Cases: type 0.21 then return (compare with enableCosmeticRounding on and off)"}),a.jsx(x,{}),r&&a.jsx(u,{name:"Example",value:$,onChange:d=>{const T=String(Number(d.target.value)/.3048);D(T)},enableDisplayRounding:i,enableCosmeticRounding:h,error:Number(f)>=0?"":"Value must be positive",validationCallback:(d,T)=>{Z(T??"")},testId:"testId"})]}),a.jsxs(m,{heading:a.jsx(p,{children:"Storage State / Redux (stored in Feet)"}),children:[f,a.jsx(x,{}),a.jsx(Q,{label:"Change value",onClick:()=>D(String(Math.floor(Math.random()*100)))})]}),a.jsx(m,{heading:a.jsx(p,{children:"Test Validation Callback"}),children:S&&a.jsx(se,{message:{content:S,icon:!0,type:"Error",visible:!0}})})]})};I.play=async({canvasElement:r,step:s})=>{const t=c(r),i=c(r.ownerDocument.body);await s("Can enter decimal values",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123.123456789"),await n.click(r),await o(t.getByDisplayValue("123.123456789")).toBeInTheDocument()}),await s("Can enter scientific notation when storage unit is different",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"-1.12e-3"),await o(t.getByDisplayValue("-1.12e-3")).toBeInTheDocument(),await t.getByTestId("triggerRerenderTestId").click(),await C(()=>{o(t.getByDisplayValue(-.00112)).toBeInTheDocument()})}),await s("Can enter comma decimals (converts to dot)",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123,456"),await o(t.getByDisplayValue("123.456")).toBeInTheDocument()}),await s("Can enter small numbers",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"0.0000000023"),await o(t.getByDisplayValue("0.0000000023")).toBeInTheDocument()}),await s("Can enter large numbers",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"999999999999"),await o(t.getByDisplayValue("999999999999")).toBeInTheDocument()}),await s("Shows validation error for non-numeric input",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123x45s6"),await n.click(r),await o(t.getByDisplayValue("123x45s6")).toBeInTheDocument(),await o(e.getAttribute("data-error")).toEqual("Must be a numerical value"),await B.mouseOver(e),await C(()=>{o(i.getAllByText("Must be a numerical value").length).toEqual(2)})})};const b=()=>{const[r,s]=l.useState("123");return a.jsx(u,{value:r,onChange:t=>{s(t.target.value)},testId:"testId"})};b.play=async({canvasElement:r,step:s})=>{const t=c(r),i=c(r.ownerDocument.body);await s("Can enter decimal values",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123.123456789"),await o(t.getByDisplayValue("123.123456789")).toBeInTheDocument()}),await s("Can enter scientific notation",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"-1.12e3"),await o(t.getByDisplayValue("-1.12e3")).toBeInTheDocument()}),await s("Can enter comma decimals (converts to dot)",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123,456"),await o(t.getByDisplayValue("123.456")).toBeInTheDocument()}),await s("Can enter small numbers",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"0.0000000023"),await o(t.getByDisplayValue("0.0000000023")).toBeInTheDocument()}),await s("Can enter large numbers",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"999999999999"),await o(t.getByDisplayValue("999999999999")).toBeInTheDocument()}),await s("Shows validation error for non-numeric input",async()=>{const e=t.getByTestId("testId");await n.clear(e),await n.type(e,"123x45s6"),await o(t.getByDisplayValue("123x45s6")).toBeInTheDocument(),await o(e.getAttribute("data-error")).toEqual("Must be a numerical value"),await B.mouseOver(e),await C(()=>{o(i.getByText("Must be a numerical value")).toBeInTheDocument()})})};v.__docgenInfo={description:"",methods:[],displayName:"TestInputGroup"};g.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"Placeholder"};y.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"TestDisplayRounding"};w.__docgenInfo={description:"",methods:[],displayName:"ManagedTestCase"};I.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"DemoCosmeticRounding"};b.__docgenInfo={description:"",methods:[{name:"play",docblock:null,modifiers:["static"],params:[{name:"{ canvasElement, step }",optional:!1,type:null}],returns:null}],displayName:"TestUserInput"};var j,k,E;v.parameters={...v.parameters,docs:{...(j=v.parameters)==null?void 0:j.docs,source:{originalSource:`() => <InputGroup small>
2
+ <NumberInput value={123} />
3
+ <InputGroupAddon>to</InputGroupAddon>
4
+ <NumberInput value={123} />
5
+ <Select options={[{
6
+ value: 'units',
7
+ label: 'units'
8
+ }]} width="auto" value="units" />
9
+ </InputGroup>`,...(E=(k=v.parameters)==null?void 0:k.docs)==null?void 0:E.source}}};var N,M,F;g.parameters={...g.parameters,docs:{...(N=g.parameters)==null?void 0:N.docs,source:{originalSource:`() => {
10
+ const [value, setValue] = useState('123|m');
11
+ return <NumberInput name="example" onChange={evt => setValue(evt.target.value)} placeholder="Type a value..." value={value} testId="testId" />;
12
+ }`,...(F=(M=g.parameters)==null?void 0:M.docs)==null?void 0:F.source}}};var _,G,H;y.parameters={...y.parameters,docs:{...(_=y.parameters)==null?void 0:_.docs,source:{originalSource:`() => {
13
+ const [value, setValue] = useState('123');
14
+ return <NumberInput value={value} onChange={evt => {
15
+ setValue(evt.target.value);
16
+ }} testId="testId" enableDisplayRounding />;
17
+ }`,...(H=(G=y.parameters)==null?void 0:G.docs)==null?void 0:H.source}}};var A,L,q;w.parameters={...w.parameters,docs:{...(A=w.parameters)==null?void 0:A.docs,source:{originalSource:`() => {
18
+ const [visible, setVisible] = useState(true);
19
+ const triggerRerender = () => {
20
+ setVisible(false);
21
+ setTimeout(() => setVisible(true), 0);
22
+ };
23
+ const [value, setValue] = useState('123');
24
+ return <Grid columns="1fr 1fr" gap>
25
+ <Card heading={<Heading>Storage State (Redux)</Heading>}>
26
+ {value}
27
+ <Spacer />
28
+ <Button label="Change value" onClick={() => setValue(String(Math.floor(Math.random() * 100)))} />
29
+ </Card>
30
+ <Card heading={<Heading icon={<Icon icon="refresh" />} onIconClick={triggerRerender}>
31
+ NumberInput
32
+ </Heading>}>
33
+ {visible && <NumberInput value={value} onChange={evt => {
34
+ setValue(evt.target.value);
35
+ }} error={Number(value) >= 0 ? '' : 'Value must be positive'} />}
36
+ </Card>
37
+ </Grid>;
38
+ }`,...(q=(L=w.parameters)==null?void 0:L.docs)==null?void 0:q.source}}};var O,W,P;I.parameters={...I.parameters,docs:{...(O=I.parameters)==null?void 0:O.docs,source:{originalSource:`() => {
39
+ const [visible, setVisible] = useState(true);
40
+ const triggerRerender = () => {
41
+ setVisible(false);
42
+ setTimeout(() => setVisible(true), 0);
43
+ };
44
+ const [enableDisplayRounding, setEnableDisplayRounding] = useState(false);
45
+ const [enableCosmeticRounding, setEnableCosmeticRounding] = useState(true);
46
+ const [valueInFeet, setValueInFeet] = useState('0.6889763779527558');
47
+ const [callBackError, setCallBackError] = useState('');
48
+ const valueInMeters = Number(valueInFeet) * 0.3048;
49
+ return <Grid columns="1fr 1fr" gap>
50
+ <Card heading={<Heading>Settings</Heading>}>
51
+ <Field label="Enable display rounding:" labelLeft labelWidth={200}>
52
+ <Toggle checked={enableDisplayRounding} onChange={evt => setEnableDisplayRounding(evt.target.checked)} />
53
+ </Field>
54
+ <Field label="Enable cosmetic rounding:" labelLeft labelWidth={200}>
55
+ <Toggle checked={enableCosmeticRounding} onChange={evt => setEnableCosmeticRounding(evt.target.checked)} />
56
+ </Field>
57
+ </Card>
58
+ <Card heading={<Heading icon={<Icon icon="refresh" testId="triggerRerenderTestId" />} onIconClick={triggerRerender}>
59
+ NumberInput (displayed in Meters)
60
+ </Heading>}>
61
+ <Text faint>
62
+ Cosmetic Rounding Test Cases: type 0.21 then return (compare with
63
+ enableCosmeticRounding on and off)
64
+ </Text>
65
+ <Spacer />
66
+ {visible && <NumberInput name="Example" value={valueInMeters} onChange={evt => {
67
+ const nextValueInFeet = String(Number(evt.target.value) / 0.3048);
68
+ setValueInFeet(nextValueInFeet); // convert back to ft
69
+ }} enableDisplayRounding={enableDisplayRounding} enableCosmeticRounding={enableCosmeticRounding} error={Number(valueInFeet) >= 0 ? '' : 'Value must be positive'} validationCallback={(name, error) => {
70
+ setCallBackError(error ?? '');
71
+ }} testId="testId" />}
72
+ </Card>
73
+ <Card heading={<Heading>Storage State / Redux (stored in Feet)</Heading>}>
74
+ {valueInFeet}
75
+ <Spacer />
76
+ <Button label="Change value" onClick={() => setValueInFeet(String(Math.floor(Math.random() * 100)))} />
77
+ </Card>
78
+ <Card heading={<Heading>Test Validation Callback</Heading>}>
79
+ {callBackError && <Message message={{
80
+ content: callBackError,
81
+ icon: true,
82
+ type: 'Error',
83
+ visible: true
84
+ }} />}
85
+ </Card>
86
+ </Grid>;
87
+ }`,...(P=(W=I.parameters)==null?void 0:W.docs)==null?void 0:P.source}}};var U,z,J;b.parameters={...b.parameters,docs:{...(U=b.parameters)==null?void 0:U.docs,source:{originalSource:`() => {
88
+ const [value, setValue] = useState('123');
89
+ return <NumberInput value={value} onChange={evt => {
90
+ setValue(evt.target.value);
91
+ }} testId="testId" />;
92
+ }`,...(J=(z=b.parameters)==null?void 0:z.docs)==null?void 0:J.source}}};const Qe=["TestInputGroup","Placeholder","TestDisplayRounding","ManagedTestCase","DemoCosmeticRounding","TestUserInput"];export{I as DemoCosmeticRounding,w as ManagedTestCase,g as Placeholder,y as TestDisplayRounding,v as TestInputGroup,b as TestUserInput,Qe as __namedExportsOrder,Ke as default};
@@ -1,4 +1,4 @@
1
- import{j as n}from"./jsx-runtime-eps93zm2.js";import{T as A}from"./common-types-Sih75Sav.js";import{M as C}from"./actions-D-uVCDzk.js";import{c as E}from"./index-Bk2sglWO.js";import{C as O}from"./check-box-DPLaOkRR.js";import{D as y}from"./divider-DY9nJ_7N.js";import"./index-DhsZuJvc.js";import"./lodash-c4VUpsOs.js";import"./disabled-context-rmpd7YJS.js";import"./button-DHevvVBE.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./types-BmbYqTX_.js";import"./types-Dx2TtIG9.js";import"./badge-CLQ59MDF.js";import"./help-icon-Buhx5nl6.js";import"./text-B3-TSWok.js";const D="_menu_12x4u_1",I="_header_12x4u_11",L="_item_12x4u_27",F="_heading_12x4u_32",p={menu:D,header:I,item:L,heading:F},w=({option:e,onChange:r})=>{const{key:i,label:l,selected:a}=e;return n.jsx("div",{className:p.item,children:n.jsx(O,{label:l,noMargin:!0,checked:a,onChange:r})},i)};w.__docgenInfo={description:"",methods:[],displayName:"Option",props:{option:{required:!0,tsType:{name:"signature",type:"object",raw:`{
1
+ import{j as n}from"./jsx-runtime-eps93zm2.js";import{T as A}from"./common-types-Sih75Sav.js";import{M as C}from"./actions-Bax0KeqM.js";import{c as E}from"./index-Bk2sglWO.js";import{C as O}from"./check-box-DPLaOkRR.js";import{D as y}from"./divider-DY9nJ_7N.js";import"./index-DhsZuJvc.js";import"./lodash-c4VUpsOs.js";import"./disabled-context-rmpd7YJS.js";import"./button-Cbv7WK6k.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./types-BmbYqTX_.js";import"./types-Dx2TtIG9.js";import"./badge-CLQ59MDF.js";import"./help-icon-Buhx5nl6.js";import"./text-B3-TSWok.js";const D="_menu_12x4u_1",I="_header_12x4u_11",L="_item_12x4u_27",F="_heading_12x4u_32",p={menu:D,header:I,item:L,heading:F},w=({option:e,onChange:r})=>{const{key:i,label:l,selected:a}=e;return n.jsx("div",{className:p.item,children:n.jsx(O,{label:l,noMargin:!0,checked:a,onChange:r})},i)};w.__docgenInfo={description:"",methods:[],displayName:"Option",props:{option:{required:!0,tsType:{name:"signature",type:"object",raw:`{
2
2
  key?: string;
3
3
  label?: string | null;
4
4
  selected?: boolean;
@@ -1,4 +1,4 @@
1
- import{j as e}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as r}from"./index-BcNHZKhG.js";import{Z as t}from"./index-C0Iaso0O.js";import"./index-DhsZuJvc.js";import"./iframe-B8VgeFPT.js";import"../sb-preview/runtime.js";import"./index-CUZDtIZe.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./index-D6rZ4wEC.js";function i(s){const n={code:"code",h1:"h1",h2:"h2",li:"li",p:"p",strong:"strong",ul:"ul",...r(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(t,{title:"Padding, Margin & Size"}),`
1
+ import{j as e}from"./jsx-runtime-eps93zm2.js";import{useMDXComponents as r}from"./index-BcNHZKhG.js";import{Z as t}from"./index-AKsHS-dO.js";import"./index-DhsZuJvc.js";import"./iframe-DOUoMheZ.js";import"../sb-preview/runtime.js";import"./index-CUZDtIZe.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./index-D6rZ4wEC.js";function i(s){const n={code:"code",h1:"h1",h2:"h2",li:"li",p:"p",strong:"strong",ul:"ul",...r(),...s.components};return e.jsxs(e.Fragment,{children:[e.jsx(t,{title:"Padding, Margin & Size"}),`
2
2
  `,e.jsx(n.h1,{id:"padding-margin--size",children:"Padding, Margin & Size"}),`
3
3
  `,e.jsx(n.h2,{id:"padding--margin",children:"Padding & Margin"}),`
4
4
  `,e.jsx(n.p,{children:"There are standard CSS spacing variables for padding and margin."}),`
@@ -1,4 +1,4 @@
1
- import{j as e}from"./jsx-runtime-eps93zm2.js";import{P as i}from"./page-7SSpdYhb.js";import{T as d}from"./top-bar-DkXSzzqt.js";import{S as c}from"./side-bar-CSx5wI-k.js";import{H as s}from"./heading-CRNoBc7q.js";import{L as D}from"./logo-BVP9045W.js";import"./index-DhsZuJvc.js";import"./index-Bk2sglWO.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./disabled-context-rmpd7YJS.js";import"./common-types-Sih75Sav.js";import"./button-DHevvVBE.js";import"./spinner-AWUe4xwQ.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./actions-D-uVCDzk.js";import"./lodash-c4VUpsOs.js";import"./types-BmbYqTX_.js";import"./types-Dx2TtIG9.js";import"./badge-CLQ59MDF.js";import"./index-BI4_Bp97.js";import"./drawer-DOWJp9T4.js";import"./help-icon-Buhx5nl6.js";const W="_printHeader_o7xxx_1",L={printHeader:W},I=({logo:F,alt:V,logoWidth:C="100px"})=>e.jsx("img",{src:F,alt:V,className:L.printHeader,style:{width:C}});I.__docgenInfo={description:"",methods:[],displayName:"PrintHeader",props:{logo:{required:!0,tsType:{name:"string"},description:""},logoWidth:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"'100px'",computed:!1}},alt:{required:!0,tsType:{name:"string"},description:""}}};const t="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vestibulum velit vitae dolor eleifend, quis cursus tortor tempor. Etiam laoreet tempor turpis ut tristique. In hac habitasse platea dictumst. Ut viverra vestibulum facilisis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Curabitur commodo egestas magna, at molestie quam euismod ut. Aliquam suscipit at velit vel venenatis. Morbi rhoncus odio neque, volutpat finibus risus hendrerit quis. Sed vitae justo at elit dictum semper. Suspendisse non luctus nulla. Suspendisse condimentum tellus ac elit ornare porttitor. In dignissim libero erat, eget varius nisl tincidunt sed. Duis vel viverra dolor. Mauris nisl lorem, consectetur sed ullamcorper consequat, dictum eu diam. Fusce pretium velit vitae urna tempor, id luctus velit lacinia. Suspendisse lacinia, ante eget egestas mollis, magna magna imperdiet lacus, vitae molestie purus urna et ipsum. Nulla facilisi. Nam augue sapien, dapibus id nunc a, iaculis vulputate urna. Nullam sit amet rutrum tortor. Fusce vel augue vel orci porttitor auctor. Vivamus pulvinar urna quam, non posuere lorem mollis fringilla. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Quisque porta odio quis urna pulvinar hendrerit. Nam eros sapien, cursus at maximus id, suscipit et erat. Praesent semper consectetur lacus eu suscipit. In mi ex, feugiat sagittis facilisis ut, fermentum quis mi. Nunc egestas tempor pharetra. Nulla condimentum massa non facilisis bibendum. Sed at justo eget massa lobortis ultricies sit amet eu ex. Nullam auctor ex ac elit laoreet, vitae convallis sem egestas. Maecenas gravida eros sit amet orci dapibus, rutrum gravida nisl finibus. Pellentesque vitae lorem vulputate, accumsan ligula quis, rhoncus urna. Vestibulum velit ex, venenatis ut sagittis id, malesuada vel diam. Suspendisse et turpis eu metus luctus fermentum at consectetur est. Suspendisse sit amet tincidunt dolor. Curabitur imperdiet congue urna in fringilla. Donec nec accumsan purus. Cras et blandit turpis. Curabitur sed libero nibh. Morbi scelerisque, metus vel cursus dapibus, quam lorem placerat odio, at rhoncus diam diam eget nisi. Nulla sagittis posuere ex, vel scelerisque justo egestas vel. Duis aliquam mollis est id tristique. Ut eros libero, faucibus sed ante sit amet, euismod condimentum dolor. Aenean feugiat augue tortor, id egestas tellus porta eu. Maecenas sed dui vitae erat fringilla lacinia. Etiam nisi felis, rhoncus nec vestibulum vel, mattis eget ligula. Cras sed quam sed nisi mollis eleifend. Nulla commodo, dolor nec bibendum finibus, lorem quam tincidunt lectus, sed volutpat lorem ligula vitae leo. Aliquam efficitur eu felis at dignissim. Fusce auctor eleifend justo, ut varius sapien ullamcorper mattis. Curabitur suscipit pellentesque augue sed bibendum.",le={title:"Layout/Page",component:i,parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}},argTypes:{top:{control:"text"},left:{control:"text"},padding:{control:{type:"boolean"}}}},a=()=>e.jsxs(e.Fragment,{children:[e.jsx(d,{}),e.jsx(c,{options:{title:"",sections:[]}}),e.jsxs(i,{children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]}),r=()=>e.jsxs(e.Fragment,{children:[e.jsx(d,{}),e.jsx(c,{options:{title:"",sections:[]}}),e.jsxs(i,{padding:!1,children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]}),o=()=>e.jsxs(e.Fragment,{children:[e.jsx(d,{}),e.jsx(c,{options:{title:"",sections:[]}}),e.jsxs(i,{scroll:!1,children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]}),n=()=>e.jsxs(e.Fragment,{children:[e.jsx(c,{options:{title:"",sections:[]}}),e.jsxs(i,{top:0,children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]}),u=()=>e.jsxs(e.Fragment,{children:[e.jsx(d,{}),e.jsxs(i,{left:0,children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]}),l=()=>e.jsxs(e.Fragment,{children:[e.jsx(I,{logo:D,logoWidth:"60px",alt:"company logo"}),e.jsx(d,{}),e.jsx(c,{options:{title:"",sections:[]}}),e.jsxs(i,{children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]});a.__docgenInfo={description:"",methods:[],displayName:"Default"};r.__docgenInfo={description:"",methods:[],displayName:"NoPadding"};o.__docgenInfo={description:"",methods:[],displayName:"NoScroll"};n.__docgenInfo={description:"",methods:[],displayName:"NoTopBar"};u.__docgenInfo={description:"",methods:[],displayName:"NoSideBar"};l.__docgenInfo={description:"",methods:[],displayName:"WithPrintHeader"};var m,p,g;a.parameters={...a.parameters,docs:{...(m=a.parameters)==null?void 0:m.docs,source:{originalSource:`() => <>
1
+ import{j as e}from"./jsx-runtime-eps93zm2.js";import{P as i}from"./page-7SSpdYhb.js";import{T as d}from"./top-bar-Bjf6PQE1.js";import{S as c}from"./side-bar-wpFQ5NEE.js";import{H as s}from"./heading-CRNoBc7q.js";import{L as D}from"./logo-BVP9045W.js";import"./index-DhsZuJvc.js";import"./index-Bk2sglWO.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./disabled-context-rmpd7YJS.js";import"./common-types-Sih75Sav.js";import"./button-Cbv7WK6k.js";import"./spinner-AWUe4xwQ.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./actions-Bax0KeqM.js";import"./lodash-c4VUpsOs.js";import"./types-BmbYqTX_.js";import"./types-Dx2TtIG9.js";import"./badge-CLQ59MDF.js";import"./index-BI4_Bp97.js";import"./drawer-DaQ1xGjV.js";import"./help-icon-Buhx5nl6.js";const W="_printHeader_o7xxx_1",L={printHeader:W},I=({logo:F,alt:V,logoWidth:C="100px"})=>e.jsx("img",{src:F,alt:V,className:L.printHeader,style:{width:C}});I.__docgenInfo={description:"",methods:[],displayName:"PrintHeader",props:{logo:{required:!0,tsType:{name:"string"},description:""},logoWidth:{required:!1,tsType:{name:"union",raw:"string | number",elements:[{name:"string"},{name:"number"}]},description:"",defaultValue:{value:"'100px'",computed:!1}},alt:{required:!0,tsType:{name:"string"},description:""}}};const t="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vestibulum velit vitae dolor eleifend, quis cursus tortor tempor. Etiam laoreet tempor turpis ut tristique. In hac habitasse platea dictumst. Ut viverra vestibulum facilisis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Curabitur commodo egestas magna, at molestie quam euismod ut. Aliquam suscipit at velit vel venenatis. Morbi rhoncus odio neque, volutpat finibus risus hendrerit quis. Sed vitae justo at elit dictum semper. Suspendisse non luctus nulla. Suspendisse condimentum tellus ac elit ornare porttitor. In dignissim libero erat, eget varius nisl tincidunt sed. Duis vel viverra dolor. Mauris nisl lorem, consectetur sed ullamcorper consequat, dictum eu diam. Fusce pretium velit vitae urna tempor, id luctus velit lacinia. Suspendisse lacinia, ante eget egestas mollis, magna magna imperdiet lacus, vitae molestie purus urna et ipsum. Nulla facilisi. Nam augue sapien, dapibus id nunc a, iaculis vulputate urna. Nullam sit amet rutrum tortor. Fusce vel augue vel orci porttitor auctor. Vivamus pulvinar urna quam, non posuere lorem mollis fringilla. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Quisque porta odio quis urna pulvinar hendrerit. Nam eros sapien, cursus at maximus id, suscipit et erat. Praesent semper consectetur lacus eu suscipit. In mi ex, feugiat sagittis facilisis ut, fermentum quis mi. Nunc egestas tempor pharetra. Nulla condimentum massa non facilisis bibendum. Sed at justo eget massa lobortis ultricies sit amet eu ex. Nullam auctor ex ac elit laoreet, vitae convallis sem egestas. Maecenas gravida eros sit amet orci dapibus, rutrum gravida nisl finibus. Pellentesque vitae lorem vulputate, accumsan ligula quis, rhoncus urna. Vestibulum velit ex, venenatis ut sagittis id, malesuada vel diam. Suspendisse et turpis eu metus luctus fermentum at consectetur est. Suspendisse sit amet tincidunt dolor. Curabitur imperdiet congue urna in fringilla. Donec nec accumsan purus. Cras et blandit turpis. Curabitur sed libero nibh. Morbi scelerisque, metus vel cursus dapibus, quam lorem placerat odio, at rhoncus diam diam eget nisi. Nulla sagittis posuere ex, vel scelerisque justo egestas vel. Duis aliquam mollis est id tristique. Ut eros libero, faucibus sed ante sit amet, euismod condimentum dolor. Aenean feugiat augue tortor, id egestas tellus porta eu. Maecenas sed dui vitae erat fringilla lacinia. Etiam nisi felis, rhoncus nec vestibulum vel, mattis eget ligula. Cras sed quam sed nisi mollis eleifend. Nulla commodo, dolor nec bibendum finibus, lorem quam tincidunt lectus, sed volutpat lorem ligula vitae leo. Aliquam efficitur eu felis at dignissim. Fusce auctor eleifend justo, ut varius sapien ullamcorper mattis. Curabitur suscipit pellentesque augue sed bibendum.",le={title:"Layout/Page",component:i,parameters:{layout:"fullscreen",docs:{story:{inline:!1,iframeHeight:400}}},argTypes:{top:{control:"text"},left:{control:"text"},padding:{control:{type:"boolean"}}}},a=()=>e.jsxs(e.Fragment,{children:[e.jsx(d,{}),e.jsx(c,{options:{title:"",sections:[]}}),e.jsxs(i,{children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]}),r=()=>e.jsxs(e.Fragment,{children:[e.jsx(d,{}),e.jsx(c,{options:{title:"",sections:[]}}),e.jsxs(i,{padding:!1,children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]}),o=()=>e.jsxs(e.Fragment,{children:[e.jsx(d,{}),e.jsx(c,{options:{title:"",sections:[]}}),e.jsxs(i,{scroll:!1,children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]}),n=()=>e.jsxs(e.Fragment,{children:[e.jsx(c,{options:{title:"",sections:[]}}),e.jsxs(i,{top:0,children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]}),u=()=>e.jsxs(e.Fragment,{children:[e.jsx(d,{}),e.jsxs(i,{left:0,children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]}),l=()=>e.jsxs(e.Fragment,{children:[e.jsx(I,{logo:D,logoWidth:"60px",alt:"company logo"}),e.jsx(d,{}),e.jsx(c,{options:{title:"",sections:[]}}),e.jsxs(i,{children:[e.jsx(s,{top:!0,children:"Heading"}),t]})]});a.__docgenInfo={description:"",methods:[],displayName:"Default"};r.__docgenInfo={description:"",methods:[],displayName:"NoPadding"};o.__docgenInfo={description:"",methods:[],displayName:"NoScroll"};n.__docgenInfo={description:"",methods:[],displayName:"NoTopBar"};u.__docgenInfo={description:"",methods:[],displayName:"NoSideBar"};l.__docgenInfo={description:"",methods:[],displayName:"WithPrintHeader"};var m,p,g;a.parameters={...a.parameters,docs:{...(m=a.parameters)==null?void 0:m.docs,source:{originalSource:`() => <>
2
2
  <TopBar />
3
3
  <SideBar options={{
4
4
  title: '',
@@ -1 +1 @@
1
- import{j as o}from"./jsx-runtime-eps93zm2.js";import{r as b}from"./index-DhsZuJvc.js";import{I as l}from"./common-types-Sih75Sav.js";import{S as C}from"./select-DnRuRG_N.js";import{I}from"./input-DTXbDJaL.js";import{B as p}from"./button-DHevvVBE.js";import{I as N}from"./input-group-BaRSJAEN.js";import{I as j}from"./input-group-addon-D68iUKV2.js";const E=(n,i)=>i||n&&n.reduce((e,t)=>t.selected?Number(t.value):e,10)||10,_=(n,i)=>{if(!i||!n)return 10;const{options:e,value:t}=i,a=Number(t);return a===0?1:Math.ceil(n/E(e,a))},S=(n,i,e="Selected page must be a positive whole number between 1 and")=>{const t=`${e} ${i}`,a={valid:!0,error:null};return n===""?a:!n.match(/^\d+$/g)||parseInt(n)<=0||parseInt(n)>i?{valid:!1,error:t}:a},P="_paginationContainer_1tmz4_1",R={paginationContainer:P},T=({pagination:n})=>{const{rowCount:i,selectedPage:e,small:t,onSelectPage:a,rowsPerPage:r,errorMessageTemplate:g,testIds:m}=n,d=Number(r==null?void 0:r.value)===0,u=_(i,r),[f,h]=b.useState(String(e));b.useEffect(()=>{h(String(e))},[e]);const{error:v}=S(f,u,g),c=s=>{const{valid:x}=S(s,u,g);h(s),x&&s!==""&&a&&a(Number(s))};return o.jsxs("div",{className:R.paginationContainer,children:[r&&o.jsx("div",{style:{flexShrink:0},children:o.jsx(C,{onChange:s=>{r.onChange&&r.onChange(s),c(String(1))},options:r.options,native:!!r.options,small:t,width:"auto",value:r.value})}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_DOUBLE_LEFT,onClick:()=>c(String(1)),disabled:d||e===1}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_LEFT,onClick:()=>c(String(Number(e)-1)),disabled:d||e===1}),o.jsxs(N,{small:t,width:"auto",children:[o.jsx(I,{right:!0,value:f,placeholder:String(e),onChange:s=>c(s.target.value),width:"50px",disabled:d||u<=1,error:v}),o.jsxs(j,{children:["of ",u]})]}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_RIGHT,onClick:()=>c(String(Number(e)+1)),disabled:d||e===u}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_DOUBLE_RIGHT,onClick:()=>c(String(u)),disabled:d||e===u,testId:m==null?void 0:m.doubleRightBtn})]})};T.__docgenInfo={description:"",methods:[],displayName:"Pagination",props:{pagination:{required:!0,tsType:{name:"IPagination"},description:""}}};export{T as P};
1
+ import{j as o}from"./jsx-runtime-eps93zm2.js";import{r as b}from"./index-DhsZuJvc.js";import{I as l}from"./common-types-Sih75Sav.js";import{S as C}from"./select-Cwks-WA0.js";import{I}from"./input-Db9WkmPP.js";import{B as p}from"./button-Cbv7WK6k.js";import{I as N}from"./input-group-BaRSJAEN.js";import{I as j}from"./input-group-addon-D68iUKV2.js";const E=(n,i)=>i||n&&n.reduce((e,t)=>t.selected?Number(t.value):e,10)||10,_=(n,i)=>{if(!i||!n)return 10;const{options:e,value:t}=i,a=Number(t);return a===0?1:Math.ceil(n/E(e,a))},S=(n,i,e="Selected page must be a positive whole number between 1 and")=>{const t=`${e} ${i}`,a={valid:!0,error:null};return n===""?a:!n.match(/^\d+$/g)||parseInt(n)<=0||parseInt(n)>i?{valid:!1,error:t}:a},P="_paginationContainer_1tmz4_1",R={paginationContainer:P},T=({pagination:n})=>{const{rowCount:i,selectedPage:e,small:t,onSelectPage:a,rowsPerPage:r,errorMessageTemplate:g,testIds:m}=n,d=Number(r==null?void 0:r.value)===0,u=_(i,r),[f,h]=b.useState(String(e));b.useEffect(()=>{h(String(e))},[e]);const{error:v}=S(f,u,g),c=s=>{const{valid:x}=S(s,u,g);h(s),x&&s!==""&&a&&a(Number(s))};return o.jsxs("div",{className:R.paginationContainer,children:[r&&o.jsx("div",{style:{flexShrink:0},children:o.jsx(C,{onChange:s=>{r.onChange&&r.onChange(s),c(String(1))},options:r.options,native:!!r.options,small:t,width:"auto",value:r.value})}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_DOUBLE_LEFT,onClick:()=>c(String(1)),disabled:d||e===1}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_LEFT,onClick:()=>c(String(Number(e)-1)),disabled:d||e===1}),o.jsxs(N,{small:t,width:"auto",children:[o.jsx(I,{right:!0,value:f,placeholder:String(e),onChange:s=>c(s.target.value),width:"50px",disabled:d||u<=1,error:v}),o.jsxs(j,{children:["of ",u]})]}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_RIGHT,onClick:()=>c(String(Number(e)+1)),disabled:d||e===u}),o.jsx(p,{small:t,round:!0,basic:!0,icon:l.CHEVRON_DOUBLE_RIGHT,onClick:()=>c(String(u)),disabled:d||e===u,testId:m==null?void 0:m.doubleRightBtn})]})};T.__docgenInfo={description:"",methods:[],displayName:"Pagination",props:{pagination:{required:!0,tsType:{name:"IPagination"},description:""}}};export{T as P};
@@ -1,4 +1,4 @@
1
- import{j as p}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJvc.js";import{P as g}from"./pagination-CLt-kUlx.js";import"./common-types-Sih75Sav.js";import"./select-DnRuRG_N.js";import"./lodash-c4VUpsOs.js";import"./index-Bk2sglWO.js";import"./disabled-context-rmpd7YJS.js";import"./types-Dx2TtIG9.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./index-CEuq6vkz.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./types-BmbYqTX_.js";import"./text-B3-TSWok.js";import"./actions-D-uVCDzk.js";import"./button-DHevvVBE.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./badge-CLQ59MDF.js";import"./select.input-D0UkAPd9.js";import"./input-DTXbDJaL.js";import"./input-group-BaRSJAEN.js";import"./input-group-addon-D68iUKV2.js";const h={rowCount:500,selectedPage:1,onSelectPage:()=>{}},V={title:"Basic/Pagination",component:g,args:{pagination:h}},n=()=>{const[a,t]=l.useState(1);return p.jsx(g,{pagination:{rowCount:500,selectedPage:a,onSelectPage:o=>t(o)}})},r=()=>{const[a,t]=l.useState(1),[o,i]=l.useState(20);return p.jsx(g,{pagination:{rowCount:500,selectedPage:a,rowsPerPage:{onChange:e=>i(Number(e.target.value)),options:[{label:"10 / page",value:10},{label:"20 / page",value:20},{label:"50 / page",value:50},{label:"Show all",value:0}],value:o},onSelectPage:e=>t(e)}})},s=()=>{const[a,t]=l.useState(1),[o,i]=l.useState(20);return p.jsx(g,{pagination:{small:!0,rowCount:500,selectedPage:a,rowsPerPage:{onChange:e=>i(Number(e.target.value)),options:[{label:"10 / page",value:10},{label:"20 / page",value:20},{label:"50 / page",value:50},{label:"Show all",value:0}],value:o},onSelectPage:e=>t(e)}})};n.__docgenInfo={description:"",methods:[],displayName:"Default"};r.__docgenInfo={description:"",methods:[],displayName:"RowsPerPage"};s.__docgenInfo={description:"",methods:[],displayName:"Small"};var P,c,u;n.parameters={...n.parameters,docs:{...(P=n.parameters)==null?void 0:P.docs,source:{originalSource:`() => {
1
+ import{j as p}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJvc.js";import{P as g}from"./pagination-CR1nxnnq.js";import"./common-types-Sih75Sav.js";import"./select-Cwks-WA0.js";import"./lodash-c4VUpsOs.js";import"./index-Bk2sglWO.js";import"./disabled-context-rmpd7YJS.js";import"./types-Dx2TtIG9.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./enum-Bnn40S8Q.js";import"./index-CEuq6vkz.js";import"./inheritsLoose-DP0QEDDI.js";import"./assertThisInitialized-B9jnkVVz.js";import"./memoize-one.esm-CcMeOnPo.js";import"./types-BmbYqTX_.js";import"./text-B3-TSWok.js";import"./actions-Bax0KeqM.js";import"./button-Cbv7WK6k.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./badge-CLQ59MDF.js";import"./select.input-CJed_LLR.js";import"./helpers-JJxzGegQ.js";import"./input-Db9WkmPP.js";import"./input-group-BaRSJAEN.js";import"./input-group-addon-D68iUKV2.js";const h={rowCount:500,selectedPage:1,onSelectPage:()=>{}},X={title:"Basic/Pagination",component:g,args:{pagination:h}},n=()=>{const[a,t]=l.useState(1);return p.jsx(g,{pagination:{rowCount:500,selectedPage:a,onSelectPage:o=>t(o)}})},r=()=>{const[a,t]=l.useState(1),[o,i]=l.useState(20);return p.jsx(g,{pagination:{rowCount:500,selectedPage:a,rowsPerPage:{onChange:e=>i(Number(e.target.value)),options:[{label:"10 / page",value:10},{label:"20 / page",value:20},{label:"50 / page",value:50},{label:"Show all",value:0}],value:o},onSelectPage:e=>t(e)}})},s=()=>{const[a,t]=l.useState(1),[o,i]=l.useState(20);return p.jsx(g,{pagination:{small:!0,rowCount:500,selectedPage:a,rowsPerPage:{onChange:e=>i(Number(e.target.value)),options:[{label:"10 / page",value:10},{label:"20 / page",value:20},{label:"50 / page",value:50},{label:"Show all",value:0}],value:o},onSelectPage:e=>t(e)}})};n.__docgenInfo={description:"",methods:[],displayName:"Default"};r.__docgenInfo={description:"",methods:[],displayName:"RowsPerPage"};s.__docgenInfo={description:"",methods:[],displayName:"Small"};var P,c,u;n.parameters={...n.parameters,docs:{...(P=n.parameters)==null?void 0:P.docs,source:{originalSource:`() => {
2
2
  const [selectedPage, setSelectedPage] = useState(1);
3
3
  return <Pagination pagination={{
4
4
  rowCount: 500,
@@ -56,4 +56,4 @@ import{j as p}from"./jsx-runtime-eps93zm2.js";import{r as l}from"./index-DhsZuJv
56
56
  },
57
57
  onSelectPage: evt => setSelectedPage(evt)
58
58
  }} />;
59
- }`,...(b=(w=s.parameters)==null?void 0:w.docs)==null?void 0:b.source}}};const W=["Default","RowsPerPage","Small"];export{n as Default,r as RowsPerPage,s as Small,W as __namedExportsOrder,V as default};
59
+ }`,...(b=(w=s.parameters)==null?void 0:w.docs)==null?void 0:b.source}}};const Y=["Default","RowsPerPage","Small"];export{n as Default,r as RowsPerPage,s as Small,Y as __namedExportsOrder,X as default};
@@ -1,4 +1,4 @@
1
- import{j as t}from"./jsx-runtime-eps93zm2.js";import{P as S}from"./popover-rq33c1W2.js";import{B as u}from"./button-DHevvVBE.js";import{T as I}from"./text-B3-TSWok.js";import{t as A}from"./toaster-BoBcvmf9.js";import"./index-DhsZuJvc.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./toaster-7wnI6hqB.js";import"./message-Y48EomV-.js";const R="_popConfirm_1x6ye_1",$="_content_1x6ye_7",W="_buttons_1x6ye_13",y={popConfirm:R,content:$,buttons:W},O=({title:e,okText:p,onClickOk:d,disableConfirmButton:m,cancelText:f,onClickCancel:g,close:a,testId:o})=>t.jsxs("div",{className:y.popConfirm,children:[e&&t.jsx("div",{className:y.content,children:t.jsx(I,{small:!0,children:e})}),t.jsxs("div",{className:y.buttons,children:[t.jsx(u,{small:!0,colored:!0,label:p,onClick:()=>d(a),disabled:m,testId:`${o}-ok-button`}),t.jsx(u,{small:!0,label:f,onClick:()=>g(a),testId:`${o}-cancel-button`})]})]});O.__docgenInfo={description:"",methods:[],displayName:"Content",props:{title:{required:!1,tsType:{name:"string"},description:""},okText:{required:!0,tsType:{name:"string"},description:""},onClickOk:{required:!0,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:""},disableConfirmButton:{required:!1,tsType:{name:"boolean"},description:""},cancelText:{required:!0,tsType:{name:"string"},description:""},onClickCancel:{required:!0,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:""},close:{required:!1,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:""},testId:{required:!1,tsType:{name:"string"},description:""}}};const v=({children:e,placement:p="top-center",closeOnOutsideClick:d=!0,fullWidth:m=!1,title:f="",cancelText:g="Cancel",onClickCancel:a=i=>i&&i(),okText:o="Ok",onClickOk:D=()=>{},disableConfirmButton:E=!1,overflowContainer:N=!1,testId:C=void 0})=>{const i=t.jsx(O,{title:f,okText:o,onClickOk:D,disableConfirmButton:E,cancelText:g,onClickCancel:a,testId:C});return t.jsx(S,{content:i,placement:p,closeOnOutsideClick:d,fullWidth:m,overflowContainer:N,testId:C,children:e})};v.__docgenInfo={description:"",methods:[],displayName:"PopConfirm",props:{children:{required:!1,tsType:{name:"ReactNode"},description:""},placement:{required:!1,tsType:{name:"Placement"},description:"",defaultValue:{value:"'top-center'",computed:!1}},closeOnOutsideClick:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}},fullWidth:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},title:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"''",computed:!1}},cancelText:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"'Cancel'",computed:!1}},onClickCancel:{required:!1,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:"",defaultValue:{value:"(close) => close && close()",computed:!1}},disableConfirmButton:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},okText:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"'Ok'",computed:!1}},onClickOk:{required:!1,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},overflowContainer:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},testId:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"undefined",computed:!0}}}};const Y=e=>{A({message:{type:"Success",content:"success!",details:"You successfully booked your cruise to Bahamas."}}),e()},oe={title:"Basic/PopConfirm",component:v,args:{title:"Do you want a free cruise to Bahamas?",onClickCancel:e=>e(),onClickOk:Y,children:t.jsx(u,{label:"Click me!"}),overflowContainer:!0,placement:"top-center"},decorators:[e=>t.jsx("div",{style:{display:"flex",justifyContent:"center"},children:e()})],parameters:{docs:{source:{excludeDecorators:!0}}}},c=e=>t.jsx(v,{...e}),l=c.bind({}),r=c.bind({});r.args={children:t.jsx(u,{small:!0,round:!0,basic:!0,colored:"muted",icon:"delete"})};const s=c.bind({});s.args={placement:"bottom-end"};const n=c.bind({});n.args={disableConfirmButton:!0};var x,b,T;l.parameters={...l.parameters,docs:{...(x=l.parameters)==null?void 0:x.docs,source:{originalSource:`args => <PopConfirm
1
+ import{j as t}from"./jsx-runtime-eps93zm2.js";import{P as S}from"./popover-C_2P8LFJ.js";import{B as u}from"./button-Cbv7WK6k.js";import{T as I}from"./text-B3-TSWok.js";import{t as A}from"./toaster-O8ftrUAJ.js";import"./index-DhsZuJvc.js";import"./tooltip-1V7clEnw.js";import"./index-CUZDtIZe.js";import"./index-Bk2sglWO.js";import"./common-types-Sih75Sav.js";import"./disabled-context-rmpd7YJS.js";import"./spinner-AWUe4xwQ.js";import"./icon-BSFY3vDO.js";import"./objectWithoutPropertiesLoose-CAYKN5F1.js";import"./inheritsLoose-DP0QEDDI.js";import"./index-CEuq6vkz.js";import"./toaster-7wnI6hqB.js";import"./message-BRyKdRaX.js";const R="_popConfirm_1x6ye_1",$="_content_1x6ye_7",W="_buttons_1x6ye_13",y={popConfirm:R,content:$,buttons:W},O=({title:e,okText:p,onClickOk:d,disableConfirmButton:m,cancelText:f,onClickCancel:g,close:a,testId:o})=>t.jsxs("div",{className:y.popConfirm,children:[e&&t.jsx("div",{className:y.content,children:t.jsx(I,{small:!0,children:e})}),t.jsxs("div",{className:y.buttons,children:[t.jsx(u,{small:!0,colored:!0,label:p,onClick:()=>d(a),disabled:m,testId:`${o}-ok-button`}),t.jsx(u,{small:!0,label:f,onClick:()=>g(a),testId:`${o}-cancel-button`})]})]});O.__docgenInfo={description:"",methods:[],displayName:"Content",props:{title:{required:!1,tsType:{name:"string"},description:""},okText:{required:!0,tsType:{name:"string"},description:""},onClickOk:{required:!0,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:""},disableConfirmButton:{required:!1,tsType:{name:"boolean"},description:""},cancelText:{required:!0,tsType:{name:"string"},description:""},onClickCancel:{required:!0,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:""},close:{required:!1,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:""},testId:{required:!1,tsType:{name:"string"},description:""}}};const v=({children:e,placement:p="top-center",closeOnOutsideClick:d=!0,fullWidth:m=!1,title:f="",cancelText:g="Cancel",onClickCancel:a=i=>i&&i(),okText:o="Ok",onClickOk:D=()=>{},disableConfirmButton:E=!1,overflowContainer:N=!1,testId:C=void 0})=>{const i=t.jsx(O,{title:f,okText:o,onClickOk:D,disableConfirmButton:E,cancelText:g,onClickCancel:a,testId:C});return t.jsx(S,{content:i,placement:p,closeOnOutsideClick:d,fullWidth:m,overflowContainer:N,testId:C,children:e})};v.__docgenInfo={description:"",methods:[],displayName:"PopConfirm",props:{children:{required:!1,tsType:{name:"ReactNode"},description:""},placement:{required:!1,tsType:{name:"Placement"},description:"",defaultValue:{value:"'top-center'",computed:!1}},closeOnOutsideClick:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}},fullWidth:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},title:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"''",computed:!1}},cancelText:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"'Cancel'",computed:!1}},onClickCancel:{required:!1,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:"",defaultValue:{value:"(close) => close && close()",computed:!1}},disableConfirmButton:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},okText:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"'Ok'",computed:!1}},onClickOk:{required:!1,tsType:{name:"signature",type:"function",raw:"(close?: TEmpty) => void",signature:{arguments:[{type:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},name:"close"}],return:{name:"void"}}},description:"",defaultValue:{value:"() => {}",computed:!1}},overflowContainer:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},testId:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:"undefined",computed:!0}}}};const Y=e=>{A({message:{type:"Success",content:"success!",details:"You successfully booked your cruise to Bahamas."}}),e()},oe={title:"Basic/PopConfirm",component:v,args:{title:"Do you want a free cruise to Bahamas?",onClickCancel:e=>e(),onClickOk:Y,children:t.jsx(u,{label:"Click me!"}),overflowContainer:!0,placement:"top-center"},decorators:[e=>t.jsx("div",{style:{display:"flex",justifyContent:"center"},children:e()})],parameters:{docs:{source:{excludeDecorators:!0}}}},c=e=>t.jsx(v,{...e}),l=c.bind({}),r=c.bind({});r.args={children:t.jsx(u,{small:!0,round:!0,basic:!0,colored:"muted",icon:"delete"})};const s=c.bind({});s.args={placement:"bottom-end"};const n=c.bind({});n.args={disableConfirmButton:!0};var x,b,T;l.parameters={...l.parameters,docs:{...(x=l.parameters)==null?void 0:x.docs,source:{originalSource:`args => <PopConfirm
2
2
  // eslint-disable-next-line react/jsx-props-no-spreading
3
3
  {...args} />`,...(T=(b=l.parameters)==null?void 0:b.docs)==null?void 0:T.source}}};var k,q,j;r.parameters={...r.parameters,docs:{...(k=r.parameters)==null?void 0:k.docs,source:{originalSource:`args => <PopConfirm
4
4
  // eslint-disable-next-line react/jsx-props-no-spreading