@flipdish/portal-library 3.7.1 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (148) hide show
  1. package/dist/components/FDErrorBoundary/index.cjs.js.map +1 -1
  2. package/dist/components/FDErrorBoundary/index.js.map +1 -1
  3. package/dist/components/Form/FormItemLayout/index.cjs.js.map +1 -1
  4. package/dist/components/Form/FormItemLayout/index.js.map +1 -1
  5. package/dist/components/Form/GenericAutocompleteField/index.cjs.js +1 -1
  6. package/dist/components/Form/GenericAutocompleteField/index.cjs.js.map +1 -1
  7. package/dist/components/Form/GenericAutocompleteField/index.d.ts +4 -4
  8. package/dist/components/Form/GenericAutocompleteField/index.js +1 -1
  9. package/dist/components/Form/GenericAutocompleteField/index.js.map +1 -1
  10. package/dist/components/Form/GenericFormContainer/index.cjs.js +1 -1
  11. package/dist/components/Form/GenericFormContainer/index.cjs.js.map +1 -1
  12. package/dist/components/Form/GenericFormContainer/index.d.ts +3 -3
  13. package/dist/components/Form/GenericFormContainer/index.js +1 -1
  14. package/dist/components/Form/GenericFormContainer/index.js.map +1 -1
  15. package/dist/components/Form/GenericTextField/index.cjs.js.map +1 -1
  16. package/dist/components/Form/GenericTextField/index.js.map +1 -1
  17. package/dist/components/Form/PaginatedAutocompleteField/index.cjs.js +1 -1
  18. package/dist/components/Form/PaginatedAutocompleteField/index.cjs.js.map +1 -1
  19. package/dist/components/Form/PaginatedAutocompleteField/index.js +1 -1
  20. package/dist/components/Form/PaginatedAutocompleteField/index.js.map +1 -1
  21. package/dist/components/GenericDatePickerField/GenericDateFieldBase.cjs.js.map +1 -1
  22. package/dist/components/GenericDatePickerField/GenericDateFieldBase.js.map +1 -1
  23. package/dist/components/GenericRadioButtons/index.cjs.js +1 -1
  24. package/dist/components/GenericRadioButtons/index.cjs.js.map +1 -1
  25. package/dist/components/GenericRadioButtons/index.d.ts +3 -3
  26. package/dist/components/GenericRadioButtons/index.js +1 -1
  27. package/dist/components/GenericRadioButtons/index.js.map +1 -1
  28. package/dist/components/GenericTable/HighlightScrollbar.cjs.js.map +1 -1
  29. package/dist/components/GenericTable/HighlightScrollbar.js.map +1 -1
  30. package/dist/components/GenericTable/index.cjs.js +1 -1
  31. package/dist/components/GenericTable/index.cjs.js.map +1 -1
  32. package/dist/components/GenericTable/index.js +1 -1
  33. package/dist/components/GenericTable/index.js.map +1 -1
  34. package/dist/components/GenericTableBody/index.cjs.js +1 -1
  35. package/dist/components/GenericTableBody/index.cjs.js.map +1 -1
  36. package/dist/components/GenericTableBody/index.d.ts +9 -9
  37. package/dist/components/GenericTableBody/index.js +1 -1
  38. package/dist/components/GenericTableBody/index.js.map +1 -1
  39. package/dist/components/GenericTableBodyRow/index.cjs.js +1 -1
  40. package/dist/components/GenericTableBodyRow/index.cjs.js.map +1 -1
  41. package/dist/components/GenericTableBodyRow/index.d.ts +2 -2
  42. package/dist/components/GenericTableBodyRow/index.js +1 -1
  43. package/dist/components/GenericTableBodyRow/index.js.map +1 -1
  44. package/dist/components/ListItemLinkButton/index.cjs.js +1 -1
  45. package/dist/components/ListItemLinkButton/index.cjs.js.map +1 -1
  46. package/dist/components/ListItemLinkButton/index.js +1 -1
  47. package/dist/components/ListItemLinkButton/index.js.map +1 -1
  48. package/dist/components/NoResults/index.cjs.js.map +1 -1
  49. package/dist/components/NoResults/index.js.map +1 -1
  50. package/dist/components/PageLayout/DocumentTitle.cjs.js.map +1 -1
  51. package/dist/components/PageLayout/DocumentTitle.d.ts +1 -1
  52. package/dist/components/PageLayout/DocumentTitle.js.map +1 -1
  53. package/dist/components/PageLayout/FullWidthContainer.cjs.js.map +1 -1
  54. package/dist/components/PageLayout/FullWidthContainer.js.map +1 -1
  55. package/dist/components/PageLayout/GlobalSpacingStyles.cjs.js.map +1 -1
  56. package/dist/components/PageLayout/GlobalSpacingStyles.js.map +1 -1
  57. package/dist/components/PageLayout/index.cjs.js.map +1 -1
  58. package/dist/components/PageLayout/index.js.map +1 -1
  59. package/dist/components/PortalMock/index.cjs.js.map +1 -1
  60. package/dist/components/PortalMock/index.js.map +1 -1
  61. package/dist/components/Spacer/index.cjs.js.map +1 -1
  62. package/dist/components/Spacer/index.js.map +1 -1
  63. package/dist/components/atoms/Badge/index.cjs.js +1 -1
  64. package/dist/components/atoms/Badge/index.cjs.js.map +1 -1
  65. package/dist/components/atoms/Badge/index.js +1 -1
  66. package/dist/components/atoms/Badge/index.js.map +1 -1
  67. package/dist/components/atoms/Button/buttonThemeOverrides.cjs.js +2 -0
  68. package/dist/components/atoms/Button/buttonThemeOverrides.cjs.js.map +1 -0
  69. package/dist/components/atoms/Button/buttonThemeOverrides.d.ts +21 -0
  70. package/dist/components/atoms/Button/buttonThemeOverrides.js +2 -0
  71. package/dist/components/atoms/Button/buttonThemeOverrides.js.map +1 -0
  72. package/dist/components/atoms/Button/getButtonStyles.cjs.js +2 -0
  73. package/dist/components/atoms/Button/getButtonStyles.cjs.js.map +1 -0
  74. package/dist/components/atoms/Button/getButtonStyles.d.ts +15 -0
  75. package/dist/components/atoms/Button/getButtonStyles.js +2 -0
  76. package/dist/components/atoms/Button/getButtonStyles.js.map +1 -0
  77. package/dist/components/atoms/Button/index.cjs.js +2 -0
  78. package/dist/components/atoms/Button/index.cjs.js.map +1 -0
  79. package/dist/components/atoms/Button/index.d.ts +26 -0
  80. package/dist/components/atoms/Button/index.js +2 -0
  81. package/dist/components/atoms/Button/index.js.map +1 -0
  82. package/dist/components/atoms/IconContainer/index.cjs.js.map +1 -1
  83. package/dist/components/molecules/Alert/index.cjs.js +1 -1
  84. package/dist/components/molecules/Alert/index.cjs.js.map +1 -1
  85. package/dist/components/molecules/Alert/index.d.ts +1 -1
  86. package/dist/components/molecules/Alert/index.js +1 -1
  87. package/dist/components/molecules/Alert/index.js.map +1 -1
  88. package/dist/components/molecules/Modal/index.cjs.js.map +1 -1
  89. package/dist/components/molecules/Modal/index.js.map +1 -1
  90. package/dist/custom-hooks/useMicroFrontendAttributes.cjs.js +1 -1
  91. package/dist/custom-hooks/useMicroFrontendAttributes.cjs.js.map +1 -1
  92. package/dist/custom-hooks/useMicroFrontendAttributes.d.ts +4 -4
  93. package/dist/custom-hooks/useMicroFrontendAttributes.js +1 -1
  94. package/dist/custom-hooks/useMicroFrontendAttributes.js.map +1 -1
  95. package/dist/custom-hooks/useRenderValidText.cjs.js.map +1 -1
  96. package/dist/custom-hooks/useRenderValidText.d.ts +3 -3
  97. package/dist/custom-hooks/useRenderValidText.js.map +1 -1
  98. package/dist/custom-hooks/useToasts.cjs.js.map +1 -1
  99. package/dist/custom-hooks/useToasts.js.map +1 -1
  100. package/dist/icons/helpers/withSvgIcon.cjs.js.map +1 -1
  101. package/dist/icons/helpers/withSvgIcon.js.map +1 -1
  102. package/dist/themes/ThemeProvider.cjs.js.map +1 -1
  103. package/dist/themes/flipdishPublicTheme.cjs.js +1 -1
  104. package/dist/themes/flipdishPublicTheme.cjs.js.map +1 -1
  105. package/dist/themes/flipdishPublicTheme.js +1 -1
  106. package/dist/themes/flipdishPublicTheme.js.map +1 -1
  107. package/dist/themes/theme.d.ts +14 -2
  108. package/dist/themes/tokens/colours/colours-stories-utils.cjs.js +1 -1
  109. package/dist/themes/tokens/colours/colours-stories-utils.cjs.js.map +1 -1
  110. package/dist/themes/tokens/colours/colours-stories-utils.js +1 -1
  111. package/dist/themes/tokens/colours/colours-stories-utils.js.map +1 -1
  112. package/dist/themes/tokens/colours/primitives.cjs.js +1 -1
  113. package/dist/themes/tokens/colours/primitives.cjs.js.map +1 -1
  114. package/dist/themes/tokens/colours/primitives.js +1 -1
  115. package/dist/themes/tokens/colours/primitives.js.map +1 -1
  116. package/dist/themes/tokens/colours/semantic.cjs.js +1 -1
  117. package/dist/themes/tokens/colours/semantic.cjs.js.map +1 -1
  118. package/dist/themes/tokens/colours/semantic.d.ts +223 -4
  119. package/dist/themes/tokens/colours/semantic.js +1 -1
  120. package/dist/themes/tokens/colours/semantic.js.map +1 -1
  121. package/dist/themes/tokens/colours/types.d.ts +14 -14
  122. package/dist/themes/tokens/shadows/shadows.cjs.js +2 -0
  123. package/dist/themes/tokens/shadows/shadows.cjs.js.map +1 -0
  124. package/dist/themes/tokens/shadows/shadows.d.ts +8 -0
  125. package/dist/themes/tokens/shadows/shadows.js +2 -0
  126. package/dist/themes/tokens/shadows/shadows.js.map +1 -0
  127. package/dist/themes/typography.cjs.js.map +1 -1
  128. package/dist/themes/typography.d.ts +31 -2
  129. package/dist/themes/typography.js.map +1 -1
  130. package/dist/utilities/formValidation.cjs.js +1 -1
  131. package/dist/utilities/formValidation.cjs.js.map +1 -1
  132. package/dist/utilities/formValidation.d.ts +1 -1
  133. package/dist/utilities/formValidation.js.map +1 -1
  134. package/dist/utilities/genericUtilities.cjs.js.map +1 -1
  135. package/dist/utilities/genericUtilities.js.map +1 -1
  136. package/dist/utilities/renderUtilities.cjs.js.map +1 -1
  137. package/dist/utilities/renderUtilities.js.map +1 -1
  138. package/package.json +5 -4
  139. package/dist/components/Button/index.cjs.js +0 -2
  140. package/dist/components/Button/index.cjs.js.map +0 -1
  141. package/dist/components/Button/index.d.ts +0 -6
  142. package/dist/components/Button/index.js +0 -2
  143. package/dist/components/Button/index.js.map +0 -1
  144. package/dist/themes/tokens/colours/index.cjs.js +0 -2
  145. package/dist/themes/tokens/colours/index.cjs.js.map +0 -1
  146. package/dist/themes/tokens/colours/index.d.ts +0 -3
  147. package/dist/themes/tokens/colours/index.js +0 -2
  148. package/dist/themes/tokens/colours/index.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs.js","sources":["../../../src/components/FDErrorBoundary/index.tsx"],"sourcesContent":["import { ErrorBoundary } from 'react-error-boundary';\nimport { type ReactNode } from 'react';\nimport { styled } from '@mui/material/styles';\n\nconst StyledTextContainer = styled('div')(({ theme }) => ({\n marginTop: theme.spacing(2),\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n}));\n\ntype Props = {\n somethingWentWrongText: string;\n};\n\nconst FallbackComponent = ({ somethingWentWrongText }: Props) => {\n return <StyledTextContainer>{somethingWentWrongText}</StyledTextContainer>;\n};\n\nconst FDErrorBoundary = ({\n identifier,\n children,\n somethingWentWrongText,\n}: {\n identifier: string;\n children: ReactNode;\n somethingWentWrongText: string;\n}) => {\n const fallbackComponentWithProps = () => <FallbackComponent somethingWentWrongText={somethingWentWrongText} />;\n\n return (\n <ErrorBoundary\n FallbackComponent={fallbackComponentWithProps}\n onError={(error, info) => {\n window.fdlogger?.error(`${identifier?.toString()} Error Boundary`, {\n message: error?.message,\n stack: info,\n });\n }}\n >\n {children}\n </ErrorBoundary>\n );\n};\n\nexport default FDErrorBoundary;\n"],"names":["StyledTextContainer","styled","theme","marginTop","spacing","display","justifyContent","alignItems","FallbackComponent","somethingWentWrongText","_jsx","jsx","children","identifier","ErrorBoundary","onError","error","info","window","fdlogger","toString","message","stack"],"mappings":"mGAIA,MAAMA,kCAAsBC,OAAO,MAAPA,EAAc,EAAGC,YAAa,CACtDC,UAAWD,EAAME,QAAQ,GACzBC,QAAS,OACTC,eAAgB,SAChBC,WAAY,aAOVC,EAAoB,EAAGC,4BAClBC,EAACC,IAAAX,EAAqB,CAAAY,SAAAH,mBAGT,EACpBI,aACAD,WACAH,4BASIC,EAAAC,IAACG,EAAaA,cAAA,CACVN,kBAJ2B,IAAME,EAAAC,IAACH,EAAiB,CAACC,uBAAwBA,IAK5EM,QAAS,CAACC,EAAOC,KACbC,OAAOC,UAAUH,MAAM,GAAGH,GAAYO,4BAA6B,CAC/DC,QAASL,GAAOK,QAChBC,MAAOL,GACT,EAGLL,SAAAA"}
1
+ {"version":3,"file":"index.cjs.js","sources":["../../../src/components/FDErrorBoundary/index.tsx"],"sourcesContent":["import { ErrorBoundary } from 'react-error-boundary';\nimport { type ReactNode } from 'react';\nimport { styled } from '@mui/material/styles';\n\nconst StyledTextContainer = styled('div')(({ theme }) => ({\n marginTop: theme.spacing(2),\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n}));\n\ntype Props = {\n somethingWentWrongText: string;\n};\n\nconst FallbackComponent = ({ somethingWentWrongText }: Props) => {\n return <StyledTextContainer>{somethingWentWrongText}</StyledTextContainer>;\n};\n\nconst FDErrorBoundary = ({\n identifier,\n children,\n somethingWentWrongText,\n}: {\n identifier: string;\n children: ReactNode;\n somethingWentWrongText: string;\n}) => {\n const fallbackComponentWithProps = () => <FallbackComponent somethingWentWrongText={somethingWentWrongText} />;\n\n return (\n <ErrorBoundary\n FallbackComponent={fallbackComponentWithProps}\n onError={(error, info) => {\n window.fdlogger?.error(`${identifier?.toString()} Error Boundary`, {\n message: error?.message,\n stack: info,\n });\n }}\n >\n {children}\n </ErrorBoundary>\n );\n};\n\nexport default FDErrorBoundary;\n"],"names":["StyledTextContainer","styled","theme","marginTop","spacing","display","justifyContent","alignItems","FallbackComponent","somethingWentWrongText","_jsx","jsx","children","identifier","ErrorBoundary","onError","error","info","window","fdlogger","toString","message","stack"],"mappings":"mGAIA,MAAMA,kCAAsBC,OAAO,MAAPA,EAAc,EAAGC,YAAa,CACtDC,UAAWD,EAAME,QAAQ,GACzBC,QAAS,OACTC,eAAgB,SAChBC,WAAY,aAOVC,EAAoB,EAAGC,4BAClBC,EAACC,IAAAX,EAAqB,CAAAY,SAAAH,mBAGT,EACpBI,aACAD,WACAH,4BASIC,EAAAC,IAACG,EAAaA,cAAA,CACVN,kBAJ2B,IAAME,EAAAC,IAACH,EAAiB,CAACC,uBAAwBA,IAK5EM,QAAS,CAACC,EAAOC,KACbC,OAAOC,UAAUH,MAAM,GAAGH,GAAYO,4BAA6B,CAC/DC,QAASL,GAAOK,QAChBC,MAAOL,KAIdL,SAAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/FDErrorBoundary/index.tsx"],"sourcesContent":["import { ErrorBoundary } from 'react-error-boundary';\nimport { type ReactNode } from 'react';\nimport { styled } from '@mui/material/styles';\n\nconst StyledTextContainer = styled('div')(({ theme }) => ({\n marginTop: theme.spacing(2),\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n}));\n\ntype Props = {\n somethingWentWrongText: string;\n};\n\nconst FallbackComponent = ({ somethingWentWrongText }: Props) => {\n return <StyledTextContainer>{somethingWentWrongText}</StyledTextContainer>;\n};\n\nconst FDErrorBoundary = ({\n identifier,\n children,\n somethingWentWrongText,\n}: {\n identifier: string;\n children: ReactNode;\n somethingWentWrongText: string;\n}) => {\n const fallbackComponentWithProps = () => <FallbackComponent somethingWentWrongText={somethingWentWrongText} />;\n\n return (\n <ErrorBoundary\n FallbackComponent={fallbackComponentWithProps}\n onError={(error, info) => {\n window.fdlogger?.error(`${identifier?.toString()} Error Boundary`, {\n message: error?.message,\n stack: info,\n });\n }}\n >\n {children}\n </ErrorBoundary>\n );\n};\n\nexport default FDErrorBoundary;\n"],"names":["StyledTextContainer","styled","theme","marginTop","spacing","display","justifyContent","alignItems","FallbackComponent","somethingWentWrongText","_jsx","children","FDErrorBoundary","identifier","ErrorBoundary","onError","error","info","window","fdlogger","toString","message","stack"],"mappings":"yJAIA,MAAMA,EAAsBC,EAAO,MAAPA,EAAc,EAAGC,YAAa,CACtDC,UAAWD,EAAME,QAAQ,GACzBC,QAAS,OACTC,eAAgB,SAChBC,WAAY,aAOVC,EAAoB,EAAGC,4BAClBC,EAACV,EAAqB,CAAAW,SAAAF,IAG3BG,EAAkB,EACpBC,aACAF,WACAF,4BASIC,EAACI,EAAa,CACVN,kBAJ2B,IAAME,EAACF,EAAiB,CAACC,uBAAwBA,IAK5EM,QAAS,CAACC,EAAOC,KACbC,OAAOC,UAAUH,MAAM,GAAGH,GAAYO,4BAA6B,CAC/DC,QAASL,GAAOK,QAChBC,MAAOL,GACT,EAGLN,SAAAA"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/components/FDErrorBoundary/index.tsx"],"sourcesContent":["import { ErrorBoundary } from 'react-error-boundary';\nimport { type ReactNode } from 'react';\nimport { styled } from '@mui/material/styles';\n\nconst StyledTextContainer = styled('div')(({ theme }) => ({\n marginTop: theme.spacing(2),\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n}));\n\ntype Props = {\n somethingWentWrongText: string;\n};\n\nconst FallbackComponent = ({ somethingWentWrongText }: Props) => {\n return <StyledTextContainer>{somethingWentWrongText}</StyledTextContainer>;\n};\n\nconst FDErrorBoundary = ({\n identifier,\n children,\n somethingWentWrongText,\n}: {\n identifier: string;\n children: ReactNode;\n somethingWentWrongText: string;\n}) => {\n const fallbackComponentWithProps = () => <FallbackComponent somethingWentWrongText={somethingWentWrongText} />;\n\n return (\n <ErrorBoundary\n FallbackComponent={fallbackComponentWithProps}\n onError={(error, info) => {\n window.fdlogger?.error(`${identifier?.toString()} Error Boundary`, {\n message: error?.message,\n stack: info,\n });\n }}\n >\n {children}\n </ErrorBoundary>\n );\n};\n\nexport default FDErrorBoundary;\n"],"names":["StyledTextContainer","styled","theme","marginTop","spacing","display","justifyContent","alignItems","FallbackComponent","somethingWentWrongText","_jsx","children","FDErrorBoundary","identifier","ErrorBoundary","onError","error","info","window","fdlogger","toString","message","stack"],"mappings":"yJAIA,MAAMA,EAAsBC,EAAO,MAAPA,EAAc,EAAGC,YAAa,CACtDC,UAAWD,EAAME,QAAQ,GACzBC,QAAS,OACTC,eAAgB,SAChBC,WAAY,aAOVC,EAAoB,EAAGC,4BAClBC,EAACV,EAAqB,CAAAW,SAAAF,IAG3BG,EAAkB,EACpBC,aACAF,WACAF,4BASIC,EAACI,EAAa,CACVN,kBAJ2B,IAAME,EAACF,EAAiB,CAACC,uBAAwBA,IAK5EM,QAAS,CAACC,EAAOC,KACbC,OAAOC,UAAUH,MAAM,GAAGH,GAAYO,4BAA6B,CAC/DC,QAASL,GAAOK,QAChBC,MAAOL,KAIdN,SAAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/Form/FormItemLayout/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Grid, { type GridSize } from '@mui/material/Grid';\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nconst StyledGrid = styled(Grid)(({ theme }) => ({\n padding: theme.spacing(4.75, 0, 2.5, 0),\n alignItems: 'flex-start',\n flexWrap: 'wrap',\n borderBottom: '1px solid rgba(0,0,0,0.2)',\n}));\n\nconst StyledDescription = styled('div')(({ theme }) => ({\n paddingBottom: theme.spacing(2),\n paddingRight: theme.spacing(1.75),\n}));\n\nexport interface FormItemLayoutProps {\n children: React.ReactNode;\n description?: React.ReactNode;\n descriptionTranslated?: string;\n label?: React.ReactNode;\n labelTranslated?: string;\n mdProportion?: '4x8' | '8x4' | '10x2' | '12x12';\n smProportion?: '4x8' | '8x4' | '10x2' | '12x12';\n}\n\ntype Props = FormItemLayoutProps;\nconst FormItemLayout = (props: Props) => {\n const { children, description, descriptionTranslated, label, labelTranslated, mdProportion, smProportion } =\n props;\n\n const [titleProportion, dataProportion] = mdProportion\n ? mdProportion.split('x').map((m) => parseInt(m, 10))\n : [4, 8];\n const [titleProportionSm, dataProportionSm] = smProportion\n ? smProportion.split('x').map((m) => parseInt(m, 10))\n : [];\n const castToGridSize = (data: unknown) => data as GridSize;\n\n return (\n <StyledGrid container>\n <Grid\n item\n base={12}\n mobile={castToGridSize(titleProportionSm)}\n tablet={castToGridSize(titleProportion)}\n >\n <Typography color=\"textPrimary\" component=\"h3\" variant=\"subtitle1\">\n {labelTranslated || label || null}\n </Typography>\n\n {descriptionTranslated || description ? (\n <StyledDescription>\n <Typography color=\"textSecondary\" variant=\"caption\">\n {descriptionTranslated || description || null}\n </Typography>\n </StyledDescription>\n ) : null}\n </Grid>\n <Grid item base={12} mobile={castToGridSize(dataProportionSm)} tablet={castToGridSize(dataProportion)}>\n {children}\n </Grid>\n </StyledGrid>\n );\n};\n\nexport default FormItemLayout;\n"],"names":["StyledGrid","styled","Grid","theme","padding","spacing","alignItems","flexWrap","borderBottom","StyledDescription","paddingBottom","paddingRight","props","children","description","descriptionTranslated","label","labelTranslated","mdProportion","smProportion","titleProportion","dataProportion","split","map","m","parseInt","titleProportionSm","dataProportionSm","_jsxs","container","item","base","mobile","tablet","_jsx","Typography","color","component","variant","jsx"],"mappings":"6KAMA,MAAMA,EAAaC,EAAAA,OAAOC,EAAPD,EAAa,EAAGE,YAAa,CAC9CC,QAASD,EAAME,QAAQ,KAAM,EAAG,IAAK,GACrCC,WAAY,aACZC,SAAU,OACVC,aAAc,gCAGVC,EAAoBR,EAAAA,OAAO,MAAPA,EAAc,EAAGE,YAAa,CACtDO,cAAeP,EAAME,QAAQ,GAC7BM,aAAcR,EAAME,QAAQ,yBAcNO,IACtB,MAAMC,SAAEA,EAAQC,YAAEA,EAAWC,sBAAEA,EAAqBC,MAAEA,EAAKC,gBAAEA,EAAeC,aAAEA,EAAYC,aAAEA,GAC1FP,GAEKQ,EAAiBC,GAAkBH,EACtCA,EAAaI,MAAM,KAAKC,KAAKC,GAAMC,SAASD,EAAG,MAC/C,CAAC,EAAG,IACDE,EAAmBC,GAAoBR,EAC1CA,EAAaG,MAAM,KAAKC,KAAKC,GAAMC,SAASD,EAAG,MAC/C,GAGJ,OACEI,EAAAA,KAAC5B,EAAW,CAAA6B,uBACVD,OAAC1B,EACC,CAAA4B,MACA,EAAAC,KAAM,GACNC,OAAuBN,EACvBO,OAAuBb,EAEvBP,SAAA,CAAAqB,EAAAA,IAACC,EAAU,CAACC,MAAM,cAAcC,UAAU,KAAKC,QAAQ,YAAWzB,SAC/DI,GAAmBD,GAAS,OAG9BD,GAAyBD,EACxBoB,EAAAK,IAAC9B,EAAiB,CAAAI,SAChBqB,EAACK,IAAAJ,GAAWC,MAAM,gBAAgBE,QAAQ,UACvCzB,SAAAE,GAAyBD,GAAe,SAG3C,QAENoB,EAACK,IAAArC,EAAK,CAAA4B,MAAK,EAAAC,KAAM,GAAIC,OAAuBL,EAAmBM,OAAuBZ,EAAeR,SAClGA,MAEQ"}
1
+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/Form/FormItemLayout/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Grid, { type GridSize } from '@mui/material/Grid';\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nconst StyledGrid = styled(Grid)(({ theme }) => ({\n padding: theme.spacing(4.75, 0, 2.5, 0),\n alignItems: 'flex-start',\n flexWrap: 'wrap',\n borderBottom: '1px solid rgba(0,0,0,0.2)',\n}));\n\nconst StyledDescription = styled('div')(({ theme }) => ({\n paddingBottom: theme.spacing(2),\n paddingRight: theme.spacing(1.75),\n}));\n\nexport interface FormItemLayoutProps {\n children: React.ReactNode;\n description?: React.ReactNode;\n descriptionTranslated?: string;\n label?: React.ReactNode;\n labelTranslated?: string;\n mdProportion?: '4x8' | '8x4' | '10x2' | '12x12';\n smProportion?: '4x8' | '8x4' | '10x2' | '12x12';\n}\n\ntype Props = FormItemLayoutProps;\nconst FormItemLayout = (props: Props) => {\n const { children, description, descriptionTranslated, label, labelTranslated, mdProportion, smProportion } =\n props;\n\n const [titleProportion, dataProportion] = mdProportion\n ? mdProportion.split('x').map((m) => parseInt(m, 10))\n : [4, 8];\n const [titleProportionSm, dataProportionSm] = smProportion\n ? smProportion.split('x').map((m) => parseInt(m, 10))\n : [];\n const castToGridSize = (data: unknown) => data as GridSize;\n\n return (\n <StyledGrid container>\n <Grid\n item\n base={12}\n mobile={castToGridSize(titleProportionSm)}\n tablet={castToGridSize(titleProportion)}\n >\n <Typography color=\"textPrimary\" component=\"h3\" variant=\"subtitle1\">\n {labelTranslated || label || null}\n </Typography>\n\n {descriptionTranslated || description ? (\n <StyledDescription>\n <Typography color=\"textSecondary\" variant=\"caption\">\n {descriptionTranslated || description || null}\n </Typography>\n </StyledDescription>\n ) : null}\n </Grid>\n <Grid item base={12} mobile={castToGridSize(dataProportionSm)} tablet={castToGridSize(dataProportion)}>\n {children}\n </Grid>\n </StyledGrid>\n );\n};\n\nexport default FormItemLayout;\n"],"names":["StyledGrid","styled","Grid","theme","padding","spacing","alignItems","flexWrap","borderBottom","StyledDescription","paddingBottom","paddingRight","props","children","description","descriptionTranslated","label","labelTranslated","mdProportion","smProportion","titleProportion","dataProportion","split","map","m","parseInt","titleProportionSm","dataProportionSm","_jsxs","container","item","base","mobile","tablet","_jsx","Typography","color","component","variant","jsx"],"mappings":"6KAMA,MAAMA,EAAaC,EAAAA,OAAOC,EAAPD,EAAa,EAAGE,YAAa,CAC9CC,QAASD,EAAME,QAAQ,KAAM,EAAG,IAAK,GACrCC,WAAY,aACZC,SAAU,OACVC,aAAc,gCAGVC,EAAoBR,EAAAA,OAAO,MAAPA,EAAc,EAAGE,YAAa,CACtDO,cAAeP,EAAME,QAAQ,GAC7BM,aAAcR,EAAME,QAAQ,yBAcNO,IACtB,MAAMC,SAAEA,EAAQC,YAAEA,EAAWC,sBAAEA,EAAqBC,MAAEA,EAAKC,gBAAEA,EAAeC,aAAEA,EAAYC,aAAEA,GAC1FP,GAEKQ,EAAiBC,GAAkBH,EACtCA,EAAaI,MAAM,KAAKC,KAAKC,GAAMC,SAASD,EAAG,MAC/C,CAAC,EAAG,IACDE,EAAmBC,GAAoBR,EAC1CA,EAAaG,MAAM,KAAKC,KAAKC,GAAMC,SAASD,EAAG,MAC/C,GAGJ,OACEI,EAAAA,KAAC5B,EAAW,CAAA6B,uBACVD,OAAC1B,EACC,CAAA4B,MACA,EAAAC,KAAM,GACNC,OAAuBN,EACvBO,OAAuBb,EAEvBP,SAAA,CAAAqB,EAAAA,IAACC,EAAU,CAACC,MAAM,cAAcC,UAAU,KAAKC,QAAQ,YAAWzB,SAC/DI,GAAmBD,GAAS,OAG9BD,GAAyBD,EACxBoB,EAAAK,IAAC9B,EAAiB,CAAAI,SAChBqB,EAACK,IAAAJ,GAAWC,MAAM,gBAAgBE,QAAQ,UACvCzB,SAAAE,GAAyBD,GAAe,SAG3C,QAENoB,EAACK,IAAArC,EAAK,CAAA4B,MAAK,EAAAC,KAAM,GAAIC,OAAuBL,EAAmBM,OAAuBZ,EAAeR,SAClGA"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../src/components/Form/FormItemLayout/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Grid, { type GridSize } from '@mui/material/Grid';\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nconst StyledGrid = styled(Grid)(({ theme }) => ({\n padding: theme.spacing(4.75, 0, 2.5, 0),\n alignItems: 'flex-start',\n flexWrap: 'wrap',\n borderBottom: '1px solid rgba(0,0,0,0.2)',\n}));\n\nconst StyledDescription = styled('div')(({ theme }) => ({\n paddingBottom: theme.spacing(2),\n paddingRight: theme.spacing(1.75),\n}));\n\nexport interface FormItemLayoutProps {\n children: React.ReactNode;\n description?: React.ReactNode;\n descriptionTranslated?: string;\n label?: React.ReactNode;\n labelTranslated?: string;\n mdProportion?: '4x8' | '8x4' | '10x2' | '12x12';\n smProportion?: '4x8' | '8x4' | '10x2' | '12x12';\n}\n\ntype Props = FormItemLayoutProps;\nconst FormItemLayout = (props: Props) => {\n const { children, description, descriptionTranslated, label, labelTranslated, mdProportion, smProportion } =\n props;\n\n const [titleProportion, dataProportion] = mdProportion\n ? mdProportion.split('x').map((m) => parseInt(m, 10))\n : [4, 8];\n const [titleProportionSm, dataProportionSm] = smProportion\n ? smProportion.split('x').map((m) => parseInt(m, 10))\n : [];\n const castToGridSize = (data: unknown) => data as GridSize;\n\n return (\n <StyledGrid container>\n <Grid\n item\n base={12}\n mobile={castToGridSize(titleProportionSm)}\n tablet={castToGridSize(titleProportion)}\n >\n <Typography color=\"textPrimary\" component=\"h3\" variant=\"subtitle1\">\n {labelTranslated || label || null}\n </Typography>\n\n {descriptionTranslated || description ? (\n <StyledDescription>\n <Typography color=\"textSecondary\" variant=\"caption\">\n {descriptionTranslated || description || null}\n </Typography>\n </StyledDescription>\n ) : null}\n </Grid>\n <Grid item base={12} mobile={castToGridSize(dataProportionSm)} tablet={castToGridSize(dataProportion)}>\n {children}\n </Grid>\n </StyledGrid>\n );\n};\n\nexport default FormItemLayout;\n"],"names":["StyledGrid","styled","Grid","theme","padding","spacing","alignItems","flexWrap","borderBottom","StyledDescription","paddingBottom","paddingRight","FormItemLayout","props","children","description","descriptionTranslated","label","labelTranslated","mdProportion","smProportion","titleProportion","dataProportion","split","map","m","parseInt","titleProportionSm","dataProportionSm","_jsxs","container","item","base","mobile","tablet","_jsx","Typography","color","component","variant"],"mappings":"wLAMA,MAAMA,EAAaC,EAAOC,EAAPD,EAAa,EAAGE,YAAa,CAC9CC,QAASD,EAAME,QAAQ,KAAM,EAAG,IAAK,GACrCC,WAAY,aACZC,SAAU,OACVC,aAAc,gCAGVC,EAAoBR,EAAO,MAAPA,EAAc,EAAGE,YAAa,CACtDO,cAAeP,EAAME,QAAQ,GAC7BM,aAAcR,EAAME,QAAQ,UAcxBO,EAAkBC,IACtB,MAAMC,SAAEA,EAAQC,YAAEA,EAAWC,sBAAEA,EAAqBC,MAAEA,EAAKC,gBAAEA,EAAeC,aAAEA,EAAYC,aAAEA,GAC1FP,GAEKQ,EAAiBC,GAAkBH,EACtCA,EAAaI,MAAM,KAAKC,KAAKC,GAAMC,SAASD,EAAG,MAC/C,CAAC,EAAG,IACDE,EAAmBC,GAAoBR,EAC1CA,EAAaG,MAAM,KAAKC,KAAKC,GAAMC,SAASD,EAAG,MAC/C,GAGJ,OACEI,EAAC7B,EAAW,CAAA8B,uBACVD,EAAC3B,EACC,CAAA6B,MACA,EAAAC,KAAM,GACNC,OAAuBN,EACvBO,OAAuBb,EAEvBP,SAAA,CAAAqB,EAACC,EAAU,CAACC,MAAM,cAAcC,UAAU,KAAKC,QAAQ,YAAWzB,SAC/DI,GAAmBD,GAAS,OAG9BD,GAAyBD,EACxBoB,EAAC1B,EAAiB,CAAAK,SAChBqB,EAACC,GAAWC,MAAM,gBAAgBE,QAAQ,UACvCzB,SAAAE,GAAyBD,GAAe,SAG3C,QAENoB,EAACjC,EAAK,CAAA6B,MAAK,EAAAC,KAAM,GAAIC,OAAuBL,EAAmBM,OAAuBZ,EAAeR,SAClGA,MAEQ"}
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Form/FormItemLayout/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Grid, { type GridSize } from '@mui/material/Grid';\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nconst StyledGrid = styled(Grid)(({ theme }) => ({\n padding: theme.spacing(4.75, 0, 2.5, 0),\n alignItems: 'flex-start',\n flexWrap: 'wrap',\n borderBottom: '1px solid rgba(0,0,0,0.2)',\n}));\n\nconst StyledDescription = styled('div')(({ theme }) => ({\n paddingBottom: theme.spacing(2),\n paddingRight: theme.spacing(1.75),\n}));\n\nexport interface FormItemLayoutProps {\n children: React.ReactNode;\n description?: React.ReactNode;\n descriptionTranslated?: string;\n label?: React.ReactNode;\n labelTranslated?: string;\n mdProportion?: '4x8' | '8x4' | '10x2' | '12x12';\n smProportion?: '4x8' | '8x4' | '10x2' | '12x12';\n}\n\ntype Props = FormItemLayoutProps;\nconst FormItemLayout = (props: Props) => {\n const { children, description, descriptionTranslated, label, labelTranslated, mdProportion, smProportion } =\n props;\n\n const [titleProportion, dataProportion] = mdProportion\n ? mdProportion.split('x').map((m) => parseInt(m, 10))\n : [4, 8];\n const [titleProportionSm, dataProportionSm] = smProportion\n ? smProportion.split('x').map((m) => parseInt(m, 10))\n : [];\n const castToGridSize = (data: unknown) => data as GridSize;\n\n return (\n <StyledGrid container>\n <Grid\n item\n base={12}\n mobile={castToGridSize(titleProportionSm)}\n tablet={castToGridSize(titleProportion)}\n >\n <Typography color=\"textPrimary\" component=\"h3\" variant=\"subtitle1\">\n {labelTranslated || label || null}\n </Typography>\n\n {descriptionTranslated || description ? (\n <StyledDescription>\n <Typography color=\"textSecondary\" variant=\"caption\">\n {descriptionTranslated || description || null}\n </Typography>\n </StyledDescription>\n ) : null}\n </Grid>\n <Grid item base={12} mobile={castToGridSize(dataProportionSm)} tablet={castToGridSize(dataProportion)}>\n {children}\n </Grid>\n </StyledGrid>\n );\n};\n\nexport default FormItemLayout;\n"],"names":["StyledGrid","styled","Grid","theme","padding","spacing","alignItems","flexWrap","borderBottom","StyledDescription","paddingBottom","paddingRight","FormItemLayout","props","children","description","descriptionTranslated","label","labelTranslated","mdProportion","smProportion","titleProportion","dataProportion","split","map","m","parseInt","titleProportionSm","dataProportionSm","_jsxs","container","item","base","mobile","tablet","_jsx","Typography","color","component","variant"],"mappings":"wLAMA,MAAMA,EAAaC,EAAOC,EAAPD,EAAa,EAAGE,YAAa,CAC9CC,QAASD,EAAME,QAAQ,KAAM,EAAG,IAAK,GACrCC,WAAY,aACZC,SAAU,OACVC,aAAc,gCAGVC,EAAoBR,EAAO,MAAPA,EAAc,EAAGE,YAAa,CACtDO,cAAeP,EAAME,QAAQ,GAC7BM,aAAcR,EAAME,QAAQ,UAcxBO,EAAkBC,IACtB,MAAMC,SAAEA,EAAQC,YAAEA,EAAWC,sBAAEA,EAAqBC,MAAEA,EAAKC,gBAAEA,EAAeC,aAAEA,EAAYC,aAAEA,GAC1FP,GAEKQ,EAAiBC,GAAkBH,EACtCA,EAAaI,MAAM,KAAKC,KAAKC,GAAMC,SAASD,EAAG,MAC/C,CAAC,EAAG,IACDE,EAAmBC,GAAoBR,EAC1CA,EAAaG,MAAM,KAAKC,KAAKC,GAAMC,SAASD,EAAG,MAC/C,GAGJ,OACEI,EAAC7B,EAAW,CAAA8B,uBACVD,EAAC3B,EACC,CAAA6B,MACA,EAAAC,KAAM,GACNC,OAAuBN,EACvBO,OAAuBb,EAEvBP,SAAA,CAAAqB,EAACC,EAAU,CAACC,MAAM,cAAcC,UAAU,KAAKC,QAAQ,YAAWzB,SAC/DI,GAAmBD,GAAS,OAG9BD,GAAyBD,EACxBoB,EAAC1B,EAAiB,CAAAK,SAChBqB,EAACC,GAAWC,MAAM,gBAAgBE,QAAQ,UACvCzB,SAAAE,GAAyBD,GAAe,SAG3C,QAENoB,EAACjC,EAAK,CAAA6B,MAAK,EAAAC,KAAM,GAAIC,OAAuBL,EAAmBM,OAAuBZ,EAAeR,SAClGA"}
@@ -1,2 +1,2 @@
1
- "use strict";var e=require("react/jsx-runtime"),l=require("@mui/material/Autocomplete"),i=require("@mui/material/CircularProgress"),r=require("@mui/material/TextField"),t=require("@mui/material/Typography"),a=require("formik");require("react");var o=require("../../../custom-hooks/useRenderValidText.cjs.js"),n=require("../FormItemLayout/index.cjs.js");const d=({field:t,form:a,fieldName:n,options:d,label:u,variant:s,placeholder:p,getOptionLabel:m,isOptionEqualToValue:h,onChange:c,onInputChange:g,onScroll:x,layout:q="horizontal",disabled:v=!1,loading:b=!1,required:j=!1,multiple:T=!1,limitTags:f})=>{const{errors:y,touched:C,isSubmitting:I}=a,O=y[t.name],V=!!O&&C[t.name],E=o({fieldError:O,showError:V,touched:!!C[t.name],value:t.value},"Valid");return e.jsx(l,{options:d,getOptionLabel:m,isOptionEqualToValue:h,onChange:(e,l)=>{a.setFieldValue(n,l),c&&c(e,l)},onInputChange:g,disabled:I||v,fullWidth:!0,value:t.value||(T?[]:null),loading:b,renderInput:l=>e.jsx(r,{...l,label:"standard"===s?void 0:u,variant:s,"data-testid":`text-field-${n}`,fullWidth:!0,style:{paddingRight:"horizontal"===q?16:0},placeholder:p||void 0,required:j,error:V,helperText:E,slotProps:{input:{...l.InputProps,endAdornment:e.jsxs(e.Fragment,{children:[b&&e.jsx(i,{color:"inherit",size:25}),l.InputProps.endAdornment]})},formHelperText:{children:" ",style:{textAlign:"right"}}}}),multiple:T,limitTags:T?f??2:void 0,slotProps:{listbox:{onScroll:x}}})};module.exports=({label:l,fieldName:i,options:r,placeholder:o,getOptionLabel:u,validation:s,onChange:p,onInputChange:m,isOptionEqualToValue:h,onScroll:c,layout:g="horizontal",variant:x="outlined",disabled:q=!1,loading:v=!1,required:b=!1,multiple:j=!1,limitTags:T})=>{const f=()=>e.jsx(a.Field,{name:i,validate:s,children:t=>e.jsx(d,{...t,fieldName:i,options:r,label:l,variant:x,placeholder:o,getOptionLabel:u,isOptionEqualToValue:h,onChange:p,onInputChange:m,onScroll:c,layout:g,disabled:q,loading:v,required:b,multiple:j,limitTags:T})});return"vertical"===g?e.jsxs(e.Fragment,{children:["standard"===x&&e.jsx(t,{variant:"subtitle1",component:"h3",color:"textPrimary",children:l}),f()]}):e.jsx(n,{label:l,children:f()})};
1
+ "use strict";var e=require("react/jsx-runtime");require("react");var l=require("@mui/material/Autocomplete"),i=require("@mui/material/CircularProgress"),r=require("@mui/material/TextField"),t=require("@mui/material/Typography"),a=require("formik"),o=require("../../../custom-hooks/useRenderValidText.cjs.js"),n=require("../FormItemLayout/index.cjs.js");const d=({field:t,form:a,fieldName:n,options:d,label:u,variant:s,placeholder:p,getOptionLabel:m,isOptionEqualToValue:h,onChange:c,onInputChange:g,onScroll:x,layout:q="horizontal",disabled:b=!1,loading:v=!1,required:j=!1,multiple:T=!1,limitTags:f})=>{const{errors:y,touched:C,isSubmitting:I}=a,O=t.value,V=y[t.name],E=!!V&&C[t.name],F=o({fieldError:V,showError:E,touched:!!C[t.name],value:O},"Valid");return e.jsx(l,{fullWidth:!0,disabled:I||b,getOptionLabel:m,isOptionEqualToValue:h,limitTags:T?f??2:void 0,loading:v,multiple:T,options:d,renderInput:l=>e.jsx(r,{...l,fullWidth:!0,"data-testid":`text-field-${n}`,error:E,helperText:F,label:"standard"===s?void 0:u,placeholder:p||void 0,required:j,slotProps:{input:{...l.InputProps,endAdornment:e.jsxs(e.Fragment,{children:[v&&e.jsx(i,{color:"inherit",size:25}),l.InputProps.endAdornment]})},formHelperText:{children:" ",style:{textAlign:"right"}}},style:{paddingRight:"horizontal"===q?16:0},variant:s}),slotProps:{listbox:{onScroll:x}},value:O||(T?[]:null),onChange:(e,l)=>{a.setFieldValue(n,l),c&&c(e,l)},onInputChange:g})};module.exports=({label:l,fieldName:i,options:r,placeholder:o,getOptionLabel:u,validation:s,onChange:p,onInputChange:m,isOptionEqualToValue:h,onScroll:c,layout:g="horizontal",variant:x="outlined",disabled:q=!1,loading:b=!1,required:v=!1,multiple:j=!1,limitTags:T})=>{const f=()=>e.jsx(a.Field,{name:i,validate:s,children:t=>e.jsx(d,{...t,disabled:q,fieldName:i,getOptionLabel:u,isOptionEqualToValue:h,label:l,layout:g,limitTags:T,loading:b,multiple:j,options:r,placeholder:o,required:v,variant:x,onChange:p,onInputChange:m,onScroll:c})});return"vertical"===g?e.jsxs(e.Fragment,{children:["standard"===x&&e.jsx(t,{color:"textPrimary",component:"h3",variant:"subtitle1",children:l}),f()]}):e.jsx(n,{label:l,children:f()})};
2
2
  //# sourceMappingURL=index.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/Form/GenericAutocompleteField/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport Autocomplete from '@mui/material/Autocomplete';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport TextField, { type TextFieldProps } from '@mui/material/TextField';\nimport Typography from '@mui/material/Typography';\nimport { Field, type FieldProps } from 'formik';\nimport { type SyntheticEvent } from 'react';\nimport useRenderValidText from '../../../custom-hooks/useRenderValidText';\nimport FormItemLayout from '../FormItemLayout';\n\nexport type Props<T> = {\n label: string;\n fieldName: string;\n options: T[];\n placeholder?: string;\n getOptionLabel?: (option: T) => string;\n validation?: (value: T | T[]) => string | undefined;\n onChange?: (e: SyntheticEvent, value: T | T[]) => void;\n onInputChange?: (e: SyntheticEvent, value: string) => void;\n isOptionEqualToValue?: (option: T, value: T) => boolean;\n onScroll?: (e: React.UIEvent<HTMLUListElement, UIEvent>) => void;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n loading?: boolean;\n required?: boolean;\n multiple?: boolean;\n limitTags?: number;\n};\n\ntype AutocompleteFieldProps<T> = {\n field: FieldProps['field'];\n form: FieldProps['form'];\n fieldName: string;\n options: T[];\n label: string;\n variant: TextFieldProps['variant'];\n placeholder?: string;\n getOptionLabel?: (option: T) => string;\n isOptionEqualToValue?: (option: T, value: T) => boolean;\n onChange?: (e: SyntheticEvent, value: T | T[]) => void;\n onInputChange?: (e: SyntheticEvent, value: string) => void;\n onScroll?: (e: React.UIEvent<HTMLUListElement, UIEvent>) => void;\n layout?: 'horizontal' | 'vertical';\n disabled?: boolean;\n loading?: boolean;\n required?: boolean;\n multiple?: boolean;\n limitTags?: number;\n};\n\nconst AutocompleteFieldComponent = <T,>({\n field,\n form,\n fieldName,\n options,\n label,\n variant,\n placeholder,\n getOptionLabel,\n isOptionEqualToValue,\n onChange,\n onInputChange,\n onScroll,\n layout = 'horizontal',\n disabled = false,\n loading = false,\n required = false,\n multiple = false,\n limitTags,\n}: AutocompleteFieldProps<T>) => {\n const { errors, touched, isSubmitting } = form;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: field.value,\n },\n 'Valid',\n );\n\n return (\n <Autocomplete\n options={options}\n getOptionLabel={getOptionLabel}\n isOptionEqualToValue={isOptionEqualToValue}\n onChange={(e: SyntheticEvent, value: T[]) => {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(fieldName, value);\n if (onChange) {\n onChange(e, value);\n }\n }}\n onInputChange={onInputChange}\n disabled={isSubmitting || disabled}\n fullWidth\n value={field.value || (multiple ? [] : null)}\n loading={loading}\n renderInput={(params) => (\n <TextField\n {...params}\n label={variant === 'standard' ? undefined : label}\n variant={variant}\n data-testid={`text-field-${fieldName}`}\n fullWidth\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n placeholder={placeholder || undefined}\n required={required}\n error={showError}\n helperText={helperText}\n slotProps={{\n input: {\n ...params.InputProps,\n endAdornment: (\n <>\n {loading && <CircularProgress color=\"inherit\" size={25} />}\n {params.InputProps.endAdornment}\n </>\n ),\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n />\n )}\n multiple={multiple}\n limitTags={multiple ? (limitTags ?? 2) : undefined}\n slotProps={{\n listbox: {\n onScroll,\n },\n }}\n />\n );\n};\n\nconst GenericAutocompleteField = <T,>({\n label,\n fieldName,\n options,\n placeholder,\n getOptionLabel,\n validation,\n onChange,\n onInputChange,\n isOptionEqualToValue,\n onScroll,\n layout = 'horizontal',\n variant = 'outlined',\n disabled = false,\n loading = false,\n required = false,\n multiple = false,\n limitTags = undefined,\n}: Props<T>) => {\n const renderField = () => {\n return (\n <Field name={fieldName} validate={validation}>\n {(fieldProps: FieldProps) => (\n <AutocompleteFieldComponent<T>\n {...fieldProps}\n fieldName={fieldName}\n options={options}\n label={label}\n variant={variant}\n placeholder={placeholder}\n getOptionLabel={getOptionLabel}\n isOptionEqualToValue={isOptionEqualToValue}\n onChange={onChange}\n onInputChange={onInputChange}\n onScroll={onScroll}\n layout={layout}\n disabled={disabled}\n loading={loading}\n required={required}\n multiple={multiple}\n limitTags={limitTags}\n />\n )}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography variant=\"subtitle1\" component=\"h3\" color=\"textPrimary\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericAutocompleteField;\n"],"names":["AutocompleteFieldComponent","field","form","fieldName","options","label","variant","placeholder","getOptionLabel","isOptionEqualToValue","onChange","onInputChange","onScroll","layout","disabled","loading","required","multiple","limitTags","errors","touched","isSubmitting","fieldError","name","showError","helperText","useRenderValidText","value","_jsx","Autocomplete","e","setFieldValue","fullWidth","renderInput","params","TextField","undefined","style","paddingRight","error","slotProps","input","InputProps","endAdornment","_jsxs","jsxs","_Fragment","children","jsx","CircularProgress","color","size","formHelperText","textAlign","listbox","validation","renderField","Field","validate","fieldProps","Typography","component","FormItemLayout"],"mappings":"iWAmDA,MAAMA,EAA6B,EAC/BC,QACAC,OACAC,YACAC,UACAC,QACAC,UACAC,cACAC,iBACAC,uBACAC,WACAC,gBACAC,WACAC,SAAS,aACTC,YAAW,EACXC,WAAU,EACVC,YAAW,EACXC,YAAW,EACXC,gBAEA,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBnB,EACpCoB,EAAaH,EAAOlB,EAAMsB,MAC1BC,IAAcF,GAAeF,EAAQnB,EAAMsB,MAC3CE,EAAaC,EACf,CACIJ,aACAE,YACAJ,UAAWA,EAAQnB,EAAMsB,MACzBI,MAAO1B,EAAM0B,OAEjB,SAGJ,OACIC,MAACC,EAAY,CACTzB,QAASA,EACTI,eAAgBA,EAChBC,qBAAsBA,EACtBC,SAAU,CAACoB,EAAmBH,KAE1BzB,EAAK6B,cAAc5B,EAAWwB,GAC1BjB,GACAA,EAASoB,EAAGH,IAGpBhB,cAAeA,EACfG,SAAUO,GAAgBP,EAC1BkB,aACAL,MAAO1B,EAAM0B,QAAUV,EAAW,GAAK,MACvCF,QAASA,EACTkB,YAAcC,GACVN,EAAAA,IAACO,EACO,IAAAD,EACJ7B,MAAmB,aAAZC,OAAyB8B,EAAY/B,EAC5CC,QAASA,EAAO,cACH,cAAcH,IAC3B6B,WACA,EAAAK,MAAO,CAAEC,aAAyB,eAAXzB,EAA0B,GAAK,GACtDN,YAAaA,QAAe6B,EAC5BpB,SAAUA,EACVuB,MAAOf,EACPC,WAAYA,EACZe,UAAW,CACPC,MAAO,IACAP,EAAOQ,WACVC,aACIC,EACKC,KAAAC,WAAA,CAAAC,SAAA,CAAAhC,GAAWa,EAACoB,IAAAC,EAAiB,CAAAC,MAAM,UAAUC,KAAM,KACnDjB,EAAOQ,WAAWC,iBAI/BS,eAAgB,CACZL,SAAU,IACVV,MAAO,CAAEgB,UAAW,aAKpCpC,SAAUA,EACVC,UAAWD,EAAYC,GAAa,OAAKkB,EACzCI,UAAW,CACPc,QAAS,CACL1C,cAGV,iBAIuB,EAC7BP,QACAF,YACAC,UACAG,cACAC,iBACA+C,aACA7C,WACAC,gBACAF,uBACAG,WACAC,SAAS,aACTP,UAAU,WACVQ,YAAW,EACXC,WAAU,EACVC,YAAW,EACXC,YAAW,EACXC,gBAEA,MAAMsC,EAAc,IAEZ5B,MAAC6B,EAAAA,OAAMlC,KAAMpB,EAAWuD,SAAUH,EAAUR,SACtCY,GACE/B,MAAC5B,EAA0B,IACnB2D,EACJxD,UAAWA,EACXC,QAASA,EACTC,MAAOA,EACPC,QAASA,EACTC,YAAaA,EACbC,eAAgBA,EAChBC,qBAAsBA,EACtBC,SAAUA,EACVC,cAAeA,EACfC,SAAUA,EACVC,OAAQA,EACRC,SAAUA,EACVC,QAASA,EACTC,SAAUA,EACVC,SAAUA,EACVC,UAAWA,MAO/B,MAAe,aAAXL,EAEI+B,EAAAC,KAAAC,WAAA,CAAAC,SAAA,CACiB,aAAZzC,GACGsB,EAAAA,IAACgC,EAAU,CAACtD,QAAQ,YAAYuD,UAAU,KAAKX,MAAM,cAChDH,SAAA1C,IAGRmD,OAKN5B,EAAAA,IAACkC,EAAc,CAACzD,MAAOA,EAAQ0C,SAAAS,KAA+B"}
1
+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/Form/GenericAutocompleteField/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { type SyntheticEvent } from 'react';\n\nimport Autocomplete from '@mui/material/Autocomplete';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport TextField, { type TextFieldProps } from '@mui/material/TextField';\nimport Typography from '@mui/material/Typography';\n\nimport { Field, type FieldProps } from 'formik';\n\nimport useRenderValidText from '../../../custom-hooks/useRenderValidText';\nimport FormItemLayout from '../FormItemLayout';\n\nexport interface Props<T> {\n label: string;\n fieldName: string;\n options: T[];\n placeholder?: string;\n getOptionLabel?: (option: T) => string;\n validation?: (value: T | T[]) => string | undefined;\n onChange?: (e: SyntheticEvent, value: T | T[] | null) => void;\n onInputChange?: (e: SyntheticEvent, value: string) => void;\n isOptionEqualToValue?: (option: T, value: T) => boolean;\n onScroll?: (e: React.UIEvent<HTMLUListElement, UIEvent>) => void;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n loading?: boolean;\n required?: boolean;\n multiple?: boolean;\n limitTags?: number;\n}\n\ninterface AutocompleteFieldProps<T> {\n field: FieldProps['field'];\n form: FieldProps['form'];\n fieldName: string;\n options: T[];\n label: string;\n variant: TextFieldProps['variant'];\n placeholder?: string;\n getOptionLabel?: (option: T) => string;\n isOptionEqualToValue?: (option: T, value: T) => boolean;\n onChange?: (e: SyntheticEvent, value: T | T[] | null) => void;\n onInputChange?: (e: SyntheticEvent, value: string) => void;\n onScroll?: (e: React.UIEvent<HTMLUListElement, UIEvent>) => void;\n layout?: 'horizontal' | 'vertical';\n disabled?: boolean;\n loading?: boolean;\n required?: boolean;\n multiple?: boolean;\n limitTags?: number;\n}\n\nconst AutocompleteFieldComponent = <T,>({\n field,\n form,\n fieldName,\n options,\n label,\n variant,\n placeholder,\n getOptionLabel,\n isOptionEqualToValue,\n onChange,\n onInputChange,\n onScroll,\n layout = 'horizontal',\n disabled = false,\n loading = false,\n required = false,\n multiple = false,\n limitTags,\n}: AutocompleteFieldProps<T>) => {\n const { errors, touched, isSubmitting } = form;\n const fieldValue = field.value as T | T[] | null;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: fieldValue as string,\n },\n 'Valid',\n );\n\n return (\n <Autocomplete\n fullWidth\n disabled={isSubmitting || disabled}\n getOptionLabel={getOptionLabel}\n isOptionEqualToValue={isOptionEqualToValue}\n limitTags={multiple ? (limitTags ?? 2) : undefined}\n loading={loading}\n multiple={multiple}\n options={options}\n renderInput={(params) => (\n <TextField\n {...params}\n fullWidth\n data-testid={`text-field-${fieldName}`}\n error={showError}\n helperText={helperText}\n label={variant === 'standard' ? undefined : label}\n placeholder={placeholder || undefined}\n required={required}\n slotProps={{\n input: {\n ...params.InputProps,\n endAdornment: (\n <>\n {loading && <CircularProgress color=\"inherit\" size={25} />}\n {params.InputProps.endAdornment}\n </>\n ),\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n variant={variant}\n />\n )}\n slotProps={{\n listbox: {\n onScroll,\n },\n }}\n value={fieldValue || (multiple ? [] : null)}\n onChange={(e: SyntheticEvent<Element, Event>, value: T | T[] | null) => {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(fieldName, value);\n if (onChange) {\n onChange(e, value);\n }\n }}\n onInputChange={onInputChange}\n />\n );\n};\n\nconst GenericAutocompleteField = <T,>({\n label,\n fieldName,\n options,\n placeholder,\n getOptionLabel,\n validation,\n onChange,\n onInputChange,\n isOptionEqualToValue,\n onScroll,\n layout = 'horizontal',\n variant = 'outlined',\n disabled = false,\n loading = false,\n required = false,\n multiple = false,\n limitTags = undefined,\n}: Props<T>) => {\n const renderField = () => {\n return (\n <Field name={fieldName} validate={validation}>\n {(fieldProps: FieldProps) => (\n <AutocompleteFieldComponent<T>\n {...fieldProps}\n disabled={disabled}\n fieldName={fieldName}\n getOptionLabel={getOptionLabel}\n isOptionEqualToValue={isOptionEqualToValue}\n label={label}\n layout={layout}\n limitTags={limitTags}\n loading={loading}\n multiple={multiple}\n options={options}\n placeholder={placeholder}\n required={required}\n variant={variant}\n onChange={onChange}\n onInputChange={onInputChange}\n onScroll={onScroll}\n />\n )}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography color=\"textPrimary\" component=\"h3\" variant=\"subtitle1\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericAutocompleteField;\n"],"names":["AutocompleteFieldComponent","field","form","fieldName","options","label","variant","placeholder","getOptionLabel","isOptionEqualToValue","onChange","onInputChange","onScroll","layout","disabled","loading","required","multiple","limitTags","errors","touched","isSubmitting","fieldValue","value","fieldError","name","showError","helperText","useRenderValidText","_jsx","Autocomplete","fullWidth","undefined","renderInput","params","TextField","error","slotProps","input","InputProps","endAdornment","_jsxs","jsxs","_Fragment","children","jsx","CircularProgress","color","size","formHelperText","style","textAlign","paddingRight","listbox","e","setFieldValue","validation","renderField","Field","validate","fieldProps","Typography","component","FormItemLayout"],"mappings":"iWAsDA,MAAMA,EAA6B,EACjCC,QACAC,OACAC,YACAC,UACAC,QACAC,UACAC,cACAC,iBACAC,uBACAC,WACAC,gBACAC,WACAC,SAAS,aACTC,YAAW,EACXC,WAAU,EACVC,YAAW,EACXC,YAAW,EACXC,gBAEA,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBnB,EACpCoB,EAAarB,EAAMsB,MACnBC,EAAaL,EAAOlB,EAAMwB,MAC1BC,IAAcF,GAAeJ,EAAQnB,EAAMwB,MAC3CE,EAAaC,EACjB,CACEJ,aACAE,YACAN,UAAWA,EAAQnB,EAAMwB,MACzBF,MAAOD,GAET,SAGF,OACEO,MAACC,EAAY,CACXC,WACA,EAAAjB,SAAUO,GAAgBP,EAC1BN,eAAgBA,EAChBC,qBAAsBA,EACtBS,UAAWD,EAAYC,GAAa,OAAKc,EACzCjB,QAASA,EACTE,SAAUA,EACVb,QAASA,EACT6B,YAAcC,GACZL,MAACM,EAAS,IACJD,EACJH,WAAS,EAAA,cACI,cAAc5B,IAC3BiC,MAAOV,EACPC,WAAYA,EACZtB,MAAmB,aAAZC,OAAyB0B,EAAY3B,EAC5CE,YAAaA,QAAeyB,EAC5BhB,SAAUA,EACVqB,UAAW,CACTC,MAAO,IACFJ,EAAOK,WACVC,aACEC,EACGC,KAAAC,WAAA,CAAAC,SAAA,CAAA7B,GAAWc,EAACgB,IAAAC,EAAiB,CAAAC,MAAM,UAAUC,KAAM,KACnDd,EAAOK,WAAWC,iBAIzBS,eAAgB,CACdL,SAAU,IACVM,MAAO,CAAEC,UAAW,WAGxBD,MAAO,CAAEE,aAAyB,eAAXvC,EAA0B,GAAK,GACtDP,QAASA,IAGb+B,UAAW,CACTgB,QAAS,CACPzC,aAGJW,MAAOD,IAAeL,EAAW,GAAK,MACtCP,SAAU,CAAC4C,EAAmC/B,KAE5CrB,EAAKqD,cAAcpD,EAAWoB,GAC1Bb,GACFA,EAAS4C,EAAG/B,IAGhBZ,cAAeA,oBAKY,EAC/BN,QACAF,YACAC,UACAG,cACAC,iBACAgD,aACA9C,WACAC,gBACAF,uBACAG,WACAC,SAAS,aACTP,UAAU,WACVQ,YAAW,EACXC,WAAU,EACVC,YAAW,EACXC,YAAW,EACXC,gBAEA,MAAMuC,EAAc,IAEhB5B,MAAC6B,EAAAA,OAAMjC,KAAMtB,EAAWwD,SAAUH,EAAUZ,SACxCgB,GACA/B,MAAC7B,EAA0B,IACrB4D,EACJ9C,SAAUA,EACVX,UAAWA,EACXK,eAAgBA,EAChBC,qBAAsBA,EACtBJ,MAAOA,EACPQ,OAAQA,EACRK,UAAWA,EACXH,QAASA,EACTE,SAAUA,EACVb,QAASA,EACTG,YAAaA,EACbS,SAAUA,EACVV,QAASA,EACTI,SAAUA,EACVC,cAAeA,EACfC,SAAUA,MAOpB,MAAe,aAAXC,EAEA4B,EAAAC,KAAAC,WAAA,CAAAC,SAAA,CACe,aAAZtC,GACCuB,EAAAA,IAACgC,EAAU,CAACd,MAAM,cAAce,UAAU,KAAKxD,QAAQ,YACpDsC,SAAAvC,IAGJoD,OAKA5B,EAAAA,IAACkC,EAAc,CAAC1D,MAAOA,EAAQuC,SAAAa"}
@@ -1,15 +1,15 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { TextFieldProps } from '@mui/material/TextField';
3
2
  import { SyntheticEvent } from 'react';
3
+ import { TextFieldProps } from '@mui/material/TextField';
4
4
 
5
- type Props<T> = {
5
+ interface Props<T> {
6
6
  label: string;
7
7
  fieldName: string;
8
8
  options: T[];
9
9
  placeholder?: string;
10
10
  getOptionLabel?: (option: T) => string;
11
11
  validation?: (value: T | T[]) => string | undefined;
12
- onChange?: (e: SyntheticEvent, value: T | T[]) => void;
12
+ onChange?: (e: SyntheticEvent, value: T | T[] | null) => void;
13
13
  onInputChange?: (e: SyntheticEvent, value: string) => void;
14
14
  isOptionEqualToValue?: (option: T, value: T) => boolean;
15
15
  onScroll?: (e: React.UIEvent<HTMLUListElement, UIEvent>) => void;
@@ -20,7 +20,7 @@ type Props<T> = {
20
20
  required?: boolean;
21
21
  multiple?: boolean;
22
22
  limitTags?: number;
23
- };
23
+ }
24
24
  declare const GenericAutocompleteField: <T>({ label, fieldName, options, placeholder, getOptionLabel, validation, onChange, onInputChange, isOptionEqualToValue, onScroll, layout, variant, disabled, loading, required, multiple, limitTags, }: Props<T>) => react_jsx_runtime.JSX.Element;
25
25
 
26
26
  export { GenericAutocompleteField as default };
@@ -1,2 +1,2 @@
1
- import{jsxs as e,Fragment as l,jsx as o}from"react/jsx-runtime";import i from"@mui/material/Autocomplete";import t from"@mui/material/CircularProgress";import r from"@mui/material/TextField";import a from"@mui/material/Typography";import{Field as n}from"formik";import"react";import d from"../../../custom-hooks/useRenderValidText.js";import m from"../FormItemLayout/index.js";const u=({field:a,form:n,fieldName:m,options:u,label:p,variant:s,placeholder:h,getOptionLabel:c,isOptionEqualToValue:g,onChange:f,onInputChange:b,onScroll:v,layout:T="horizontal",disabled:x=!1,loading:y=!1,required:C=!1,multiple:q=!1,limitTags:I})=>{const{errors:O,touched:V,isSubmitting:E}=n,P=O[a.name],L=!!P&&V[a.name],S=d({fieldError:P,showError:L,touched:!!V[a.name],value:a.value},"Valid");return o(i,{options:u,getOptionLabel:c,isOptionEqualToValue:g,onChange:(e,l)=>{n.setFieldValue(m,l),f&&f(e,l)},onInputChange:b,disabled:E||x,fullWidth:!0,value:a.value||(q?[]:null),loading:y,renderInput:i=>o(r,{...i,label:"standard"===s?void 0:p,variant:s,"data-testid":`text-field-${m}`,fullWidth:!0,style:{paddingRight:"horizontal"===T?16:0},placeholder:h||void 0,required:C,error:L,helperText:S,slotProps:{input:{...i.InputProps,endAdornment:e(l,{children:[y&&o(t,{color:"inherit",size:25}),i.InputProps.endAdornment]})},formHelperText:{children:" ",style:{textAlign:"right"}}}}),multiple:q,limitTags:q?I??2:void 0,slotProps:{listbox:{onScroll:v}}})},p=({label:i,fieldName:t,options:r,placeholder:d,getOptionLabel:p,validation:s,onChange:h,onInputChange:c,isOptionEqualToValue:g,onScroll:f,layout:b="horizontal",variant:v="outlined",disabled:T=!1,loading:x=!1,required:y=!1,multiple:C=!1,limitTags:q})=>{const I=()=>o(n,{name:t,validate:s,children:e=>o(u,{...e,fieldName:t,options:r,label:i,variant:v,placeholder:d,getOptionLabel:p,isOptionEqualToValue:g,onChange:h,onInputChange:c,onScroll:f,layout:b,disabled:T,loading:x,required:y,multiple:C,limitTags:q})});return"vertical"===b?e(l,{children:["standard"===v&&o(a,{variant:"subtitle1",component:"h3",color:"textPrimary",children:i}),I()]}):o(m,{label:i,children:I()})};export{p as default};
1
+ import{jsxs as e,Fragment as o,jsx as l}from"react/jsx-runtime";import"react";import i from"@mui/material/Autocomplete";import t from"@mui/material/CircularProgress";import r from"@mui/material/TextField";import a from"@mui/material/Typography";import{Field as n}from"formik";import d from"../../../custom-hooks/useRenderValidText.js";import m from"../FormItemLayout/index.js";const u=({field:a,form:n,fieldName:m,options:u,label:p,variant:s,placeholder:h,getOptionLabel:c,isOptionEqualToValue:g,onChange:f,onInputChange:b,onScroll:v,layout:T="horizontal",disabled:x=!1,loading:y=!1,required:C=!1,multiple:q=!1,limitTags:I})=>{const{errors:O,touched:V,isSubmitting:E}=n,P=a.value,L=O[a.name],S=!!L&&V[a.name],z=d({fieldError:L,showError:S,touched:!!V[a.name],value:P},"Valid");return l(i,{fullWidth:!0,disabled:E||x,getOptionLabel:c,isOptionEqualToValue:g,limitTags:q?I??2:void 0,loading:y,multiple:q,options:u,renderInput:i=>l(r,{...i,fullWidth:!0,"data-testid":`text-field-${m}`,error:S,helperText:z,label:"standard"===s?void 0:p,placeholder:h||void 0,required:C,slotProps:{input:{...i.InputProps,endAdornment:e(o,{children:[y&&l(t,{color:"inherit",size:25}),i.InputProps.endAdornment]})},formHelperText:{children:" ",style:{textAlign:"right"}}},style:{paddingRight:"horizontal"===T?16:0},variant:s}),slotProps:{listbox:{onScroll:v}},value:P||(q?[]:null),onChange:(e,o)=>{n.setFieldValue(m,o),f&&f(e,o)},onInputChange:b})},p=({label:i,fieldName:t,options:r,placeholder:d,getOptionLabel:p,validation:s,onChange:h,onInputChange:c,isOptionEqualToValue:g,onScroll:f,layout:b="horizontal",variant:v="outlined",disabled:T=!1,loading:x=!1,required:y=!1,multiple:C=!1,limitTags:q})=>{const I=()=>l(n,{name:t,validate:s,children:e=>l(u,{...e,disabled:T,fieldName:t,getOptionLabel:p,isOptionEqualToValue:g,label:i,layout:b,limitTags:q,loading:x,multiple:C,options:r,placeholder:d,required:y,variant:v,onChange:h,onInputChange:c,onScroll:f})});return"vertical"===b?e(o,{children:["standard"===v&&l(a,{color:"textPrimary",component:"h3",variant:"subtitle1",children:i}),I()]}):l(m,{label:i,children:I()})};export{p as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../src/components/Form/GenericAutocompleteField/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport Autocomplete from '@mui/material/Autocomplete';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport TextField, { type TextFieldProps } from '@mui/material/TextField';\nimport Typography from '@mui/material/Typography';\nimport { Field, type FieldProps } from 'formik';\nimport { type SyntheticEvent } from 'react';\nimport useRenderValidText from '../../../custom-hooks/useRenderValidText';\nimport FormItemLayout from '../FormItemLayout';\n\nexport type Props<T> = {\n label: string;\n fieldName: string;\n options: T[];\n placeholder?: string;\n getOptionLabel?: (option: T) => string;\n validation?: (value: T | T[]) => string | undefined;\n onChange?: (e: SyntheticEvent, value: T | T[]) => void;\n onInputChange?: (e: SyntheticEvent, value: string) => void;\n isOptionEqualToValue?: (option: T, value: T) => boolean;\n onScroll?: (e: React.UIEvent<HTMLUListElement, UIEvent>) => void;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n loading?: boolean;\n required?: boolean;\n multiple?: boolean;\n limitTags?: number;\n};\n\ntype AutocompleteFieldProps<T> = {\n field: FieldProps['field'];\n form: FieldProps['form'];\n fieldName: string;\n options: T[];\n label: string;\n variant: TextFieldProps['variant'];\n placeholder?: string;\n getOptionLabel?: (option: T) => string;\n isOptionEqualToValue?: (option: T, value: T) => boolean;\n onChange?: (e: SyntheticEvent, value: T | T[]) => void;\n onInputChange?: (e: SyntheticEvent, value: string) => void;\n onScroll?: (e: React.UIEvent<HTMLUListElement, UIEvent>) => void;\n layout?: 'horizontal' | 'vertical';\n disabled?: boolean;\n loading?: boolean;\n required?: boolean;\n multiple?: boolean;\n limitTags?: number;\n};\n\nconst AutocompleteFieldComponent = <T,>({\n field,\n form,\n fieldName,\n options,\n label,\n variant,\n placeholder,\n getOptionLabel,\n isOptionEqualToValue,\n onChange,\n onInputChange,\n onScroll,\n layout = 'horizontal',\n disabled = false,\n loading = false,\n required = false,\n multiple = false,\n limitTags,\n}: AutocompleteFieldProps<T>) => {\n const { errors, touched, isSubmitting } = form;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: field.value,\n },\n 'Valid',\n );\n\n return (\n <Autocomplete\n options={options}\n getOptionLabel={getOptionLabel}\n isOptionEqualToValue={isOptionEqualToValue}\n onChange={(e: SyntheticEvent, value: T[]) => {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(fieldName, value);\n if (onChange) {\n onChange(e, value);\n }\n }}\n onInputChange={onInputChange}\n disabled={isSubmitting || disabled}\n fullWidth\n value={field.value || (multiple ? [] : null)}\n loading={loading}\n renderInput={(params) => (\n <TextField\n {...params}\n label={variant === 'standard' ? undefined : label}\n variant={variant}\n data-testid={`text-field-${fieldName}`}\n fullWidth\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n placeholder={placeholder || undefined}\n required={required}\n error={showError}\n helperText={helperText}\n slotProps={{\n input: {\n ...params.InputProps,\n endAdornment: (\n <>\n {loading && <CircularProgress color=\"inherit\" size={25} />}\n {params.InputProps.endAdornment}\n </>\n ),\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n />\n )}\n multiple={multiple}\n limitTags={multiple ? (limitTags ?? 2) : undefined}\n slotProps={{\n listbox: {\n onScroll,\n },\n }}\n />\n );\n};\n\nconst GenericAutocompleteField = <T,>({\n label,\n fieldName,\n options,\n placeholder,\n getOptionLabel,\n validation,\n onChange,\n onInputChange,\n isOptionEqualToValue,\n onScroll,\n layout = 'horizontal',\n variant = 'outlined',\n disabled = false,\n loading = false,\n required = false,\n multiple = false,\n limitTags = undefined,\n}: Props<T>) => {\n const renderField = () => {\n return (\n <Field name={fieldName} validate={validation}>\n {(fieldProps: FieldProps) => (\n <AutocompleteFieldComponent<T>\n {...fieldProps}\n fieldName={fieldName}\n options={options}\n label={label}\n variant={variant}\n placeholder={placeholder}\n getOptionLabel={getOptionLabel}\n isOptionEqualToValue={isOptionEqualToValue}\n onChange={onChange}\n onInputChange={onInputChange}\n onScroll={onScroll}\n layout={layout}\n disabled={disabled}\n loading={loading}\n required={required}\n multiple={multiple}\n limitTags={limitTags}\n />\n )}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography variant=\"subtitle1\" component=\"h3\" color=\"textPrimary\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericAutocompleteField;\n"],"names":["AutocompleteFieldComponent","field","form","fieldName","options","label","variant","placeholder","getOptionLabel","isOptionEqualToValue","onChange","onInputChange","onScroll","layout","disabled","loading","required","multiple","limitTags","errors","touched","isSubmitting","fieldError","name","showError","helperText","useRenderValidText","value","_jsx","Autocomplete","e","setFieldValue","fullWidth","renderInput","params","TextField","undefined","style","paddingRight","error","slotProps","input","InputProps","endAdornment","_jsxs","_Fragment","children","CircularProgress","color","size","formHelperText","textAlign","listbox","GenericAutocompleteField","validation","renderField","Field","validate","fieldProps","Typography","component","FormItemLayout"],"mappings":"yXAmDA,MAAMA,EAA6B,EAC/BC,QACAC,OACAC,YACAC,UACAC,QACAC,UACAC,cACAC,iBACAC,uBACAC,WACAC,gBACAC,WACAC,SAAS,aACTC,YAAW,EACXC,WAAU,EACVC,YAAW,EACXC,YAAW,EACXC,gBAEA,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBnB,EACpCoB,EAAaH,EAAOlB,EAAMsB,MAC1BC,IAAcF,GAAeF,EAAQnB,EAAMsB,MAC3CE,EAAaC,EACf,CACIJ,aACAE,YACAJ,UAAWA,EAAQnB,EAAMsB,MACzBI,MAAO1B,EAAM0B,OAEjB,SAGJ,OACIC,EAACC,EAAY,CACTzB,QAASA,EACTI,eAAgBA,EAChBC,qBAAsBA,EACtBC,SAAU,CAACoB,EAAmBH,KAE1BzB,EAAK6B,cAAc5B,EAAWwB,GAC1BjB,GACAA,EAASoB,EAAGH,IAGpBhB,cAAeA,EACfG,SAAUO,GAAgBP,EAC1BkB,aACAL,MAAO1B,EAAM0B,QAAUV,EAAW,GAAK,MACvCF,QAASA,EACTkB,YAAcC,GACVN,EAACO,EACO,IAAAD,EACJ7B,MAAmB,aAAZC,OAAyB8B,EAAY/B,EAC5CC,QAASA,EAAO,cACH,cAAcH,IAC3B6B,WACA,EAAAK,MAAO,CAAEC,aAAyB,eAAXzB,EAA0B,GAAK,GACtDN,YAAaA,QAAe6B,EAC5BpB,SAAUA,EACVuB,MAAOf,EACPC,WAAYA,EACZe,UAAW,CACPC,MAAO,IACAP,EAAOQ,WACVC,aACIC,EACKC,EAAA,CAAAC,SAAA,CAAA/B,GAAWa,EAACmB,EAAiB,CAAAC,MAAM,UAAUC,KAAM,KACnDf,EAAOQ,WAAWC,iBAI/BO,eAAgB,CACZJ,SAAU,IACVT,MAAO,CAAEc,UAAW,aAKpClC,SAAUA,EACVC,UAAWD,EAAYC,GAAa,OAAKkB,EACzCI,UAAW,CACPY,QAAS,CACLxC,cAGV,EAIJyC,EAA2B,EAC7BhD,QACAF,YACAC,UACAG,cACAC,iBACA8C,aACA5C,WACAC,gBACAF,uBACAG,WACAC,SAAS,aACTP,UAAU,WACVQ,YAAW,EACXC,WAAU,EACVC,YAAW,EACXC,YAAW,EACXC,gBAEA,MAAMqC,EAAc,IAEZ3B,EAAC4B,GAAMjC,KAAMpB,EAAWsD,SAAUH,EAAUR,SACtCY,GACE9B,EAAC5B,EAA0B,IACnB0D,EACJvD,UAAWA,EACXC,QAASA,EACTC,MAAOA,EACPC,QAASA,EACTC,YAAaA,EACbC,eAAgBA,EAChBC,qBAAsBA,EACtBC,SAAUA,EACVC,cAAeA,EACfC,SAAUA,EACVC,OAAQA,EACRC,SAAUA,EACVC,QAASA,EACTC,SAAUA,EACVC,SAAUA,EACVC,UAAWA,MAO/B,MAAe,aAAXL,EAEI+B,EAAAC,EAAA,CAAAC,SAAA,CACiB,aAAZxC,GACGsB,EAAC+B,EAAU,CAACrD,QAAQ,YAAYsD,UAAU,KAAKZ,MAAM,cAChDF,SAAAzC,IAGRkD,OAKN3B,EAACiC,EAAc,CAACxD,MAAOA,EAAQyC,SAAAS,KAA+B"}
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Form/GenericAutocompleteField/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { type SyntheticEvent } from 'react';\n\nimport Autocomplete from '@mui/material/Autocomplete';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport TextField, { type TextFieldProps } from '@mui/material/TextField';\nimport Typography from '@mui/material/Typography';\n\nimport { Field, type FieldProps } from 'formik';\n\nimport useRenderValidText from '../../../custom-hooks/useRenderValidText';\nimport FormItemLayout from '../FormItemLayout';\n\nexport interface Props<T> {\n label: string;\n fieldName: string;\n options: T[];\n placeholder?: string;\n getOptionLabel?: (option: T) => string;\n validation?: (value: T | T[]) => string | undefined;\n onChange?: (e: SyntheticEvent, value: T | T[] | null) => void;\n onInputChange?: (e: SyntheticEvent, value: string) => void;\n isOptionEqualToValue?: (option: T, value: T) => boolean;\n onScroll?: (e: React.UIEvent<HTMLUListElement, UIEvent>) => void;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n loading?: boolean;\n required?: boolean;\n multiple?: boolean;\n limitTags?: number;\n}\n\ninterface AutocompleteFieldProps<T> {\n field: FieldProps['field'];\n form: FieldProps['form'];\n fieldName: string;\n options: T[];\n label: string;\n variant: TextFieldProps['variant'];\n placeholder?: string;\n getOptionLabel?: (option: T) => string;\n isOptionEqualToValue?: (option: T, value: T) => boolean;\n onChange?: (e: SyntheticEvent, value: T | T[] | null) => void;\n onInputChange?: (e: SyntheticEvent, value: string) => void;\n onScroll?: (e: React.UIEvent<HTMLUListElement, UIEvent>) => void;\n layout?: 'horizontal' | 'vertical';\n disabled?: boolean;\n loading?: boolean;\n required?: boolean;\n multiple?: boolean;\n limitTags?: number;\n}\n\nconst AutocompleteFieldComponent = <T,>({\n field,\n form,\n fieldName,\n options,\n label,\n variant,\n placeholder,\n getOptionLabel,\n isOptionEqualToValue,\n onChange,\n onInputChange,\n onScroll,\n layout = 'horizontal',\n disabled = false,\n loading = false,\n required = false,\n multiple = false,\n limitTags,\n}: AutocompleteFieldProps<T>) => {\n const { errors, touched, isSubmitting } = form;\n const fieldValue = field.value as T | T[] | null;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: fieldValue as string,\n },\n 'Valid',\n );\n\n return (\n <Autocomplete\n fullWidth\n disabled={isSubmitting || disabled}\n getOptionLabel={getOptionLabel}\n isOptionEqualToValue={isOptionEqualToValue}\n limitTags={multiple ? (limitTags ?? 2) : undefined}\n loading={loading}\n multiple={multiple}\n options={options}\n renderInput={(params) => (\n <TextField\n {...params}\n fullWidth\n data-testid={`text-field-${fieldName}`}\n error={showError}\n helperText={helperText}\n label={variant === 'standard' ? undefined : label}\n placeholder={placeholder || undefined}\n required={required}\n slotProps={{\n input: {\n ...params.InputProps,\n endAdornment: (\n <>\n {loading && <CircularProgress color=\"inherit\" size={25} />}\n {params.InputProps.endAdornment}\n </>\n ),\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n variant={variant}\n />\n )}\n slotProps={{\n listbox: {\n onScroll,\n },\n }}\n value={fieldValue || (multiple ? [] : null)}\n onChange={(e: SyntheticEvent<Element, Event>, value: T | T[] | null) => {\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(fieldName, value);\n if (onChange) {\n onChange(e, value);\n }\n }}\n onInputChange={onInputChange}\n />\n );\n};\n\nconst GenericAutocompleteField = <T,>({\n label,\n fieldName,\n options,\n placeholder,\n getOptionLabel,\n validation,\n onChange,\n onInputChange,\n isOptionEqualToValue,\n onScroll,\n layout = 'horizontal',\n variant = 'outlined',\n disabled = false,\n loading = false,\n required = false,\n multiple = false,\n limitTags = undefined,\n}: Props<T>) => {\n const renderField = () => {\n return (\n <Field name={fieldName} validate={validation}>\n {(fieldProps: FieldProps) => (\n <AutocompleteFieldComponent<T>\n {...fieldProps}\n disabled={disabled}\n fieldName={fieldName}\n getOptionLabel={getOptionLabel}\n isOptionEqualToValue={isOptionEqualToValue}\n label={label}\n layout={layout}\n limitTags={limitTags}\n loading={loading}\n multiple={multiple}\n options={options}\n placeholder={placeholder}\n required={required}\n variant={variant}\n onChange={onChange}\n onInputChange={onInputChange}\n onScroll={onScroll}\n />\n )}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography color=\"textPrimary\" component=\"h3\" variant=\"subtitle1\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericAutocompleteField;\n"],"names":["AutocompleteFieldComponent","field","form","fieldName","options","label","variant","placeholder","getOptionLabel","isOptionEqualToValue","onChange","onInputChange","onScroll","layout","disabled","loading","required","multiple","limitTags","errors","touched","isSubmitting","fieldValue","value","fieldError","name","showError","helperText","useRenderValidText","_jsx","Autocomplete","fullWidth","undefined","renderInput","params","TextField","error","slotProps","input","InputProps","endAdornment","_jsxs","_Fragment","children","CircularProgress","color","size","formHelperText","style","textAlign","paddingRight","listbox","e","setFieldValue","GenericAutocompleteField","validation","renderField","Field","validate","fieldProps","Typography","component","FormItemLayout"],"mappings":"yXAsDA,MAAMA,EAA6B,EACjCC,QACAC,OACAC,YACAC,UACAC,QACAC,UACAC,cACAC,iBACAC,uBACAC,WACAC,gBACAC,WACAC,SAAS,aACTC,YAAW,EACXC,WAAU,EACVC,YAAW,EACXC,YAAW,EACXC,gBAEA,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBnB,EACpCoB,EAAarB,EAAMsB,MACnBC,EAAaL,EAAOlB,EAAMwB,MAC1BC,IAAcF,GAAeJ,EAAQnB,EAAMwB,MAC3CE,EAAaC,EACjB,CACEJ,aACAE,YACAN,UAAWA,EAAQnB,EAAMwB,MACzBF,MAAOD,GAET,SAGF,OACEO,EAACC,EAAY,CACXC,WACA,EAAAjB,SAAUO,GAAgBP,EAC1BN,eAAgBA,EAChBC,qBAAsBA,EACtBS,UAAWD,EAAYC,GAAa,OAAKc,EACzCjB,QAASA,EACTE,SAAUA,EACVb,QAASA,EACT6B,YAAcC,GACZL,EAACM,EAAS,IACJD,EACJH,WAAS,EAAA,cACI,cAAc5B,IAC3BiC,MAAOV,EACPC,WAAYA,EACZtB,MAAmB,aAAZC,OAAyB0B,EAAY3B,EAC5CE,YAAaA,QAAeyB,EAC5BhB,SAAUA,EACVqB,UAAW,CACTC,MAAO,IACFJ,EAAOK,WACVC,aACEC,EACGC,EAAA,CAAAC,SAAA,CAAA5B,GAAWc,EAACe,EAAiB,CAAAC,MAAM,UAAUC,KAAM,KACnDZ,EAAOK,WAAWC,iBAIzBO,eAAgB,CACdJ,SAAU,IACVK,MAAO,CAAEC,UAAW,WAGxBD,MAAO,CAAEE,aAAyB,eAAXrC,EAA0B,GAAK,GACtDP,QAASA,IAGb+B,UAAW,CACTc,QAAS,CACPvC,aAGJW,MAAOD,IAAeL,EAAW,GAAK,MACtCP,SAAU,CAAC0C,EAAmC7B,KAE5CrB,EAAKmD,cAAclD,EAAWoB,GAC1Bb,GACFA,EAAS0C,EAAG7B,IAGhBZ,cAAeA,KAKf2C,EAA2B,EAC/BjD,QACAF,YACAC,UACAG,cACAC,iBACA+C,aACA7C,WACAC,gBACAF,uBACAG,WACAC,SAAS,aACTP,UAAU,WACVQ,YAAW,EACXC,WAAU,EACVC,YAAW,EACXC,YAAW,EACXC,gBAEA,MAAMsC,EAAc,IAEhB3B,EAAC4B,GAAMhC,KAAMtB,EAAWuD,SAAUH,EAAUZ,SACxCgB,GACA9B,EAAC7B,EAA0B,IACrB2D,EACJ7C,SAAUA,EACVX,UAAWA,EACXK,eAAgBA,EAChBC,qBAAsBA,EACtBJ,MAAOA,EACPQ,OAAQA,EACRK,UAAWA,EACXH,QAASA,EACTE,SAAUA,EACVb,QAASA,EACTG,YAAaA,EACbS,SAAUA,EACVV,QAASA,EACTI,SAAUA,EACVC,cAAeA,EACfC,SAAUA,MAOpB,MAAe,aAAXC,EAEA4B,EAAAC,EAAA,CAAAC,SAAA,CACe,aAAZrC,GACCuB,EAAC+B,EAAU,CAACf,MAAM,cAAcgB,UAAU,KAAKvD,QAAQ,YACpDqC,SAAAtC,IAGJmD,OAKA3B,EAACiC,EAAc,CAACzD,MAAOA,EAAQsC,SAAAa"}
@@ -1,2 +1,2 @@
1
- "use strict";var e=require("react/jsx-runtime"),i=require("@mui/material/Button"),t=require("formik");module.exports=({fields:r,onSubmit:a,handleError:n,submitButtonText:u})=>{const s=r.reduce(((e,i)=>(e[i.fieldName]=i.defaultValue,e)),{});return e.jsx(t.Formik,{initialValues:s,onSubmit:async e=>{try{await a(e)}catch(e){n&&n(e)}},children:({isSubmitting:a})=>e.jsxs(t.Form,{children:[r.map(((i,t)=>e.jsx("div",{children:i.component},`field_${i.fieldName}_${t}`))),e.jsx(i,{variant:"contained",type:"submit",disabled:a,sx:{marginTop:4},"data-testid":"submit-form-button",children:u})]})})};
1
+ "use strict";var e=require("react/jsx-runtime"),i=require("@mui/material/Button"),t=require("formik");module.exports=({fields:r,onSubmit:a,handleError:n,submitButtonText:u})=>{const s=r.reduce(((e,i)=>(e[i.fieldName]=i.defaultValue,e)),{});return e.jsx(t.Formik,{initialValues:s,onSubmit:async e=>{try{await a(e)}catch(e){n&&n(e)}},children:({isSubmitting:a})=>e.jsxs(t.Form,{children:[r.map(((i,t)=>e.jsx("div",{children:i.component},`field_${i.fieldName}_${t}`))),e.jsx(i,{"data-testid":"submit-form-button",disabled:a,sx:{marginTop:4},type:"submit",variant:"contained",children:u})]})})};
2
2
  //# sourceMappingURL=index.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/Form/GenericFormContainer/index.tsx"],"sourcesContent":["import Button from '@mui/material/Button';\nimport { Form, Formik } from 'formik';\n\ntype GenericFormContainerProps = {\n fields: {\n fieldName: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n defaultValue: any;\n component: React.ReactNode;\n }[];\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n onSubmit: (values: any) => Promise<void>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n handleError?: (error: any) => void;\n submitButtonText: string;\n};\n\nconst GenericFormContainer = ({ fields, onSubmit, handleError, submitButtonText }: GenericFormContainerProps) => {\n const initialValues = fields.reduce((acc, field) => {\n acc[field.fieldName] = field.defaultValue;\n return acc;\n }, {});\n\n return (\n <Formik\n initialValues={initialValues}\n onSubmit={async (values) => {\n try {\n await onSubmit(values);\n } catch (error) {\n if (handleError) {\n handleError(error);\n }\n }\n }}\n >\n {({ isSubmitting }) => (\n <Form>\n {fields.map((field, index) => (\n <div key={`field_${field.fieldName}_${index}`}>{field.component}</div>\n ))}\n\n <Button variant=\"contained\" type=\"submit\" disabled={isSubmitting} sx={{ marginTop: 4 }} data-testid=\"submit-form-button\">\n {submitButtonText}\n </Button>\n </Form>\n )}\n </Formik>\n );\n};\n\nexport default GenericFormContainer;\n"],"names":["fields","onSubmit","handleError","submitButtonText","initialValues","reduce","acc","field","fieldName","defaultValue","_jsx","Formik","async","values","error","children","isSubmitting","_jsxs","jsxs","Form","map","index","component","jsx","Button","variant","type","disabled","sx","marginTop"],"mappings":"qHAiB6B,EAAGA,SAAQC,WAAUC,cAAaC,uBAC3D,MAAMC,EAAgBJ,EAAOK,QAAO,CAACC,EAAKC,KACtCD,EAAIC,EAAMC,WAAaD,EAAME,aACtBH,IACR,IAEH,OACII,EAAAA,IAACC,EAAAA,OAAM,CACHP,cAAeA,EACfH,SAAUW,MAAOC,IACb,UACUZ,EAASY,GACjB,MAAOC,GACDZ,GACAA,EAAYY,KAKvBC,SAAA,EAAGC,kBACAC,EAACC,KAAAC,OACI,CAAAJ,SAAA,CAAAf,EAAOoB,KAAI,CAACb,EAAOc,IAChBX,MAAA,MAAA,CAAAK,SAAgDR,EAAMe,WAA5C,SAASf,EAAMC,aAAaa,OAG1CX,EAAAa,IAACC,EAAO,CAAAC,QAAQ,YAAYC,KAAK,SAASC,SAAUX,EAAcY,GAAI,CAAEC,UAAW,GAAG,cAAc,qBAAoBd,SACnHZ,QAIR"}
1
+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/Form/GenericFormContainer/index.tsx"],"sourcesContent":["import Button from '@mui/material/Button';\n\nimport { Form, Formik } from 'formik';\n\ninterface GenericFormContainerProps {\n fields: {\n fieldName: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n defaultValue: any;\n component: React.ReactNode;\n }[];\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n onSubmit: (values: any) => Promise<void>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n handleError?: (error: any) => void;\n submitButtonText: string;\n}\n\nconst GenericFormContainer = ({\n fields,\n onSubmit,\n handleError,\n submitButtonText,\n}: GenericFormContainerProps) => {\n const initialValues = fields.reduce<Record<string, unknown>>((acc, field) => {\n acc[field.fieldName] = field.defaultValue;\n return acc;\n }, {});\n\n return (\n <Formik\n initialValues={initialValues}\n onSubmit={async (values) => {\n try {\n await onSubmit(values);\n } catch (error) {\n if (handleError) {\n handleError(error);\n }\n }\n }}\n >\n {({ isSubmitting }) => (\n <Form>\n {fields.map((field, index) => (\n // eslint-disable-next-line react/no-array-index-key\n <div key={`field_${field.fieldName}_${index}`}>{field.component}</div>\n ))}\n\n <Button\n data-testid=\"submit-form-button\"\n disabled={isSubmitting}\n sx={{ marginTop: 4 }}\n type=\"submit\"\n variant=\"contained\"\n >\n {submitButtonText}\n </Button>\n </Form>\n )}\n </Formik>\n );\n};\n\nexport default GenericFormContainer;\n"],"names":["fields","onSubmit","handleError","submitButtonText","initialValues","reduce","acc","field","fieldName","defaultValue","_jsx","Formik","async","values","error","children","isSubmitting","_jsxs","Form","map","index","jsx","component","Button","disabled","sx","marginTop","type","variant"],"mappings":"qHAkB6B,EAC3BA,SACAC,WACAC,cACAC,uBAEA,MAAMC,EAAgBJ,EAAOK,QAAgC,CAACC,EAAKC,KACjED,EAAIC,EAAMC,WAAaD,EAAME,aACtBH,IACN,IAEH,OACEI,EAAAA,IAACC,EAAAA,OAAM,CACLP,cAAeA,EACfH,SAAUW,MAAOC,IACf,UACQZ,EAASY,GACf,MAAOC,GACHZ,GACFA,EAAYY,KAGjBC,SAEA,EAAGC,kBACFC,EAAAA,KAACC,EAAAA,gBACElB,EAAOmB,KAAI,CAACZ,EAAOa,IAElBV,EAAgDW,IAAA,MAAA,CAAAN,SAAAR,EAAMe,WAA5C,SAASf,EAAMC,aAAaY,OAGxCV,EAAAW,IAACE,EACa,CAAA,cAAA,qBACZC,SAAUR,EACVS,GAAI,CAAEC,UAAW,GACjBC,KAAK,SACLC,QAAQ,YAEPb,SAAAZ"}
@@ -1,6 +1,6 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
 
3
- type GenericFormContainerProps = {
3
+ interface GenericFormContainerProps {
4
4
  fields: {
5
5
  fieldName: string;
6
6
  defaultValue: any;
@@ -9,7 +9,7 @@ type GenericFormContainerProps = {
9
9
  onSubmit: (values: any) => Promise<void>;
10
10
  handleError?: (error: any) => void;
11
11
  submitButtonText: string;
12
- };
13
- declare const GenericFormContainer: ({ fields, onSubmit, handleError, submitButtonText }: GenericFormContainerProps) => react_jsx_runtime.JSX.Element;
12
+ }
13
+ declare const GenericFormContainer: ({ fields, onSubmit, handleError, submitButtonText, }: GenericFormContainerProps) => react_jsx_runtime.JSX.Element;
14
14
 
15
15
  export { GenericFormContainer as default };
@@ -1,2 +1,2 @@
1
- import{jsx as t,jsxs as i}from"react/jsx-runtime";import e from"@mui/material/Button";import{Formik as r,Form as a}from"formik";const n=({fields:n,onSubmit:m,handleError:o,submitButtonText:d})=>{const u=n.reduce(((t,i)=>(t[i.fieldName]=i.defaultValue,t)),{});return t(r,{initialValues:u,onSubmit:async t=>{try{await m(t)}catch(t){o&&o(t)}},children:({isSubmitting:r})=>i(a,{children:[n.map(((i,e)=>t("div",{children:i.component},`field_${i.fieldName}_${e}`))),t(e,{variant:"contained",type:"submit",disabled:r,sx:{marginTop:4},"data-testid":"submit-form-button",children:d})]})})};export{n as default};
1
+ import{jsx as t,jsxs as i}from"react/jsx-runtime";import e from"@mui/material/Button";import{Formik as r,Form as a}from"formik";const n=({fields:n,onSubmit:m,handleError:o,submitButtonText:d})=>{const u=n.reduce(((t,i)=>(t[i.fieldName]=i.defaultValue,t)),{});return t(r,{initialValues:u,onSubmit:async t=>{try{await m(t)}catch(t){o&&o(t)}},children:({isSubmitting:r})=>i(a,{children:[n.map(((i,e)=>t("div",{children:i.component},`field_${i.fieldName}_${e}`))),t(e,{"data-testid":"submit-form-button",disabled:r,sx:{marginTop:4},type:"submit",variant:"contained",children:d})]})})};export{n as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../src/components/Form/GenericFormContainer/index.tsx"],"sourcesContent":["import Button from '@mui/material/Button';\nimport { Form, Formik } from 'formik';\n\ntype GenericFormContainerProps = {\n fields: {\n fieldName: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n defaultValue: any;\n component: React.ReactNode;\n }[];\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n onSubmit: (values: any) => Promise<void>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n handleError?: (error: any) => void;\n submitButtonText: string;\n};\n\nconst GenericFormContainer = ({ fields, onSubmit, handleError, submitButtonText }: GenericFormContainerProps) => {\n const initialValues = fields.reduce((acc, field) => {\n acc[field.fieldName] = field.defaultValue;\n return acc;\n }, {});\n\n return (\n <Formik\n initialValues={initialValues}\n onSubmit={async (values) => {\n try {\n await onSubmit(values);\n } catch (error) {\n if (handleError) {\n handleError(error);\n }\n }\n }}\n >\n {({ isSubmitting }) => (\n <Form>\n {fields.map((field, index) => (\n <div key={`field_${field.fieldName}_${index}`}>{field.component}</div>\n ))}\n\n <Button variant=\"contained\" type=\"submit\" disabled={isSubmitting} sx={{ marginTop: 4 }} data-testid=\"submit-form-button\">\n {submitButtonText}\n </Button>\n </Form>\n )}\n </Formik>\n );\n};\n\nexport default GenericFormContainer;\n"],"names":["GenericFormContainer","fields","onSubmit","handleError","submitButtonText","initialValues","reduce","acc","field","fieldName","defaultValue","_jsx","Formik","async","values","error","children","isSubmitting","_jsxs","Form","map","index","component","Button","variant","type","disabled","sx","marginTop"],"mappings":"gIAiBA,MAAMA,EAAuB,EAAGC,SAAQC,WAAUC,cAAaC,uBAC3D,MAAMC,EAAgBJ,EAAOK,QAAO,CAACC,EAAKC,KACtCD,EAAIC,EAAMC,WAAaD,EAAME,aACtBH,IACR,IAEH,OACII,EAACC,EAAM,CACHP,cAAeA,EACfH,SAAUW,MAAOC,IACb,UACUZ,EAASY,GACjB,MAAOC,GACDZ,GACAA,EAAYY,KAKvBC,SAAA,EAAGC,kBACAC,EAACC,EACI,CAAAH,SAAA,CAAAf,EAAOmB,KAAI,CAACZ,EAAOa,IAChBV,EAAA,MAAA,CAAAK,SAAgDR,EAAMc,WAA5C,SAASd,EAAMC,aAAaY,OAG1CV,EAACY,EAAO,CAAAC,QAAQ,YAAYC,KAAK,SAASC,SAAUT,EAAcU,GAAI,CAAEC,UAAW,GAAG,cAAc,qBAAoBZ,SACnHZ,QAIR"}
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Form/GenericFormContainer/index.tsx"],"sourcesContent":["import Button from '@mui/material/Button';\n\nimport { Form, Formik } from 'formik';\n\ninterface GenericFormContainerProps {\n fields: {\n fieldName: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n defaultValue: any;\n component: React.ReactNode;\n }[];\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n onSubmit: (values: any) => Promise<void>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n handleError?: (error: any) => void;\n submitButtonText: string;\n}\n\nconst GenericFormContainer = ({\n fields,\n onSubmit,\n handleError,\n submitButtonText,\n}: GenericFormContainerProps) => {\n const initialValues = fields.reduce<Record<string, unknown>>((acc, field) => {\n acc[field.fieldName] = field.defaultValue;\n return acc;\n }, {});\n\n return (\n <Formik\n initialValues={initialValues}\n onSubmit={async (values) => {\n try {\n await onSubmit(values);\n } catch (error) {\n if (handleError) {\n handleError(error);\n }\n }\n }}\n >\n {({ isSubmitting }) => (\n <Form>\n {fields.map((field, index) => (\n // eslint-disable-next-line react/no-array-index-key\n <div key={`field_${field.fieldName}_${index}`}>{field.component}</div>\n ))}\n\n <Button\n data-testid=\"submit-form-button\"\n disabled={isSubmitting}\n sx={{ marginTop: 4 }}\n type=\"submit\"\n variant=\"contained\"\n >\n {submitButtonText}\n </Button>\n </Form>\n )}\n </Formik>\n );\n};\n\nexport default GenericFormContainer;\n"],"names":["GenericFormContainer","fields","onSubmit","handleError","submitButtonText","initialValues","reduce","acc","field","fieldName","defaultValue","_jsx","Formik","async","values","error","children","isSubmitting","_jsxs","Form","map","index","component","Button","disabled","sx","marginTop","type","variant"],"mappings":"gIAkBA,MAAMA,EAAuB,EAC3BC,SACAC,WACAC,cACAC,uBAEA,MAAMC,EAAgBJ,EAAOK,QAAgC,CAACC,EAAKC,KACjED,EAAIC,EAAMC,WAAaD,EAAME,aACtBH,IACN,IAEH,OACEI,EAACC,EAAM,CACLP,cAAeA,EACfH,SAAUW,MAAOC,IACf,UACQZ,EAASY,GACf,MAAOC,GACHZ,GACFA,EAAYY,KAGjBC,SAEA,EAAGC,kBACFC,EAACC,aACElB,EAAOmB,KAAI,CAACZ,EAAOa,IAElBV,EAAgD,MAAA,CAAAK,SAAAR,EAAMc,WAA5C,SAASd,EAAMC,aAAaY,OAGxCV,EAACY,EACa,CAAA,cAAA,qBACZC,SAAUP,EACVQ,GAAI,CAAEC,UAAW,GACjBC,KAAK,SACLC,QAAQ,YAEPZ,SAAAZ"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/Form/GenericTextField/index.tsx"],"sourcesContent":["import { type ChangeEvent } from 'react';\n\nimport { type FieldProps, Field } from 'formik';\nimport TextField, { type TextFieldProps } from '@mui/material/TextField';\nimport useRenderValidText from '../../../custom-hooks/useRenderValidText';\nimport FormItemLayout from '../FormItemLayout';\nimport Typography from '@mui/material/Typography';\nimport InputAdornment from '@mui/material/InputAdornment';\n\ntype Props = {\n label: string;\n fieldName?: string;\n placeholder?: string;\n validation?: (value: string) => string | undefined;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n multiline?: boolean;\n minRows?: number;\n maxRows?: number;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n required?: boolean;\n showHelperTextWhenValid?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n value?: string;\n type?: 'number' | 'text';\n};\n\ntype TextFieldComponentProps = {\n field: FieldProps['field'];\n form: FieldProps['form'];\n fieldName: string;\n label: string;\n placeholder?: string;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n multiline?: boolean;\n minRows?: number;\n maxRows?: number;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n required?: boolean;\n showHelperTextWhenValid?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n value?: string;\n type?: 'number' | 'text';\n};\n\nconst TextFieldComponent = ({\n field,\n form,\n fieldName,\n label,\n placeholder,\n onChange,\n multiline,\n minRows,\n maxRows,\n layout = 'horizontal',\n variant = 'standard',\n disabled = false,\n required = false,\n showHelperTextWhenValid = false,\n startIcon,\n endIcon,\n value,\n type = 'text',\n}: TextFieldComponentProps) => {\n const { errors, touched, isSubmitting } = form;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: field.value,\n },\n 'Valid',\n );\n\n return (\n <TextField\n label={variant === 'standard' ? undefined : label}\n variant={variant}\n value={value ?? field.value}\n data-testid={`text-field-${fieldName ?? label.toLowerCase().replace(/\\s+/g, '-')}`}\n autoComplete=\"off\"\n fullWidth\n multiline={multiline}\n minRows={minRows ?? (multiline ? 3 : undefined)}\n maxRows={maxRows ?? (multiline ? 10 : undefined)}\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n placeholder={placeholder || undefined}\n disabled={isSubmitting || disabled}\n required={required}\n error={showError}\n helperText={(() => {\n if (showError) return helperText;\n if (showHelperTextWhenValid) return helperText;\n return undefined;\n })()}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n if (type === 'number' && isNaN(Number(e.target.value))) {\n return;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(fieldName, e.target.value);\n if (onChange) {\n onChange(e);\n }\n }}\n slotProps={{\n htmlInput: {\n style: {\n paddingTop: variant !== 'outlined' ? 0 : undefined,\n height: '1.1876em',\n },\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n InputProps={{\n startAdornment: startIcon ? <InputAdornment position=\"start\">{startIcon}</InputAdornment> : undefined,\n endAdornment: endIcon ? <InputAdornment position=\"end\">{endIcon}</InputAdornment> : undefined,\n }}\n />\n );\n};\n\nconst GenericTextField = ({\n label,\n fieldName = undefined,\n placeholder,\n validation,\n onChange,\n multiline,\n minRows,\n maxRows,\n layout = 'horizontal',\n variant = 'standard',\n disabled = false,\n required = false,\n showHelperTextWhenValid = false,\n startIcon = undefined,\n endIcon = undefined,\n value,\n type = 'text',\n}: Props) => {\n const useFormik = !!fieldName;\n\n const renderField = () => {\n if (!useFormik) {\n return (\n <TextField\n label={variant === 'standard' ? undefined : label}\n variant={variant}\n value={value}\n data-testid={`text-field-${fieldName ?? label.toLowerCase().replace(/\\s+/g, '-')}`}\n autoComplete=\"off\"\n fullWidth\n multiline={multiline}\n minRows={minRows ?? (multiline ? 3 : undefined)}\n maxRows={maxRows ?? (multiline ? 10 : undefined)}\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n placeholder={placeholder || undefined}\n disabled={disabled}\n required={required}\n onChange={onChange}\n slotProps={{\n htmlInput: {\n style: {\n paddingTop: variant !== 'outlined' ? 0 : undefined,\n height: '1.1876em',\n },\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n InputProps={{\n startAdornment: startIcon ? <InputAdornment position=\"start\">{startIcon}</InputAdornment> : undefined,\n endAdornment: endIcon ? <InputAdornment position=\"end\">{endIcon}</InputAdornment> : undefined,\n }}\n />\n );\n }\n\n return (\n <Field name={fieldName} validate={validation}>\n {(fieldProps: FieldProps) => (\n <TextFieldComponent\n {...fieldProps}\n fieldName={fieldName}\n label={label}\n placeholder={placeholder}\n onChange={onChange}\n multiline={multiline}\n minRows={minRows}\n maxRows={maxRows}\n layout={layout}\n variant={variant}\n disabled={disabled}\n required={required}\n showHelperTextWhenValid={showHelperTextWhenValid}\n startIcon={startIcon}\n endIcon={endIcon}\n value={value}\n type={type}\n />\n )}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography variant=\"subtitle1\" component=\"h3\" color=\"textPrimary\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericTextField;\n"],"names":["TextFieldComponent","field","form","fieldName","label","placeholder","onChange","multiline","minRows","maxRows","layout","variant","disabled","required","showHelperTextWhenValid","startIcon","endIcon","value","type","errors","touched","isSubmitting","fieldError","name","showError","helperText","useRenderValidText","_jsx","jsx","TextField","undefined","toLowerCase","replace","autoComplete","fullWidth","style","paddingRight","error","e","isNaN","Number","target","setFieldValue","slotProps","htmlInput","paddingTop","height","formHelperText","children","textAlign","InputProps","startAdornment","InputAdornment","position","endAdornment","validation","useFormik","renderField","Field","validate","fieldProps","_jsxs","jsxs","_Fragment","Typography","component","color","FormItemLayout"],"mappings":"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"}
1
+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/Form/GenericTextField/index.tsx"],"sourcesContent":["import { type ChangeEvent } from 'react';\n\nimport { type FieldProps, Field } from 'formik';\nimport TextField, { type TextFieldProps } from '@mui/material/TextField';\nimport useRenderValidText from '../../../custom-hooks/useRenderValidText';\nimport FormItemLayout from '../FormItemLayout';\nimport Typography from '@mui/material/Typography';\nimport InputAdornment from '@mui/material/InputAdornment';\n\ntype Props = {\n label: string;\n fieldName?: string;\n placeholder?: string;\n validation?: (value: string) => string | undefined;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n multiline?: boolean;\n minRows?: number;\n maxRows?: number;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n required?: boolean;\n showHelperTextWhenValid?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n value?: string;\n type?: 'number' | 'text';\n};\n\ntype TextFieldComponentProps = {\n field: FieldProps['field'];\n form: FieldProps['form'];\n fieldName: string;\n label: string;\n placeholder?: string;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n multiline?: boolean;\n minRows?: number;\n maxRows?: number;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n required?: boolean;\n showHelperTextWhenValid?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n value?: string;\n type?: 'number' | 'text';\n};\n\nconst TextFieldComponent = ({\n field,\n form,\n fieldName,\n label,\n placeholder,\n onChange,\n multiline,\n minRows,\n maxRows,\n layout = 'horizontal',\n variant = 'standard',\n disabled = false,\n required = false,\n showHelperTextWhenValid = false,\n startIcon,\n endIcon,\n value,\n type = 'text',\n}: TextFieldComponentProps) => {\n const { errors, touched, isSubmitting } = form;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: field.value,\n },\n 'Valid',\n );\n\n return (\n <TextField\n label={variant === 'standard' ? undefined : label}\n variant={variant}\n value={value ?? field.value}\n data-testid={`text-field-${fieldName ?? label.toLowerCase().replace(/\\s+/g, '-')}`}\n autoComplete=\"off\"\n fullWidth\n multiline={multiline}\n minRows={minRows ?? (multiline ? 3 : undefined)}\n maxRows={maxRows ?? (multiline ? 10 : undefined)}\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n placeholder={placeholder || undefined}\n disabled={isSubmitting || disabled}\n required={required}\n error={showError}\n helperText={(() => {\n if (showError) return helperText;\n if (showHelperTextWhenValid) return helperText;\n return undefined;\n })()}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n if (type === 'number' && isNaN(Number(e.target.value))) {\n return;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(fieldName, e.target.value);\n if (onChange) {\n onChange(e);\n }\n }}\n slotProps={{\n htmlInput: {\n style: {\n paddingTop: variant !== 'outlined' ? 0 : undefined,\n height: '1.1876em',\n },\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n InputProps={{\n startAdornment: startIcon ? <InputAdornment position=\"start\">{startIcon}</InputAdornment> : undefined,\n endAdornment: endIcon ? <InputAdornment position=\"end\">{endIcon}</InputAdornment> : undefined,\n }}\n />\n );\n};\n\nconst GenericTextField = ({\n label,\n fieldName = undefined,\n placeholder,\n validation,\n onChange,\n multiline,\n minRows,\n maxRows,\n layout = 'horizontal',\n variant = 'standard',\n disabled = false,\n required = false,\n showHelperTextWhenValid = false,\n startIcon = undefined,\n endIcon = undefined,\n value,\n type = 'text',\n}: Props) => {\n const useFormik = !!fieldName;\n\n const renderField = () => {\n if (!useFormik) {\n return (\n <TextField\n label={variant === 'standard' ? undefined : label}\n variant={variant}\n value={value}\n data-testid={`text-field-${fieldName ?? label.toLowerCase().replace(/\\s+/g, '-')}`}\n autoComplete=\"off\"\n fullWidth\n multiline={multiline}\n minRows={minRows ?? (multiline ? 3 : undefined)}\n maxRows={maxRows ?? (multiline ? 10 : undefined)}\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n placeholder={placeholder || undefined}\n disabled={disabled}\n required={required}\n onChange={onChange}\n slotProps={{\n htmlInput: {\n style: {\n paddingTop: variant !== 'outlined' ? 0 : undefined,\n height: '1.1876em',\n },\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n InputProps={{\n startAdornment: startIcon ? <InputAdornment position=\"start\">{startIcon}</InputAdornment> : undefined,\n endAdornment: endIcon ? <InputAdornment position=\"end\">{endIcon}</InputAdornment> : undefined,\n }}\n />\n );\n }\n\n return (\n <Field name={fieldName} validate={validation}>\n {(fieldProps: FieldProps) => (\n <TextFieldComponent\n {...fieldProps}\n fieldName={fieldName}\n label={label}\n placeholder={placeholder}\n onChange={onChange}\n multiline={multiline}\n minRows={minRows}\n maxRows={maxRows}\n layout={layout}\n variant={variant}\n disabled={disabled}\n required={required}\n showHelperTextWhenValid={showHelperTextWhenValid}\n startIcon={startIcon}\n endIcon={endIcon}\n value={value}\n type={type}\n />\n )}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography variant=\"subtitle1\" component=\"h3\" color=\"textPrimary\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericTextField;\n"],"names":["TextFieldComponent","field","form","fieldName","label","placeholder","onChange","multiline","minRows","maxRows","layout","variant","disabled","required","showHelperTextWhenValid","startIcon","endIcon","value","type","errors","touched","isSubmitting","fieldError","name","showError","helperText","useRenderValidText","_jsx","jsx","TextField","undefined","toLowerCase","replace","autoComplete","fullWidth","style","paddingRight","error","e","isNaN","Number","target","setFieldValue","slotProps","htmlInput","paddingTop","height","formHelperText","children","textAlign","InputProps","startAdornment","InputAdornment","position","endAdornment","validation","useFormik","renderField","Field","validate","fieldProps","_jsxs","jsxs","_Fragment","Typography","component","color","FormItemLayout"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../src/components/Form/GenericTextField/index.tsx"],"sourcesContent":["import { type ChangeEvent } from 'react';\n\nimport { type FieldProps, Field } from 'formik';\nimport TextField, { type TextFieldProps } from '@mui/material/TextField';\nimport useRenderValidText from '../../../custom-hooks/useRenderValidText';\nimport FormItemLayout from '../FormItemLayout';\nimport Typography from '@mui/material/Typography';\nimport InputAdornment from '@mui/material/InputAdornment';\n\ntype Props = {\n label: string;\n fieldName?: string;\n placeholder?: string;\n validation?: (value: string) => string | undefined;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n multiline?: boolean;\n minRows?: number;\n maxRows?: number;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n required?: boolean;\n showHelperTextWhenValid?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n value?: string;\n type?: 'number' | 'text';\n};\n\ntype TextFieldComponentProps = {\n field: FieldProps['field'];\n form: FieldProps['form'];\n fieldName: string;\n label: string;\n placeholder?: string;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n multiline?: boolean;\n minRows?: number;\n maxRows?: number;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n required?: boolean;\n showHelperTextWhenValid?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n value?: string;\n type?: 'number' | 'text';\n};\n\nconst TextFieldComponent = ({\n field,\n form,\n fieldName,\n label,\n placeholder,\n onChange,\n multiline,\n minRows,\n maxRows,\n layout = 'horizontal',\n variant = 'standard',\n disabled = false,\n required = false,\n showHelperTextWhenValid = false,\n startIcon,\n endIcon,\n value,\n type = 'text',\n}: TextFieldComponentProps) => {\n const { errors, touched, isSubmitting } = form;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: field.value,\n },\n 'Valid',\n );\n\n return (\n <TextField\n label={variant === 'standard' ? undefined : label}\n variant={variant}\n value={value ?? field.value}\n data-testid={`text-field-${fieldName ?? label.toLowerCase().replace(/\\s+/g, '-')}`}\n autoComplete=\"off\"\n fullWidth\n multiline={multiline}\n minRows={minRows ?? (multiline ? 3 : undefined)}\n maxRows={maxRows ?? (multiline ? 10 : undefined)}\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n placeholder={placeholder || undefined}\n disabled={isSubmitting || disabled}\n required={required}\n error={showError}\n helperText={(() => {\n if (showError) return helperText;\n if (showHelperTextWhenValid) return helperText;\n return undefined;\n })()}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n if (type === 'number' && isNaN(Number(e.target.value))) {\n return;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(fieldName, e.target.value);\n if (onChange) {\n onChange(e);\n }\n }}\n slotProps={{\n htmlInput: {\n style: {\n paddingTop: variant !== 'outlined' ? 0 : undefined,\n height: '1.1876em',\n },\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n InputProps={{\n startAdornment: startIcon ? <InputAdornment position=\"start\">{startIcon}</InputAdornment> : undefined,\n endAdornment: endIcon ? <InputAdornment position=\"end\">{endIcon}</InputAdornment> : undefined,\n }}\n />\n );\n};\n\nconst GenericTextField = ({\n label,\n fieldName = undefined,\n placeholder,\n validation,\n onChange,\n multiline,\n minRows,\n maxRows,\n layout = 'horizontal',\n variant = 'standard',\n disabled = false,\n required = false,\n showHelperTextWhenValid = false,\n startIcon = undefined,\n endIcon = undefined,\n value,\n type = 'text',\n}: Props) => {\n const useFormik = !!fieldName;\n\n const renderField = () => {\n if (!useFormik) {\n return (\n <TextField\n label={variant === 'standard' ? undefined : label}\n variant={variant}\n value={value}\n data-testid={`text-field-${fieldName ?? label.toLowerCase().replace(/\\s+/g, '-')}`}\n autoComplete=\"off\"\n fullWidth\n multiline={multiline}\n minRows={minRows ?? (multiline ? 3 : undefined)}\n maxRows={maxRows ?? (multiline ? 10 : undefined)}\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n placeholder={placeholder || undefined}\n disabled={disabled}\n required={required}\n onChange={onChange}\n slotProps={{\n htmlInput: {\n style: {\n paddingTop: variant !== 'outlined' ? 0 : undefined,\n height: '1.1876em',\n },\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n InputProps={{\n startAdornment: startIcon ? <InputAdornment position=\"start\">{startIcon}</InputAdornment> : undefined,\n endAdornment: endIcon ? <InputAdornment position=\"end\">{endIcon}</InputAdornment> : undefined,\n }}\n />\n );\n }\n\n return (\n <Field name={fieldName} validate={validation}>\n {(fieldProps: FieldProps) => (\n <TextFieldComponent\n {...fieldProps}\n fieldName={fieldName}\n label={label}\n placeholder={placeholder}\n onChange={onChange}\n multiline={multiline}\n minRows={minRows}\n maxRows={maxRows}\n layout={layout}\n variant={variant}\n disabled={disabled}\n required={required}\n showHelperTextWhenValid={showHelperTextWhenValid}\n startIcon={startIcon}\n endIcon={endIcon}\n value={value}\n type={type}\n />\n )}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography variant=\"subtitle1\" component=\"h3\" color=\"textPrimary\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericTextField;\n"],"names":["TextFieldComponent","field","form","fieldName","label","placeholder","onChange","multiline","minRows","maxRows","layout","variant","disabled","required","showHelperTextWhenValid","startIcon","endIcon","value","type","errors","touched","isSubmitting","fieldError","name","showError","helperText","useRenderValidText","_jsx","TextField","undefined","toLowerCase","replace","autoComplete","fullWidth","style","paddingRight","error","e","isNaN","Number","target","setFieldValue","slotProps","htmlInput","paddingTop","height","formHelperText","children","textAlign","InputProps","startAdornment","InputAdornment","position","endAdornment","GenericTextField","validation","useFormik","renderField","Field","validate","fieldProps","_jsxs","_Fragment","Typography","component","color","FormItemLayout"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../../../src/components/Form/GenericTextField/index.tsx"],"sourcesContent":["import { type ChangeEvent } from 'react';\n\nimport { type FieldProps, Field } from 'formik';\nimport TextField, { type TextFieldProps } from '@mui/material/TextField';\nimport useRenderValidText from '../../../custom-hooks/useRenderValidText';\nimport FormItemLayout from '../FormItemLayout';\nimport Typography from '@mui/material/Typography';\nimport InputAdornment from '@mui/material/InputAdornment';\n\ntype Props = {\n label: string;\n fieldName?: string;\n placeholder?: string;\n validation?: (value: string) => string | undefined;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n multiline?: boolean;\n minRows?: number;\n maxRows?: number;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n required?: boolean;\n showHelperTextWhenValid?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n value?: string;\n type?: 'number' | 'text';\n};\n\ntype TextFieldComponentProps = {\n field: FieldProps['field'];\n form: FieldProps['form'];\n fieldName: string;\n label: string;\n placeholder?: string;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n multiline?: boolean;\n minRows?: number;\n maxRows?: number;\n layout?: 'horizontal' | 'vertical';\n variant?: TextFieldProps['variant'];\n disabled?: boolean;\n required?: boolean;\n showHelperTextWhenValid?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n value?: string;\n type?: 'number' | 'text';\n};\n\nconst TextFieldComponent = ({\n field,\n form,\n fieldName,\n label,\n placeholder,\n onChange,\n multiline,\n minRows,\n maxRows,\n layout = 'horizontal',\n variant = 'standard',\n disabled = false,\n required = false,\n showHelperTextWhenValid = false,\n startIcon,\n endIcon,\n value,\n type = 'text',\n}: TextFieldComponentProps) => {\n const { errors, touched, isSubmitting } = form;\n const fieldError = errors[field.name] as string | undefined;\n const showError = !!fieldError && (touched[field.name] as boolean | undefined);\n const helperText = useRenderValidText(\n {\n fieldError,\n showError,\n touched: !!touched[field.name],\n value: field.value,\n },\n 'Valid',\n );\n\n return (\n <TextField\n label={variant === 'standard' ? undefined : label}\n variant={variant}\n value={value ?? field.value}\n data-testid={`text-field-${fieldName ?? label.toLowerCase().replace(/\\s+/g, '-')}`}\n autoComplete=\"off\"\n fullWidth\n multiline={multiline}\n minRows={minRows ?? (multiline ? 3 : undefined)}\n maxRows={maxRows ?? (multiline ? 10 : undefined)}\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n placeholder={placeholder || undefined}\n disabled={isSubmitting || disabled}\n required={required}\n error={showError}\n helperText={(() => {\n if (showError) return helperText;\n if (showHelperTextWhenValid) return helperText;\n return undefined;\n })()}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n if (type === 'number' && isNaN(Number(e.target.value))) {\n return;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n form.setFieldValue(fieldName, e.target.value);\n if (onChange) {\n onChange(e);\n }\n }}\n slotProps={{\n htmlInput: {\n style: {\n paddingTop: variant !== 'outlined' ? 0 : undefined,\n height: '1.1876em',\n },\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n InputProps={{\n startAdornment: startIcon ? <InputAdornment position=\"start\">{startIcon}</InputAdornment> : undefined,\n endAdornment: endIcon ? <InputAdornment position=\"end\">{endIcon}</InputAdornment> : undefined,\n }}\n />\n );\n};\n\nconst GenericTextField = ({\n label,\n fieldName = undefined,\n placeholder,\n validation,\n onChange,\n multiline,\n minRows,\n maxRows,\n layout = 'horizontal',\n variant = 'standard',\n disabled = false,\n required = false,\n showHelperTextWhenValid = false,\n startIcon = undefined,\n endIcon = undefined,\n value,\n type = 'text',\n}: Props) => {\n const useFormik = !!fieldName;\n\n const renderField = () => {\n if (!useFormik) {\n return (\n <TextField\n label={variant === 'standard' ? undefined : label}\n variant={variant}\n value={value}\n data-testid={`text-field-${fieldName ?? label.toLowerCase().replace(/\\s+/g, '-')}`}\n autoComplete=\"off\"\n fullWidth\n multiline={multiline}\n minRows={minRows ?? (multiline ? 3 : undefined)}\n maxRows={maxRows ?? (multiline ? 10 : undefined)}\n style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n placeholder={placeholder || undefined}\n disabled={disabled}\n required={required}\n onChange={onChange}\n slotProps={{\n htmlInput: {\n style: {\n paddingTop: variant !== 'outlined' ? 0 : undefined,\n height: '1.1876em',\n },\n },\n formHelperText: {\n children: ' ', // reserves line height for error message\n style: { textAlign: 'right' },\n },\n }}\n InputProps={{\n startAdornment: startIcon ? <InputAdornment position=\"start\">{startIcon}</InputAdornment> : undefined,\n endAdornment: endIcon ? <InputAdornment position=\"end\">{endIcon}</InputAdornment> : undefined,\n }}\n />\n );\n }\n\n return (\n <Field name={fieldName} validate={validation}>\n {(fieldProps: FieldProps) => (\n <TextFieldComponent\n {...fieldProps}\n fieldName={fieldName}\n label={label}\n placeholder={placeholder}\n onChange={onChange}\n multiline={multiline}\n minRows={minRows}\n maxRows={maxRows}\n layout={layout}\n variant={variant}\n disabled={disabled}\n required={required}\n showHelperTextWhenValid={showHelperTextWhenValid}\n startIcon={startIcon}\n endIcon={endIcon}\n value={value}\n type={type}\n />\n )}\n </Field>\n );\n };\n\n if (layout === 'vertical') {\n return (\n <>\n {variant === 'standard' && (\n <Typography variant=\"subtitle1\" component=\"h3\" color=\"textPrimary\">\n {label}\n </Typography>\n )}\n {renderField()}\n </>\n );\n }\n\n return <FormItemLayout label={label}>{renderField()}</FormItemLayout>;\n};\n\nexport default GenericTextField;\n"],"names":["TextFieldComponent","field","form","fieldName","label","placeholder","onChange","multiline","minRows","maxRows","layout","variant","disabled","required","showHelperTextWhenValid","startIcon","endIcon","value","type","errors","touched","isSubmitting","fieldError","name","showError","helperText","useRenderValidText","_jsx","TextField","undefined","toLowerCase","replace","autoComplete","fullWidth","style","paddingRight","error","e","isNaN","Number","target","setFieldValue","slotProps","htmlInput","paddingTop","height","formHelperText","children","textAlign","InputProps","startAdornment","InputAdornment","position","endAdornment","GenericTextField","validation","useFormik","renderField","Field","validate","fieldProps","_jsxs","_Fragment","Typography","component","color","FormItemLayout"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";var e=require("react/jsx-runtime"),t=require("formik"),r=require("react"),n=require("../GenericAutocompleteField/index.cjs.js"),u=require("lodash.debounce"),o=require("@tanstack/react-query");module.exports=a=>{const{fieldName:s,fetch:c,onChange:i,onInputChange:l,onScroll:d}=a,{values:g}=t.useFormikContext(),[h,q]=r.useState(g[s]?[g[s]]:[]),[f,m]=r.useState(1),[p,y]=r.useState(""),[C,S]=r.useState(!0),{data:x,isLoading:j}=o.useQuery({queryKey:[`PaginatedAutocompleteField-${s}`,f,p],queryFn:()=>c(f,p),retry:1});r.useEffect((()=>{x&&0!==x.length?(S(!0),q(1===f?x:e=>[...e,...x])):S(!1)}),[x]);const k=r.useCallback((()=>{!j&&C&&m((e=>e+1))}),[j,C]),F=u((e=>{m(1),y(e),S(!0)}),500);return r.useEffect((()=>()=>{F.cancel()}),[F]),e.jsx(n,{...a,options:h,loading:j,onChange:(e,t)=>{y(""),i&&i(e,t)},onInputChange:(e,t)=>{F(t),l&&l(e,t)},onScroll:e=>{(e=>{const t=e.currentTarget;t.scrollTop+t.clientHeight>=t.scrollHeight-100&&k()})(e),d&&d(e)}})};
1
+ "use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("@tanstack/react-query"),n=require("formik"),u=require("lodash.debounce"),o=require("../GenericAutocompleteField/index.cjs.js");module.exports=a=>{const{fieldName:s,fetch:c,onChange:i,onInputChange:l,onScroll:d}=a,{values:g}=n.useFormikContext(),[h,q]=t.useState(g[s]?[g[s]]:[]),[f,m]=t.useState(1),[p,y]=t.useState(""),[C,S]=t.useState(!0),{data:x,isLoading:j}=r.useQuery({queryKey:[`PaginatedAutocompleteField-${s}`,f,p],queryFn:()=>c(f,p),retry:1});t.useEffect((()=>{x&&0!==x.length?(S(!0),q(1===f?x:e=>[...e,...x])):S(!1)}),[x]);const k=t.useCallback((()=>{!j&&C&&m((e=>e+1))}),[j,C]),F=u((e=>{m(1),y(e),S(!0)}),500);return t.useEffect((()=>()=>{F.cancel()}),[F]),e.jsx(o,{...a,loading:j,options:h,onChange:(e,t)=>{y(""),i&&i(e,t)},onInputChange:(e,t)=>{F(t),l&&l(e,t)},onScroll:e=>{(e=>{const t=e.currentTarget;t.scrollTop+t.clientHeight>=t.scrollHeight-100&&k()})(e),d&&d(e)}})};
2
2
  //# sourceMappingURL=index.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/Form/PaginatedAutocompleteField/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { useFormikContext } from 'formik';\nimport { type SyntheticEvent, useCallback, useEffect, useState } from 'react';\nimport GenericAutocompleteField, { type Props as GenericAutocompleteFieldProps } from '../GenericAutocompleteField';\nimport debounce from 'lodash.debounce';\nimport { useQuery } from '@tanstack/react-query';\n\ntype Props<T> = Omit<GenericAutocompleteFieldProps<T>, 'options'> & {\n fetch: (page: number, search: string) => Promise<T[]>;\n};\n\nconst PaginatedAutocompleteField = <T,>(props: Props<T>) => {\n const { fieldName, fetch, onChange, onInputChange, onScroll } = props;\n const { values } = useFormikContext<{ [key: string]: any }>();\n\n const [options, setOptions] = useState<T[]>(values[fieldName] ? [values[fieldName]] : []);\n const [page, setPage] = useState(1);\n const [searchQuery, setSearchQuery] = useState('');\n const [hasMore, setHasMore] = useState(true);\n\n const { data: queryResult, isLoading } = useQuery({\n queryKey: [`PaginatedAutocompleteField-${fieldName}`, page, searchQuery],\n queryFn: () => fetch(page, searchQuery),\n retry: 1,\n });\n\n useEffect(() => {\n if (!queryResult || queryResult.length === 0) {\n setHasMore(false);\n return;\n }\n setHasMore(true);\n if (page === 1) {\n setOptions(queryResult);\n } else {\n setOptions((prevVouchers) => [...prevVouchers, ...queryResult]);\n }\n }, [queryResult]);\n\n const loadMore = useCallback(() => {\n if (isLoading || !hasMore) {\n return;\n }\n setPage((prevPage) => prevPage + 1);\n }, [isLoading, hasMore]);\n\n const handleScroll = (event: React.UIEvent<HTMLUListElement, UIEvent>) => {\n const listboxNode = event.currentTarget;\n if (\n listboxNode.scrollTop + listboxNode.clientHeight >=\n listboxNode.scrollHeight - 100 // Trigger 100px before the bottom\n ) {\n loadMore();\n }\n };\n\n const handleInputChange = debounce((value: string) => {\n setPage(1);\n setSearchQuery(value);\n setHasMore(true);\n }, 500);\n\n useEffect(() => {\n return () => {\n handleInputChange.cancel();\n };\n }, [handleInputChange]);\n\n return (\n <GenericAutocompleteField\n {...props}\n options={options}\n loading={isLoading}\n onChange={(e: SyntheticEvent, value: T[]) => {\n setSearchQuery('');\n if (onChange) {\n onChange(e, value);\n }\n }}\n onInputChange={(e: SyntheticEvent, value: string) => {\n handleInputChange(value);\n if (onInputChange) {\n onInputChange(e, value);\n }\n }}\n onScroll={(e: React.UIEvent<HTMLUListElement, UIEvent>) => {\n handleScroll(e);\n if (onScroll) {\n onScroll(e);\n }\n }}\n />\n );\n};\n\nexport default PaginatedAutocompleteField;\n"],"names":["props","fieldName","fetch","onChange","onInputChange","onScroll","values","useFormikContext","options","setOptions","useState","page","setPage","searchQuery","setSearchQuery","hasMore","setHasMore","data","queryResult","isLoading","useQuery","queryKey","queryFn","retry","useEffect","length","prevVouchers","loadMore","useCallback","prevPage","handleInputChange","debounce","value","cancel","_jsx","GenericAutocompleteField","loading","e","event","listboxNode","currentTarget","scrollTop","clientHeight","scrollHeight","handleScroll"],"mappings":"4NAWwCA,IACpC,MAAMC,UAAEA,EAASC,MAAEA,EAAKC,SAAEA,EAAQC,cAAEA,EAAaC,SAAEA,GAAaL,GAC1DM,OAAEA,GAAWC,sBAEZC,EAASC,GAAcC,EAAQA,SAAMJ,EAAOL,GAAa,CAACK,EAAOL,IAAc,KAC/EU,EAAMC,GAAWF,EAAAA,SAAS,IAC1BG,EAAaC,GAAkBJ,EAAAA,SAAS,KACxCK,EAASC,GAAcN,EAAAA,UAAS,IAE/BO,KAAMC,EAAWC,UAAEA,GAAcC,EAAAA,SAAS,CAC9CC,SAAU,CAAC,8BAA8BpB,IAAaU,EAAME,GAC5DS,QAAS,IAAMpB,EAAMS,EAAME,GAC3BU,MAAO,IAGXC,EAAAA,WAAU,KACDN,GAAsC,IAAvBA,EAAYO,QAIhCT,GAAW,GAEPP,EADS,IAATE,EACWO,EAECQ,GAAiB,IAAIA,KAAiBR,KAPlDF,GAAW,KAShB,CAACE,IAEJ,MAAMS,EAAWC,EAAAA,aAAY,MACrBT,GAAcJ,GAGlBH,GAASiB,GAAaA,EAAW,GAAE,GACpC,CAACV,EAAWJ,IAYTe,EAAoBC,GAAUC,IAChCpB,EAAQ,GACRE,EAAekB,GACfhB,GAAW,EAAK,GACjB,KAQH,OANAQ,EAAAA,WAAU,IACC,KACHM,EAAkBG,QAAQ,GAE/B,CAACH,IAGAI,MAACC,EAAwB,IACjBnC,EACJQ,QAASA,EACT4B,QAASjB,EACThB,SAAU,CAACkC,EAAmBL,KAC1BlB,EAAe,IACXX,GACAA,EAASkC,EAAGL,IAGpB5B,cAAe,CAACiC,EAAmBL,KAC/BF,EAAkBE,GACd5B,GACAA,EAAciC,EAAGL,IAGzB3B,SAAWgC,IAvCE,CAACC,IAClB,MAAMC,EAAcD,EAAME,cAEtBD,EAAYE,UAAYF,EAAYG,cACpCH,EAAYI,aAAe,KAE3BhB,KAkCIiB,CAAaP,GACThC,GACAA,EAASgC,KAGnB"}
1
+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/Form/PaginatedAutocompleteField/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { type SyntheticEvent, useCallback, useEffect, useState } from 'react';\n\nimport { useQuery } from '@tanstack/react-query';\nimport { useFormikContext } from 'formik';\nimport debounce from 'lodash.debounce';\n\nimport GenericAutocompleteField, {\n type Props as GenericAutocompleteFieldProps,\n} from '../GenericAutocompleteField';\n\ntype Props<T> = Omit<GenericAutocompleteFieldProps<T>, 'options'> & {\n fetch: (page: number, search: string) => Promise<T[]>;\n};\n\nconst PaginatedAutocompleteField = <T,>(props: Props<T>) => {\n const { fieldName, fetch, onChange, onInputChange, onScroll } = props;\n const { values } = useFormikContext<{ [key: string]: any }>();\n\n const [options, setOptions] = useState<T[]>(values[fieldName] ? [values[fieldName]] : []);\n const [page, setPage] = useState(1);\n const [searchQuery, setSearchQuery] = useState('');\n const [hasMore, setHasMore] = useState(true);\n\n const { data: queryResult, isLoading } = useQuery({\n queryKey: [`PaginatedAutocompleteField-${fieldName}`, page, searchQuery],\n queryFn: () => fetch(page, searchQuery),\n retry: 1,\n });\n\n useEffect(() => {\n if (!queryResult || queryResult.length === 0) {\n setHasMore(false);\n return;\n }\n setHasMore(true);\n if (page === 1) {\n setOptions(queryResult);\n } else {\n setOptions((prevVouchers) => [...prevVouchers, ...queryResult]);\n }\n }, [queryResult]);\n\n const loadMore = useCallback(() => {\n if (isLoading || !hasMore) {\n return;\n }\n setPage((prevPage) => prevPage + 1);\n }, [isLoading, hasMore]);\n\n const handleScroll = (event: React.UIEvent<HTMLUListElement, UIEvent>) => {\n const listboxNode = event.currentTarget;\n if (\n listboxNode.scrollTop + listboxNode.clientHeight >=\n listboxNode.scrollHeight - 100 // Trigger 100px before the bottom\n ) {\n loadMore();\n }\n };\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-call\n const handleInputChange = debounce((value: string) => {\n setPage(1);\n setSearchQuery(value);\n setHasMore(true);\n }, 500);\n\n useEffect(() => {\n return () => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access\n handleInputChange.cancel();\n };\n }, [handleInputChange]);\n\n return (\n <GenericAutocompleteField\n {...props}\n loading={isLoading}\n options={options}\n onChange={(e: SyntheticEvent<Element, Event>, value: T | T[] | null) => {\n setSearchQuery('');\n if (onChange) {\n onChange(e, value);\n }\n }}\n onInputChange={(e: SyntheticEvent, value: string) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n handleInputChange(value);\n if (onInputChange) {\n onInputChange(e, value);\n }\n }}\n onScroll={(e: React.UIEvent<HTMLUListElement, UIEvent>) => {\n handleScroll(e);\n if (onScroll) {\n onScroll(e);\n }\n }}\n />\n );\n};\n\nexport default PaginatedAutocompleteField;\n"],"names":["props","fieldName","fetch","onChange","onInputChange","onScroll","values","useFormikContext","options","setOptions","useState","page","setPage","searchQuery","setSearchQuery","hasMore","setHasMore","data","queryResult","isLoading","useQuery","queryKey","queryFn","retry","useEffect","length","prevVouchers","loadMore","useCallback","prevPage","handleInputChange","debounce","value","cancel","_jsx","GenericAutocompleteField","loading","e","event","listboxNode","currentTarget","scrollTop","clientHeight","scrollHeight","handleScroll"],"mappings":"4NAewCA,IACtC,MAAMC,UAAEA,EAASC,MAAEA,EAAKC,SAAEA,EAAQC,cAAEA,EAAaC,SAAEA,GAAaL,GAC1DM,OAAEA,GAAWC,sBAEZC,EAASC,GAAcC,EAAQA,SAAMJ,EAAOL,GAAa,CAACK,EAAOL,IAAc,KAC/EU,EAAMC,GAAWF,EAAAA,SAAS,IAC1BG,EAAaC,GAAkBJ,EAAAA,SAAS,KACxCK,EAASC,GAAcN,EAAAA,UAAS,IAE/BO,KAAMC,EAAWC,UAAEA,GAAcC,EAAAA,SAAS,CAChDC,SAAU,CAAC,8BAA8BpB,IAAaU,EAAME,GAC5DS,QAAS,IAAMpB,EAAMS,EAAME,GAC3BU,MAAO,IAGTC,EAAAA,WAAU,KACHN,GAAsC,IAAvBA,EAAYO,QAIhCT,GAAW,GAETP,EADW,IAATE,EACSO,EAECQ,GAAiB,IAAIA,KAAiBR,KAPlDF,GAAW,KASZ,CAACE,IAEJ,MAAMS,EAAWC,EAAAA,aAAY,MACvBT,GAAcJ,GAGlBH,GAASiB,GAAaA,EAAW,MAChC,CAACV,EAAWJ,IAaTe,EAAoBC,GAAUC,IAClCpB,EAAQ,GACRE,EAAekB,GACfhB,GAAW,KACV,KASH,OAPAQ,EAAAA,WAAU,IACD,KAELM,EAAkBG,WAEnB,CAACH,IAGFI,MAACC,EAAwB,IACnBnC,EACJoC,QAASjB,EACTX,QAASA,EACTL,SAAU,CAACkC,EAAmCL,KAC5ClB,EAAe,IACXX,GACFA,EAASkC,EAAGL,IAGhB5B,cAAe,CAACiC,EAAmBL,KAEjCF,EAAkBE,GACd5B,GACFA,EAAciC,EAAGL,IAGrB3B,SAAWgC,IA1CM,CAACC,IACpB,MAAMC,EAAcD,EAAME,cAExBD,EAAYE,UAAYF,EAAYG,cACpCH,EAAYI,aAAe,KAE3BhB,KAqCEiB,CAAaP,GACThC,GACFA,EAASgC"}
@@ -1,2 +1,2 @@
1
- import{jsx as e}from"react/jsx-runtime";import{useFormikContext as o}from"formik";import{useState as t,useEffect as r,useCallback as n}from"react";import a from"../GenericAutocompleteField/index.js";import c from"lodash.debounce";import{useQuery as i}from"@tanstack/react-query";const l=l=>{const{fieldName:m,fetch:s,onChange:p,onInputChange:u,onScroll:d}=l,{values:g}=o(),[f,h]=t(g[m]?[g[m]]:[]),[y,C]=t(1),[q,x]=t(""),[F,j]=t(!0),{data:k,isLoading:A}=i({queryKey:[`PaginatedAutocompleteField-${m}`,y,q],queryFn:()=>s(y,q),retry:1});r((()=>{k&&0!==k.length?(j(!0),h(1===y?k:e=>[...e,...k])):j(!1)}),[k]);const H=n((()=>{!A&&F&&C((e=>e+1))}),[A,F]),I=c((e=>{C(1),x(e),j(!0)}),500);return r((()=>()=>{I.cancel()}),[I]),e(a,{...l,options:f,loading:A,onChange:(e,o)=>{x(""),p&&p(e,o)},onInputChange:(e,o)=>{I(o),u&&u(e,o)},onScroll:e=>{(e=>{const o=e.currentTarget;o.scrollTop+o.clientHeight>=o.scrollHeight-100&&H()})(e),d&&d(e)}})};export{l as default};
1
+ import{jsx as e}from"react/jsx-runtime";import{useState as o,useEffect as t,useCallback as r}from"react";import{useQuery as n}from"@tanstack/react-query";import{useFormikContext as a}from"formik";import c from"lodash.debounce";import i from"../GenericAutocompleteField/index.js";const l=l=>{const{fieldName:m,fetch:s,onChange:p,onInputChange:u,onScroll:d}=l,{values:g}=a(),[f,h]=o(g[m]?[g[m]]:[]),[y,C]=o(1),[q,x]=o(""),[F,j]=o(!0),{data:k,isLoading:A}=n({queryKey:[`PaginatedAutocompleteField-${m}`,y,q],queryFn:()=>s(y,q),retry:1});t((()=>{k&&0!==k.length?(j(!0),h(1===y?k:e=>[...e,...k])):j(!1)}),[k]);const H=r((()=>{!A&&F&&C((e=>e+1))}),[A,F]),I=c((e=>{C(1),x(e),j(!0)}),500);return t((()=>()=>{I.cancel()}),[I]),e(i,{...l,loading:A,options:f,onChange:(e,o)=>{x(""),p&&p(e,o)},onInputChange:(e,o)=>{I(o),u&&u(e,o)},onScroll:e=>{(e=>{const o=e.currentTarget;o.scrollTop+o.clientHeight>=o.scrollHeight-100&&H()})(e),d&&d(e)}})};export{l as default};
2
2
  //# sourceMappingURL=index.js.map