@flipdish/portal-library 1.0.35 → 1.0.37

package/dist/components/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("./themes/flipdishPublicTheme.cjs.js"),r=require("./ui/NotFoundPage/NotFoundPage.cjs.js"),i=require("./ui/PageLayout/PageLayout.cjs.js"),o=require("./ui/PortalMock/PortalMock.cjs.js"),s=require("./ui/LazyComponent/LazyComponent.cjs.js"),t=require("./ui/Spacer/Spacer.cjs.js"),c=require("./ui/Chip/Chip.cjs.js"),a=require("./ui/Switch/Switch.cjs.js"),u=require("./ui/Form/utilities/formValidation.cjs.js"),j=require("./ui/Form/GenericFormContainer.cjs.js"),n=require("./ui/Form/GenericTextField.cjs.js"),l=require("./ui/GenericTable/GenericTable.cjs.js"),p=require("./ui/GenericTableBody/GenericTableBody.cjs.js"),T=require("./ui/GenericTableBodyRow/GenericTableBodyRow.cjs.js"),d=require("./ui/GenericTableTitle/GenericTableTitle.cjs.js");require("react/jsx-runtime"),require("react"),require("../providers/TranslationProvider.cjs.js"),exports.flipdishPublicTheme=e,exports.NotFoundPage=r,exports.PageLayout=i.default,exports.PortalMock=o,exports.LazyComponent=s,exports.Spacer=t,exports.Chip=c,exports.Switch=a,exports.formikValidate=u.formikValidate,exports.GenericFormContainer=j,exports.GenericTextField=n,exports.GenericTable=l,exports.GenericTableBody=p,exports.GenericTableBodyRow=T,exports.GenericTableTitle=d;
+"use strict";var e=require("./themes/flipdishPublicTheme.cjs.js"),r=require("./ui/NotFoundPage/NotFoundPage.cjs.js"),i=require("./ui/PageLayout/PageLayout.cjs.js"),o=require("./ui/PortalMock/PortalMock.cjs.js"),s=require("./ui/LazyComponent/LazyComponent.cjs.js"),t=require("./ui/Spacer/Spacer.cjs.js"),c=require("./ui/Chip/Chip.cjs.js"),a=require("./ui/Switch/Switch.cjs.js"),u=require("./ui/Form/utilities/formValidation.cjs.js"),n=require("./ui/Form/GenericFormContainer.cjs.js"),j=require("./ui/Form/GenericTextField.cjs.js"),l=require("./ui/GenericDateTimePickerField/GenericDateTimePickerField.cjs.js"),p=require("./ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.cjs.js"),d=require("./ui/GenericTable/GenericTable.cjs.js"),T=require("./ui/GenericTableBody/GenericTableBody.cjs.js"),m=require("./ui/GenericTableBodyRow/GenericTableBodyRow.cjs.js"),q=require("./ui/GenericTableTitle/GenericTableTitle.cjs.js");require("react/jsx-runtime"),require("react"),require("../providers/TranslationProvider.cjs.js"),exports.flipdishPublicTheme=e,exports.NotFoundPage=r,exports.PageLayout=i.default,exports.PortalMock=o,exports.LazyComponent=s,exports.Spacer=t,exports.Chip=c,exports.Switch=a,exports.formikValidate=u.formikValidate,exports.GenericFormContainer=n,exports.GenericTextField=j,exports.GenericDatePickerField=l,exports.DateTimeLocalizationProvider=p,exports.GenericTable=d,exports.GenericTableBody=T,exports.GenericTableBodyRow=m,exports.GenericTableTitle=q;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/index.d.ts

@@ -9,6 +9,8 @@ export { default as Switch } from './ui/Switch/Switch.js';
 export { formikValidate } from './ui/Form/utilities/formValidation.js';
 export { default as GenericFormContainer } from './ui/Form/GenericFormContainer.js';
 export { default as GenericTextField } from './ui/Form/GenericTextField.js';
+export { default as GenericDatePickerField } from './ui/GenericDateTimePickerField/GenericDateTimePickerField.js';
+export { default as DateTimeLocalizationProvider } from './ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.js';
 export { GenericTableColumns } from './ui/GenericTable/types.js';
 export { default as GenericTable } from './ui/GenericTable/GenericTable.js';
 export { default as GenericTableBody } from './ui/GenericTableBody/GenericTableBody.js';

package/dist/components/index.js

@@ -1,2 +1,2 @@
-export{default as flipdishPublicTheme}from"./themes/flipdishPublicTheme.js";export{default as NotFoundPage}from"./ui/NotFoundPage/NotFoundPage.js";export{default as PageLayout}from"./ui/PageLayout/PageLayout.js";export{default as PortalMock}from"./ui/PortalMock/PortalMock.js";export{default as LazyComponent}from"./ui/LazyComponent/LazyComponent.js";export{default as Spacer}from"./ui/Spacer/Spacer.js";export{default as Chip}from"./ui/Chip/Chip.js";export{default as Switch}from"./ui/Switch/Switch.js";export{formikValidate}from"./ui/Form/utilities/formValidation.js";export{default as GenericFormContainer}from"./ui/Form/GenericFormContainer.js";export{default as GenericTextField}from"./ui/Form/GenericTextField.js";export{default as GenericTable}from"./ui/GenericTable/GenericTable.js";export{default as GenericTableBody}from"./ui/GenericTableBody/GenericTableBody.js";export{default as GenericTableBodyRow}from"./ui/GenericTableBodyRow/GenericTableBodyRow.js";export{default as GenericTableTitle}from"./ui/GenericTableTitle/GenericTableTitle.js";import"react/jsx-runtime";import"react";import"../providers/TranslationProvider.js";
+export{default as flipdishPublicTheme}from"./themes/flipdishPublicTheme.js";export{default as NotFoundPage}from"./ui/NotFoundPage/NotFoundPage.js";export{default as PageLayout}from"./ui/PageLayout/PageLayout.js";export{default as PortalMock}from"./ui/PortalMock/PortalMock.js";export{default as LazyComponent}from"./ui/LazyComponent/LazyComponent.js";export{default as Spacer}from"./ui/Spacer/Spacer.js";export{default as Chip}from"./ui/Chip/Chip.js";export{default as Switch}from"./ui/Switch/Switch.js";export{formikValidate}from"./ui/Form/utilities/formValidation.js";export{default as GenericFormContainer}from"./ui/Form/GenericFormContainer.js";export{default as GenericTextField}from"./ui/Form/GenericTextField.js";export{default as GenericDatePickerField}from"./ui/GenericDateTimePickerField/GenericDateTimePickerField.js";export{default as DateTimeLocalizationProvider}from"./ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.js";export{default as GenericTable}from"./ui/GenericTable/GenericTable.js";export{default as GenericTableBody}from"./ui/GenericTableBody/GenericTableBody.js";export{default as GenericTableBodyRow}from"./ui/GenericTableBodyRow/GenericTableBodyRow.js";export{default as GenericTableTitle}from"./ui/GenericTableTitle/GenericTableTitle.js";import"react/jsx-runtime";import"react";import"../providers/TranslationProvider.js";
 //# sourceMappingURL=index.js.map

package/dist/components/ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react/jsx-runtime"),r=require("@mui/x-date-pickers/AdapterMoment"),i=require("@mui/x-date-pickers/LocalizationProvider");module.exports=({children:t})=>e.jsx(i.LocalizationProvider,{dateAdapter:r.AdapterMoment,children:t});
+//# sourceMappingURL=DateTimeLocalizationProvider.cjs.js.map

package/dist/components/ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimeLocalizationProvider.cjs.js","sources":["../../../../src/components/ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment';\nimport { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';\n\nconst DateTimeLocalizationProvider = ({ children }: { children: ReactNode }) => {\n    return <LocalizationProvider dateAdapter={AdapterMoment}>{children}</LocalizationProvider>;\n};\n\nexport default DateTimeLocalizationProvider;\n"],"names":["children","_jsx","LocalizationProvider","dateAdapter","AdapterMoment"],"mappings":"oKAIqC,EAAGA,cAC7BC,EAAAA,IAACC,EAAAA,qBAAqB,CAAAC,YAAaC,EAAAA,cAAaJ,SAAGA"}

package/dist/components/ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.d.ts

@@ -0,0 +1,8 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+declare const DateTimeLocalizationProvider: ({ children }: {
+    children: ReactNode;
+}) => react_jsx_runtime.JSX.Element;
+
+export { DateTimeLocalizationProvider as default };

package/dist/components/ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.js

@@ -0,0 +1,2 @@
+import{jsx as r}from"react/jsx-runtime";import{AdapterMoment as e}from"@mui/x-date-pickers/AdapterMoment";import{LocalizationProvider as t}from"@mui/x-date-pickers/LocalizationProvider";const i=({children:i})=>r(t,{dateAdapter:e,children:i});export{i as default};
+//# sourceMappingURL=DateTimeLocalizationProvider.js.map

package/dist/components/ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimeLocalizationProvider.js","sources":["../../../../src/components/ui/DateTimeLocalizationProvider/DateTimeLocalizationProvider.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment';\nimport { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';\n\nconst DateTimeLocalizationProvider = ({ children }: { children: ReactNode }) => {\n    return <LocalizationProvider dateAdapter={AdapterMoment}>{children}</LocalizationProvider>;\n};\n\nexport default DateTimeLocalizationProvider;\n"],"names":["DateTimeLocalizationProvider","children","_jsx","LocalizationProvider","dateAdapter","AdapterMoment"],"mappings":"0LAIA,MAAMA,EAA+B,EAAGC,cAC7BC,EAACC,EAAqB,CAAAC,YAAaC,EAAaJ,SAAGA"}

package/dist/components/ui/Form/GenericTextField.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("formik"),i=require("@mui/material/TextField"),t=require("../../custom-hooks/useRenderValidText.cjs.js"),a=require("./FormItemLayout.cjs.js"),l=require("@mui/material/Typography");module.exports=({label:o,fieldName:d,placeholder:n,validation:s,onChange:u,multiline:m,minRows:h,maxRows:c,layout:v="horizontal",variant:x="standard",disabled:p=!1,required:g=!1})=>{const j=()=>e.jsx(r.Field,{name:d,validate:s,children:({field:r,form:a})=>{const{errors:l,touched:s,isSubmitting:j}=a,f=l[r.name],q=!!f&&s[r.name],y=t({fieldError:f,showError:q,touched:!!s[r.name],value:r.value});return e.jsx(i,{label:"standard"===x?void 0:o,variant:x,value:r.value,"data-testid":`text-field-${d}`,autoComplete:"off",fullWidth:!0,multiline:!0,minRows:h??(m?3:void 0),maxRows:c??(m?10:void 0),style:{paddingRight:"horizontal"===v?16:0},placeholder:n||void 0,disabled:j||p,required:g,error:q,helperText:y,FormHelperTextProps:{children:" ",style:{textAlign:"right"}},inputProps:{style:{paddingTop:0,height:"1.1876em"}},onChange:e=>{a.setFieldValue(r.name,e.target.value),u&&u(e)}})}});return"vertical"===v?e.jsxs(e.Fragment,{children:["standard"===x&&e.jsx(l,{variant:"subtitle1",component:"h3",color:"textPrimary",children:o}),j()]}):e.jsx(a,{label:o,children:j()})};
+"use strict";var e=require("react/jsx-runtime"),r=require("formik"),i=require("@mui/material/TextField"),t=require("../../custom-hooks/useRenderValidText.cjs.js"),a=require("./FormItemLayout.cjs.js"),l=require("@mui/material/Typography");module.exports=({label:o,fieldName:d,placeholder:n,validation:s,onChange:u,multiline:m,minRows:h,maxRows:c,layout:v="horizontal",variant:x="standard",disabled:p=!1,required:g=!1,showHelperTextWhenValid:j=!1})=>{const f=()=>e.jsx(r.Field,{name:d,validate:s,children:({field:r,form:a})=>{const{errors:l,touched:s,isSubmitting:f}=a,q=l[r.name],y=!!q&&s[r.name],b=t({fieldError:q,showError:y,touched:!!s[r.name],value:r.value});return e.jsx(i,{label:"standard"===x?void 0:o,variant:x,value:r.value,"data-testid":`text-field-${d}`,autoComplete:"off",fullWidth:!0,multiline:!0,minRows:h??(m?3:void 0),maxRows:c??(m?10:void 0),style:{paddingRight:"horizontal"===v?16:0},placeholder:n||void 0,disabled:f||p,required:g,error:y,helperText:y||j?b:void 0,FormHelperTextProps:{children:" ",style:{textAlign:"right"}},inputProps:{style:{paddingTop:0,height:"1.1876em"}},onChange:e=>{a.setFieldValue(r.name,e.target.value),u&&u(e)}})}});return"vertical"===v?e.jsxs(e.Fragment,{children:["standard"===x&&e.jsx(l,{variant:"subtitle1",component:"h3",color:"textPrimary",children:o}),f()]}):e.jsx(a,{label:o,children:f()})};
 //# sourceMappingURL=GenericTextField.cjs.js.map

package/dist/components/ui/Form/GenericTextField.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"GenericTextField.cjs.js","sources":["../../../../src/components/ui/Form/GenericTextField.tsx"],"sourcesContent":["import { ChangeEvent } from 'react';\n\nimport { type FieldProps, Field } from 'formik';\nimport TextField, { TextFieldProps } from '@mui/material/TextField';\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\nimport FormItemLayout from './FormItemLayout';\nimport Typography from '@mui/material/Typography';\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};\n\nconst GenericTextField = ({\n    label,\n    fieldName,\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}: Props) => {\n    const renderField = () => {\n        return (\n            <Field name={fieldName} validate={validation}>\n                {({ field, form }: FieldProps) => {\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                        fieldError,\n                        showError,\n                        touched: !!touched[field.name],\n                        value: field.value,\n                    });\n\n                    return (\n                        <TextField\n                            label={variant === 'standard' ? undefined : label}\n                            variant={variant}\n                            value={field.value}\n                            data-testid={`text-field-${fieldName}`}\n                            autoComplete=\"off\"\n                            fullWidth\n                            multiline\n                            minRows={minRows ?? (multiline ? 3 : undefined)}\n                            maxRows={maxRows ?? (multiline ? 10 : undefined)}\n                            style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n                            placeholder={placeholder ? placeholder : undefined}\n                            disabled={isSubmitting || disabled}\n                            required={required}\n                            error={showError}\n                            helperText={helperText}\n                            FormHelperTextProps={{\n                                children: ' ', // reserves line height for error message\n                                style: { textAlign: 'right' },\n                            }}\n                            inputProps={{\n                                style: {\n                                    paddingTop: 0,\n                                    height: '1.1876em',\n                                },\n                            }}\n                            onChange={(e: ChangeEvent<HTMLInputElement>) => {\n                                // eslint-disable-next-line @typescript-eslint/no-floating-promises\n                                form.setFieldValue(field.name, e.target.value);\n                                if (onChange) {\n                                    onChange(e);\n                                }\n                            }}\n                        />\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":["label","fieldName","placeholder","validation","onChange","multiline","minRows","maxRows","layout","variant","disabled","required","renderField","_jsx","Field","name","validate","children","field","form","errors","touched","isSubmitting","fieldError","showError","helperText","useRenderValidText","value","jsx","TextField","undefined","autoComplete","fullWidth","style","paddingRight","error","FormHelperTextProps","textAlign","inputProps","paddingTop","height","e","setFieldValue","target","_jsxs","jsxs","_Fragment","Typography","component","color","FormItemLayout"],"mappings":"6PAuByB,EACrBA,QACAC,YACAC,cACAC,aACAC,WACAC,YACAC,UACAC,UACAC,SAAS,aACTC,UAAU,WACVC,YAAW,EACXC,YAAW,MAEX,MAAMC,EAAc,IAEZC,MAACC,EAAAA,OAAMC,KAAMd,EAAWe,SAAUb,EAAUc,SACvC,EAAGC,QAAOC,WACP,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBH,EACpCI,EAAaH,EAAOF,EAAMH,MAC1BS,IAAcD,GAAeF,EAAQH,EAAMH,MAC3CU,EAAaC,EAAmB,CAClCH,aACAC,YACAH,UAAWA,EAAQH,EAAMH,MACzBY,MAAOT,EAAMS,QAGjB,OACId,EAACe,IAAAC,EACG,CAAA7B,MAAmB,aAAZS,OAAyBqB,EAAY9B,EAC5CS,QAASA,EACTkB,MAAOT,EAAMS,MACA,cAAA,cAAc1B,IAC3B8B,aAAa,MACbC,WAAS,EACT3B,WAAS,EACTC,QAASA,IAAYD,EAAY,OAAIyB,GACrCvB,QAASA,IAAYF,EAAY,QAAKyB,GACtCG,MAAO,CAAEC,aAAyB,eAAX1B,EAA0B,GAAK,GACtDN,YAAaA,QAA4B4B,EACzCpB,SAAUY,GAAgBZ,EAC1BC,SAAUA,EACVwB,MAAOX,EACPC,WAAYA,EACZW,oBAAqB,CACjBnB,SAAU,IACVgB,MAAO,CAAEI,UAAW,UAExBC,WAAY,CACRL,MAAO,CACHM,WAAY,EACZC,OAAQ,aAGhBpC,SAAWqC,IAEPtB,EAAKuB,cAAcxB,EAAMH,KAAM0B,EAAEE,OAAOhB,OACpCvB,GACAA,EAASqC,EACZ,GAGX,IAMlB,MAAe,aAAXjC,EAEIoC,EAAAC,KAAAC,WAAA,CAAA7B,SAAA,CACiB,aAAZR,GACGI,EAAAe,IAACmB,EAAU,CAACtC,QAAQ,YAAYuC,UAAU,KAAKC,MAAM,cAChDhC,SAAAjB,IAGRY,OAKNC,EAAAe,IAACsB,EAAc,CAAClD,MAAOA,EAAQiB,SAAAL,KAA+B"}
+{"version":3,"file":"GenericTextField.cjs.js","sources":["../../../../src/components/ui/Form/GenericTextField.tsx"],"sourcesContent":["import { ChangeEvent } from 'react';\n\nimport { type FieldProps, Field } from 'formik';\nimport TextField, { TextFieldProps } from '@mui/material/TextField';\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\nimport FormItemLayout from './FormItemLayout';\nimport Typography from '@mui/material/Typography';\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};\n\nconst GenericTextField = ({\n    label,\n    fieldName,\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}: Props) => {\n    const renderField = () => {\n        return (\n            <Field name={fieldName} validate={validation}>\n                {({ field, form }: FieldProps) => {\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                        fieldError,\n                        showError,\n                        touched: !!touched[field.name],\n                        value: field.value,\n                    });\n\n                    return (\n                        <TextField\n                            label={variant === 'standard' ? undefined : label}\n                            variant={variant}\n                            value={field.value}\n                            data-testid={`text-field-${fieldName}`}\n                            autoComplete=\"off\"\n                            fullWidth\n                            multiline\n                            minRows={minRows ?? (multiline ? 3 : undefined)}\n                            maxRows={maxRows ?? (multiline ? 10 : undefined)}\n                            style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n                            placeholder={placeholder ? placeholder : undefined}\n                            disabled={isSubmitting || disabled}\n                            required={required}\n                            error={showError}\n                            helperText={showError ? helperText : showHelperTextWhenValid ? helperText : undefined}\n                            FormHelperTextProps={{\n                                children: ' ', // reserves line height for error message\n                                style: { textAlign: 'right' },\n                            }}\n                            inputProps={{\n                                style: {\n                                    paddingTop: 0,\n                                    height: '1.1876em',\n                                },\n                            }}\n                            onChange={(e: ChangeEvent<HTMLInputElement>) => {\n                                // eslint-disable-next-line @typescript-eslint/no-floating-promises\n                                form.setFieldValue(field.name, e.target.value);\n                                if (onChange) {\n                                    onChange(e);\n                                }\n                            }}\n                        />\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":["label","fieldName","placeholder","validation","onChange","multiline","minRows","maxRows","layout","variant","disabled","required","showHelperTextWhenValid","renderField","_jsx","Field","name","validate","children","field","form","errors","touched","isSubmitting","fieldError","showError","helperText","useRenderValidText","value","jsx","TextField","undefined","autoComplete","fullWidth","style","paddingRight","error","FormHelperTextProps","textAlign","inputProps","paddingTop","height","e","setFieldValue","target","_jsxs","jsxs","_Fragment","Typography","component","color","FormItemLayout"],"mappings":"6PAwByB,EACrBA,QACAC,YACAC,cACAC,aACAC,WACAC,YACAC,UACAC,UACAC,SAAS,aACTC,UAAU,WACVC,YAAW,EACXC,YAAW,EACXC,2BAA0B,MAE1B,MAAMC,EAAc,IAEZC,MAACC,EAAAA,OAAMC,KAAMf,EAAWgB,SAAUd,EAAUe,SACvC,EAAGC,QAAOC,WACP,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBH,EACpCI,EAAaH,EAAOF,EAAMH,MAC1BS,IAAcD,GAAeF,EAAQH,EAAMH,MAC3CU,EAAaC,EAAmB,CAClCH,aACAC,YACAH,UAAWA,EAAQH,EAAMH,MACzBY,MAAOT,EAAMS,QAGjB,OACId,EAAAe,IAACC,EAAS,CACN9B,MAAmB,aAAZS,OAAyBsB,EAAY/B,EAC5CS,QAASA,EACTmB,MAAOT,EAAMS,MAAK,cACL,cAAc3B,IAC3B+B,aAAa,MACbC,WACA,EAAA5B,WACA,EAAAC,QAASA,IAAYD,EAAY,OAAI0B,GACrCxB,QAASA,IAAYF,EAAY,QAAK0B,GACtCG,MAAO,CAAEC,aAAyB,eAAX3B,EAA0B,GAAK,GACtDN,YAAaA,QAA4B6B,EACzCrB,SAAUa,GAAgBb,EAC1BC,SAAUA,EACVyB,MAAOX,EACPC,WAAYD,GAAyBb,EAAbc,OAAoDK,EAC5EM,oBAAqB,CACjBnB,SAAU,IACVgB,MAAO,CAAEI,UAAW,UAExBC,WAAY,CACRL,MAAO,CACHM,WAAY,EACZC,OAAQ,aAGhBrC,SAAWsC,IAEPtB,EAAKuB,cAAcxB,EAAMH,KAAM0B,EAAEE,OAAOhB,OACpCxB,GACAA,EAASsC,EACZ,GAGX,IAMlB,MAAe,aAAXlC,EAEIqC,EAAAC,KAAAC,WAAA,CAAA7B,SAAA,CACiB,aAAZT,GACGK,EAAAe,IAACmB,EAAU,CAACvC,QAAQ,YAAYwC,UAAU,KAAKC,MAAM,cAChDhC,SAAAlB,IAGRa,OAKNC,EAAAe,IAACsB,EAAc,CAACnD,MAAOA,EAAQkB,SAAAL,KAA+B"}

package/dist/components/ui/Form/GenericTextField.d.ts

@@ -15,7 +15,8 @@ type Props = {
     variant?: TextFieldProps['variant'];
     disabled?: boolean;
     required?: boolean;
+    showHelperTextWhenValid?: boolean;
 };
-declare const GenericTextField: ({ label, fieldName, placeholder, validation, onChange, multiline, minRows, maxRows, layout, variant, disabled, required, }: Props) => react_jsx_runtime.JSX.Element;
+declare const GenericTextField: ({ label, fieldName, placeholder, validation, onChange, multiline, minRows, maxRows, layout, variant, disabled, required, showHelperTextWhenValid, }: Props) => react_jsx_runtime.JSX.Element;
 
 export { GenericTextField as default };

package/dist/components/ui/Form/GenericTextField.js

@@ -1,2 +1,2 @@
-import{jsxs as e,Fragment as r,jsx as t}from"react/jsx-runtime";import{Field as i}from"formik";import a from"@mui/material/TextField";import o from"../../custom-hooks/useRenderValidText.js";import l from"./FormItemLayout.js";import d from"@mui/material/Typography";const n=({label:n,fieldName:m,placeholder:s,validation:u,onChange:h,multiline:p,minRows:c,maxRows:f,layout:v="horizontal",variant:g="standard",disabled:x=!1,required:y=!1})=>{const b=()=>t(i,{name:m,validate:u,children:({field:e,form:r})=>{const{errors:i,touched:l,isSubmitting:d}=r,u=i[e.name],b=!!u&&l[e.name],R=o({fieldError:u,showError:b,touched:!!l[e.name],value:e.value});return t(a,{label:"standard"===g?void 0:n,variant:g,value:e.value,"data-testid":`text-field-${m}`,autoComplete:"off",fullWidth:!0,multiline:!0,minRows:c??(p?3:void 0),maxRows:f??(p?10:void 0),style:{paddingRight:"horizontal"===v?16:0},placeholder:s||void 0,disabled:d||x,required:y,error:b,helperText:R,FormHelperTextProps:{children:" ",style:{textAlign:"right"}},inputProps:{style:{paddingTop:0,height:"1.1876em"}},onChange:t=>{r.setFieldValue(e.name,t.target.value),h&&h(t)}})}});return"vertical"===v?e(r,{children:["standard"===g&&t(d,{variant:"subtitle1",component:"h3",color:"textPrimary",children:n}),b()]}):t(l,{label:n,children:b()})};export{n as default};
+import{jsxs as e,Fragment as r,jsx as t}from"react/jsx-runtime";import{Field as i}from"formik";import o from"@mui/material/TextField";import a from"../../custom-hooks/useRenderValidText.js";import l from"./FormItemLayout.js";import d from"@mui/material/Typography";const n=({label:n,fieldName:m,placeholder:s,validation:u,onChange:h,multiline:p,minRows:c,maxRows:f,layout:v="horizontal",variant:x="standard",disabled:g=!1,required:y=!1,showHelperTextWhenValid:b=!1})=>{const T=()=>t(i,{name:m,validate:u,children:({field:e,form:r})=>{const{errors:i,touched:l,isSubmitting:d}=r,u=i[e.name],T=!!u&&l[e.name],w=a({fieldError:u,showError:T,touched:!!l[e.name],value:e.value});return t(o,{label:"standard"===x?void 0:n,variant:x,value:e.value,"data-testid":`text-field-${m}`,autoComplete:"off",fullWidth:!0,multiline:!0,minRows:c??(p?3:void 0),maxRows:f??(p?10:void 0),style:{paddingRight:"horizontal"===v?16:0},placeholder:s||void 0,disabled:d||g,required:y,error:T,helperText:T||b?w:void 0,FormHelperTextProps:{children:" ",style:{textAlign:"right"}},inputProps:{style:{paddingTop:0,height:"1.1876em"}},onChange:t=>{r.setFieldValue(e.name,t.target.value),h&&h(t)}})}});return"vertical"===v?e(r,{children:["standard"===x&&t(d,{variant:"subtitle1",component:"h3",color:"textPrimary",children:n}),T()]}):t(l,{label:n,children:T()})};export{n as default};
 //# sourceMappingURL=GenericTextField.js.map

package/dist/components/ui/Form/GenericTextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"GenericTextField.js","sources":["../../../../src/components/ui/Form/GenericTextField.tsx"],"sourcesContent":["import { ChangeEvent } from 'react';\n\nimport { type FieldProps, Field } from 'formik';\nimport TextField, { TextFieldProps } from '@mui/material/TextField';\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\nimport FormItemLayout from './FormItemLayout';\nimport Typography from '@mui/material/Typography';\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};\n\nconst GenericTextField = ({\n    label,\n    fieldName,\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}: Props) => {\n    const renderField = () => {\n        return (\n            <Field name={fieldName} validate={validation}>\n                {({ field, form }: FieldProps) => {\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                        fieldError,\n                        showError,\n                        touched: !!touched[field.name],\n                        value: field.value,\n                    });\n\n                    return (\n                        <TextField\n                            label={variant === 'standard' ? undefined : label}\n                            variant={variant}\n                            value={field.value}\n                            data-testid={`text-field-${fieldName}`}\n                            autoComplete=\"off\"\n                            fullWidth\n                            multiline\n                            minRows={minRows ?? (multiline ? 3 : undefined)}\n                            maxRows={maxRows ?? (multiline ? 10 : undefined)}\n                            style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n                            placeholder={placeholder ? placeholder : undefined}\n                            disabled={isSubmitting || disabled}\n                            required={required}\n                            error={showError}\n                            helperText={helperText}\n                            FormHelperTextProps={{\n                                children: ' ', // reserves line height for error message\n                                style: { textAlign: 'right' },\n                            }}\n                            inputProps={{\n                                style: {\n                                    paddingTop: 0,\n                                    height: '1.1876em',\n                                },\n                            }}\n                            onChange={(e: ChangeEvent<HTMLInputElement>) => {\n                                // eslint-disable-next-line @typescript-eslint/no-floating-promises\n                                form.setFieldValue(field.name, e.target.value);\n                                if (onChange) {\n                                    onChange(e);\n                                }\n                            }}\n                        />\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":["GenericTextField","label","fieldName","placeholder","validation","onChange","multiline","minRows","maxRows","layout","variant","disabled","required","renderField","_jsx","Field","name","validate","children","field","form","errors","touched","isSubmitting","fieldError","showError","helperText","useRenderValidText","value","TextField","undefined","autoComplete","fullWidth","style","paddingRight","error","FormHelperTextProps","textAlign","inputProps","paddingTop","height","e","setFieldValue","target","_jsxs","_Fragment","Typography","component","color","FormItemLayout"],"mappings":"yQAuBA,MAAMA,EAAmB,EACrBC,QACAC,YACAC,cACAC,aACAC,WACAC,YACAC,UACAC,UACAC,SAAS,aACTC,UAAU,WACVC,YAAW,EACXC,YAAW,MAEX,MAAMC,EAAc,IAEZC,EAACC,GAAMC,KAAMd,EAAWe,SAAUb,EAAUc,SACvC,EAAGC,QAAOC,WACP,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBH,EACpCI,EAAaH,EAAOF,EAAMH,MAC1BS,IAAcD,GAAeF,EAAQH,EAAMH,MAC3CU,EAAaC,EAAmB,CAClCH,aACAC,YACAH,UAAWA,EAAQH,EAAMH,MACzBY,MAAOT,EAAMS,QAGjB,OACId,EAACe,EACG,CAAA5B,MAAmB,aAAZS,OAAyBoB,EAAY7B,EAC5CS,QAASA,EACTkB,MAAOT,EAAMS,MACA,cAAA,cAAc1B,IAC3B6B,aAAa,MACbC,WAAS,EACT1B,WAAS,EACTC,QAASA,IAAYD,EAAY,OAAIwB,GACrCtB,QAASA,IAAYF,EAAY,QAAKwB,GACtCG,MAAO,CAAEC,aAAyB,eAAXzB,EAA0B,GAAK,GACtDN,YAAaA,QAA4B2B,EACzCnB,SAAUY,GAAgBZ,EAC1BC,SAAUA,EACVuB,MAAOV,EACPC,WAAYA,EACZU,oBAAqB,CACjBlB,SAAU,IACVe,MAAO,CAAEI,UAAW,UAExBC,WAAY,CACRL,MAAO,CACHM,WAAY,EACZC,OAAQ,aAGhBnC,SAAWoC,IAEPrB,EAAKsB,cAAcvB,EAAMH,KAAMyB,EAAEE,OAAOf,OACpCvB,GACAA,EAASoC,EACZ,GAGX,IAMlB,MAAe,aAAXhC,EAEImC,EAAAC,EAAA,CAAA3B,SAAA,CACiB,aAAZR,GACGI,EAACgC,EAAU,CAACpC,QAAQ,YAAYqC,UAAU,KAAKC,MAAM,cAChD9B,SAAAjB,IAGRY,OAKNC,EAACmC,EAAc,CAAChD,MAAOA,EAAQiB,SAAAL,KAA+B"}
+{"version":3,"file":"GenericTextField.js","sources":["../../../../src/components/ui/Form/GenericTextField.tsx"],"sourcesContent":["import { ChangeEvent } from 'react';\n\nimport { type FieldProps, Field } from 'formik';\nimport TextField, { TextFieldProps } from '@mui/material/TextField';\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\nimport FormItemLayout from './FormItemLayout';\nimport Typography from '@mui/material/Typography';\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};\n\nconst GenericTextField = ({\n    label,\n    fieldName,\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}: Props) => {\n    const renderField = () => {\n        return (\n            <Field name={fieldName} validate={validation}>\n                {({ field, form }: FieldProps) => {\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                        fieldError,\n                        showError,\n                        touched: !!touched[field.name],\n                        value: field.value,\n                    });\n\n                    return (\n                        <TextField\n                            label={variant === 'standard' ? undefined : label}\n                            variant={variant}\n                            value={field.value}\n                            data-testid={`text-field-${fieldName}`}\n                            autoComplete=\"off\"\n                            fullWidth\n                            multiline\n                            minRows={minRows ?? (multiline ? 3 : undefined)}\n                            maxRows={maxRows ?? (multiline ? 10 : undefined)}\n                            style={{ paddingRight: layout === 'horizontal' ? 16 : 0 }}\n                            placeholder={placeholder ? placeholder : undefined}\n                            disabled={isSubmitting || disabled}\n                            required={required}\n                            error={showError}\n                            helperText={showError ? helperText : showHelperTextWhenValid ? helperText : undefined}\n                            FormHelperTextProps={{\n                                children: ' ', // reserves line height for error message\n                                style: { textAlign: 'right' },\n                            }}\n                            inputProps={{\n                                style: {\n                                    paddingTop: 0,\n                                    height: '1.1876em',\n                                },\n                            }}\n                            onChange={(e: ChangeEvent<HTMLInputElement>) => {\n                                // eslint-disable-next-line @typescript-eslint/no-floating-promises\n                                form.setFieldValue(field.name, e.target.value);\n                                if (onChange) {\n                                    onChange(e);\n                                }\n                            }}\n                        />\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":["GenericTextField","label","fieldName","placeholder","validation","onChange","multiline","minRows","maxRows","layout","variant","disabled","required","showHelperTextWhenValid","renderField","_jsx","Field","name","validate","children","field","form","errors","touched","isSubmitting","fieldError","showError","helperText","useRenderValidText","value","TextField","undefined","autoComplete","fullWidth","style","paddingRight","error","FormHelperTextProps","textAlign","inputProps","paddingTop","height","e","setFieldValue","target","_jsxs","_Fragment","Typography","component","color","FormItemLayout"],"mappings":"yQAwBA,MAAMA,EAAmB,EACrBC,QACAC,YACAC,cACAC,aACAC,WACAC,YACAC,UACAC,UACAC,SAAS,aACTC,UAAU,WACVC,YAAW,EACXC,YAAW,EACXC,2BAA0B,MAE1B,MAAMC,EAAc,IAEZC,EAACC,GAAMC,KAAMf,EAAWgB,SAAUd,EAAUe,SACvC,EAAGC,QAAOC,WACP,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBH,EACpCI,EAAaH,EAAOF,EAAMH,MAC1BS,IAAcD,GAAeF,EAAQH,EAAMH,MAC3CU,EAAaC,EAAmB,CAClCH,aACAC,YACAH,UAAWA,EAAQH,EAAMH,MACzBY,MAAOT,EAAMS,QAGjB,OACId,EAACe,EAAS,CACN7B,MAAmB,aAAZS,OAAyBqB,EAAY9B,EAC5CS,QAASA,EACTmB,MAAOT,EAAMS,MAAK,cACL,cAAc3B,IAC3B8B,aAAa,MACbC,WACA,EAAA3B,WACA,EAAAC,QAASA,IAAYD,EAAY,OAAIyB,GACrCvB,QAASA,IAAYF,EAAY,QAAKyB,GACtCG,MAAO,CAAEC,aAAyB,eAAX1B,EAA0B,GAAK,GACtDN,YAAaA,QAA4B4B,EACzCpB,SAAUa,GAAgBb,EAC1BC,SAAUA,EACVwB,MAAOV,EACPC,WAAYD,GAAyBb,EAAbc,OAAoDI,EAC5EM,oBAAqB,CACjBlB,SAAU,IACVe,MAAO,CAAEI,UAAW,UAExBC,WAAY,CACRL,MAAO,CACHM,WAAY,EACZC,OAAQ,aAGhBpC,SAAWqC,IAEPrB,EAAKsB,cAAcvB,EAAMH,KAAMyB,EAAEE,OAAOf,OACpCxB,GACAA,EAASqC,EACZ,GAGX,IAMlB,MAAe,aAAXjC,EAEIoC,EAAAC,EAAA,CAAA3B,SAAA,CACiB,aAAZT,GACGK,EAACgC,EAAU,CAACrC,QAAQ,YAAYsC,UAAU,KAAKC,MAAM,cAChD9B,SAAAlB,IAGRa,OAKNC,EAACmC,EAAc,CAACjD,MAAOA,EAAQkB,SAAAL,KAA+B"}

package/dist/components/ui/GenericDateTimePickerField/GenericDateTimePickerField.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react/jsx-runtime"),r=require("formik"),a=require("../Form/FormItemLayout.cjs.js"),i=require("@mui/x-date-pickers/DateTimePicker"),t=require("@mui/material/styles"),l=require("@mui/material/Box"),s=require("@mui/material/Typography"),d=require("../../custom-hooks/useRenderValidText.cjs.js");const o=t.styled(i.DateTimePicker)((({theme:e})=>({marginTop:e.spacing(2),width:"100%"})));module.exports=({label:i,fieldName:n,description:u,validation:m,variant:c="standard",layout:h,onChange:x,disabled:p=!1,disablePast:v=!1,disablefuture:j=!1,placeholder:b,showHelperTextWhenValid:g=!1})=>{const y=t.useTheme(),T=()=>e.jsx(r.Field,{name:n,validate:m,children:({field:r,form:a})=>{const{errors:t,touched:m,isSubmitting:h}=a,T=t[r.name],q=!!T&&m[r.name],F=d({fieldError:T,showError:q,touched:!!m[r.name],value:r.value});return e.jsxs(l,{sx:{paddingRight:"16px"},children:[e.jsx(o,{label:"standard"===c?void 0:i,value:r.value,onChange:e=>{a.setFieldValue(r.name,e),x&&x(e)},name:n,slotProps:{textField:{variant:c,placeholder:b,error:q,helperText:q||g?F:void 0,FormHelperTextProps:{children:" ",style:{textAlign:"right"}}}},disabled:h||p,disablePast:v,disableFuture:j}),u&&e.jsx(s,{variant:"caption",sx:{color:y.palette.text.secondary},children:u})]})}});return"vertical"===h?e.jsxs(e.Fragment,{children:["standard"===c&&e.jsx(s,{variant:"subtitle1",component:"h3",color:"textPrimary",children:i}),T()]}):e.jsx(a,{label:i,children:T()})};
+//# sourceMappingURL=GenericDateTimePickerField.cjs.js.map

package/dist/components/ui/GenericDateTimePickerField/GenericDateTimePickerField.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GenericDateTimePickerField.cjs.js","sources":["../../../../src/components/ui/GenericDateTimePickerField/GenericDateTimePickerField.tsx"],"sourcesContent":["import { type FieldProps, Field } from 'formik';\nimport FormItemLayout from '../Form/FormItemLayout';\nimport { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';\nimport { styled, useTheme } from '@mui/material/styles';\nimport { TextFieldVariants } from '@mui/material/TextField';\nimport Box from '@mui/material/Box';\nimport Typography from '@mui/material/Typography';\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\n\nconst StyledDateTimePicker = styled(DateTimePicker)(({ theme }) => ({\n    marginTop: theme.spacing(2),\n    width: '100%',\n}));\n\ntype Props = {\n    label: string;\n    placeholder?: string;\n    fieldName: string;\n    description?: string;\n    validation?: (value: string) => string | undefined;\n    layout?: 'horizontal' | 'vertical';\n    variant?: TextFieldVariants;\n    disabled?: boolean;\n    disablePast?: boolean;\n    disablefuture?: boolean;\n    onChange?: (dateTime: moment.Moment) => void;\n    showHelperTextWhenValid?: boolean;\n};\nconst GenericDatePickerField = ({\n    label,\n    fieldName,\n    description,\n    validation,\n    variant = 'standard',\n    layout,\n    onChange,\n    disabled = false,\n    disablePast = false,\n    disablefuture = false,\n    placeholder = undefined,\n    showHelperTextWhenValid = false,\n}: Props) => {\n    const theme = useTheme();\n\n    const renderField = () => {\n        return (\n            <Field name={fieldName} validate={validation}>\n                {({ field, form }: FieldProps) => {\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                        fieldError,\n                        showError,\n                        touched: !!touched[field.name],\n                        value: field.value,\n                    });\n\n                    return (\n                        <Box sx={{ paddingRight: '16px' }}>\n                            <StyledDateTimePicker\n                                label={variant === 'standard' ? undefined : label}\n                                value={field.value}\n                                onChange={(value) => {\n                                    // eslint-disable-next-line @typescript-eslint/no-floating-promises\n                                    form.setFieldValue(field.name, value);\n                                    if (onChange) {\n                                        onChange(value);\n                                    }\n                                }}\n                                name={fieldName}\n                                slotProps={{\n                                    textField: {\n                                        variant,\n                                        placeholder,\n                                        error: showError,\n                                        helperText: showError ? helperText : showHelperTextWhenValid ? helperText : undefined,\n                                        FormHelperTextProps: {\n                                            children: ' ', // reserves line height for error message\n                                            style: { textAlign: 'right' },\n                                        },\n                                    },\n                                }}\n                                disabled={isSubmitting || disabled}\n                                disablePast={disablePast}\n                                disableFuture={disablefuture}\n                            />\n                            {description && (\n                                <Typography variant=\"caption\" sx={{ color: theme.palette.text.secondary }}>\n                                    {description}\n                                </Typography>\n                            )}\n                        </Box>\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 GenericDatePickerField;\n"],"names":["StyledDateTimePicker","styled","DateTimePicker","theme","marginTop","spacing","width","label","fieldName","description","validation","variant","layout","onChange","disabled","disablePast","disablefuture","placeholder","showHelperTextWhenValid","useTheme","renderField","_jsx","Field","name","validate","children","field","form","errors","touched","isSubmitting","fieldError","showError","helperText","useRenderValidText","value","_jsxs","jsxs","Box","sx","paddingRight","undefined","setFieldValue","slotProps","textField","error","FormHelperTextProps","style","textAlign","disableFuture","jsx","Typography","color","palette","text","secondary","_Fragment","component","FormItemLayout"],"mappings":"gUASA,MAAMA,EAAuBC,EAAAA,OAAOC,EAAAA,eAAPD,EAAuB,EAAGE,YAAa,CAChEC,UAAWD,EAAME,QAAQ,GACzBC,MAAO,0BAiBoB,EAC3BC,QACAC,YACAC,cACAC,aACAC,UAAU,WACVC,SACAC,WACAC,YAAW,EACXC,eAAc,EACdC,iBAAgB,EAChBC,cACAC,2BAA0B,MAE1B,MAAMf,EAAQgB,EAAAA,WAERC,EAAc,IAEZC,MAACC,EAAAA,OAAMC,KAAMf,EAAWgB,SAAUd,EAAUe,SACvC,EAAGC,QAAOC,WACP,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBH,EACpCI,EAAaH,EAAOF,EAAMH,MAC1BS,IAAcD,GAAeF,EAAQH,EAAMH,MAC3CU,EAAaC,EAAmB,CAClCH,aACAC,YACAH,UAAWA,EAAQH,EAAMH,MACzBY,MAAOT,EAAMS,QAGjB,OACIC,EAACC,KAAAC,GAAIC,GAAI,CAAEC,aAAc,kBACrBnB,EAAAA,IAACrB,GACGO,MAAmB,aAAZI,OAAyB8B,EAAYlC,EAC5C4B,MAAOT,EAAMS,MACbtB,SAAWsB,IAEPR,EAAKe,cAAchB,EAAMH,KAAMY,GAC3BtB,GACAA,EAASsB,EACZ,EAELZ,KAAMf,EACNmC,UAAW,CACPC,UAAW,CACPjC,UACAM,cACA4B,MAAOb,EACPC,WAAYD,GAAyBd,EAAbe,OAAoDQ,EAC5EK,oBAAqB,CACjBrB,SAAU,IACVsB,MAAO,CAAEC,UAAW,YAIhClC,SAAUgB,GAAgBhB,EAC1BC,YAAaA,EACbkC,cAAejC,IAElBP,GACGY,EAAA6B,IAACC,EAAW,CAAAxC,QAAQ,UAAU4B,GAAI,CAAEa,MAAOjD,EAAMkD,QAAQC,KAAKC,WACzD9B,SAAAhB,MAIf,IAMlB,MAAe,aAAXG,EAEIwB,EAAAC,KAAAmB,WAAA,CAAA/B,SAAA,CACiB,aAAZd,GACGU,EAAA6B,IAACC,EAAU,CAACxC,QAAQ,YAAY8C,UAAU,KAAKL,MAAM,cAChD3B,SAAAlB,IAGRa,OAKNC,EAAA6B,IAACQ,EAAc,CAACnD,MAAOA,EAAQkB,SAAAL,KAA+B"}

package/dist/components/ui/GenericDateTimePickerField/GenericDateTimePickerField.d.ts

@@ -0,0 +1,20 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { TextFieldVariants } from '@mui/material/TextField';
+
+type Props = {
+    label: string;
+    placeholder?: string;
+    fieldName: string;
+    description?: string;
+    validation?: (value: string) => string | undefined;
+    layout?: 'horizontal' | 'vertical';
+    variant?: TextFieldVariants;
+    disabled?: boolean;
+    disablePast?: boolean;
+    disablefuture?: boolean;
+    onChange?: (dateTime: moment.Moment) => void;
+    showHelperTextWhenValid?: boolean;
+};
+declare const GenericDatePickerField: ({ label, fieldName, description, validation, variant, layout, onChange, disabled, disablePast, disablefuture, placeholder, showHelperTextWhenValid, }: Props) => react_jsx_runtime.JSX.Element;
+
+export { GenericDatePickerField as default };

package/dist/components/ui/GenericDateTimePickerField/GenericDateTimePickerField.js

@@ -0,0 +1,2 @@
+import{jsxs as e,Fragment as r,jsx as t}from"react/jsx-runtime";import{Field as a}from"formik";import i from"../Form/FormItemLayout.js";import{DateTimePicker as o}from"@mui/x-date-pickers/DateTimePicker";import{styled as l,useTheme as d}from"@mui/material/styles";import m from"@mui/material/Box";import n from"@mui/material/Typography";import s from"../../custom-hooks/useRenderValidText.js";const p=l(o)((({theme:e})=>({marginTop:e.spacing(2),width:"100%"}))),c=({label:o,fieldName:l,description:c,validation:u,variant:h="standard",layout:f,onChange:x,disabled:v=!1,disablePast:b=!1,disablefuture:g=!1,placeholder:y,showHelperTextWhenValid:T=!1})=>{const F=d(),P=()=>t(a,{name:l,validate:u,children:({field:r,form:a})=>{const{errors:i,touched:d,isSubmitting:u}=a,f=i[r.name],P=!!f&&d[r.name],k=s({fieldError:f,showError:P,touched:!!d[r.name],value:r.value});return e(m,{sx:{paddingRight:"16px"},children:[t(p,{label:"standard"===h?void 0:o,value:r.value,onChange:e=>{a.setFieldValue(r.name,e),x&&x(e)},name:l,slotProps:{textField:{variant:h,placeholder:y,error:P,helperText:P||T?k:void 0,FormHelperTextProps:{children:" ",style:{textAlign:"right"}}}},disabled:u||v,disablePast:b,disableFuture:g}),c&&t(n,{variant:"caption",sx:{color:F.palette.text.secondary},children:c})]})}});return"vertical"===f?e(r,{children:["standard"===h&&t(n,{variant:"subtitle1",component:"h3",color:"textPrimary",children:o}),P()]}):t(i,{label:o,children:P()})};export{c as default};
+//# sourceMappingURL=GenericDateTimePickerField.js.map

package/dist/components/ui/GenericDateTimePickerField/GenericDateTimePickerField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GenericDateTimePickerField.js","sources":["../../../../src/components/ui/GenericDateTimePickerField/GenericDateTimePickerField.tsx"],"sourcesContent":["import { type FieldProps, Field } from 'formik';\nimport FormItemLayout from '../Form/FormItemLayout';\nimport { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';\nimport { styled, useTheme } from '@mui/material/styles';\nimport { TextFieldVariants } from '@mui/material/TextField';\nimport Box from '@mui/material/Box';\nimport Typography from '@mui/material/Typography';\nimport useRenderValidText from '../../custom-hooks/useRenderValidText';\n\nconst StyledDateTimePicker = styled(DateTimePicker)(({ theme }) => ({\n    marginTop: theme.spacing(2),\n    width: '100%',\n}));\n\ntype Props = {\n    label: string;\n    placeholder?: string;\n    fieldName: string;\n    description?: string;\n    validation?: (value: string) => string | undefined;\n    layout?: 'horizontal' | 'vertical';\n    variant?: TextFieldVariants;\n    disabled?: boolean;\n    disablePast?: boolean;\n    disablefuture?: boolean;\n    onChange?: (dateTime: moment.Moment) => void;\n    showHelperTextWhenValid?: boolean;\n};\nconst GenericDatePickerField = ({\n    label,\n    fieldName,\n    description,\n    validation,\n    variant = 'standard',\n    layout,\n    onChange,\n    disabled = false,\n    disablePast = false,\n    disablefuture = false,\n    placeholder = undefined,\n    showHelperTextWhenValid = false,\n}: Props) => {\n    const theme = useTheme();\n\n    const renderField = () => {\n        return (\n            <Field name={fieldName} validate={validation}>\n                {({ field, form }: FieldProps) => {\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                        fieldError,\n                        showError,\n                        touched: !!touched[field.name],\n                        value: field.value,\n                    });\n\n                    return (\n                        <Box sx={{ paddingRight: '16px' }}>\n                            <StyledDateTimePicker\n                                label={variant === 'standard' ? undefined : label}\n                                value={field.value}\n                                onChange={(value) => {\n                                    // eslint-disable-next-line @typescript-eslint/no-floating-promises\n                                    form.setFieldValue(field.name, value);\n                                    if (onChange) {\n                                        onChange(value);\n                                    }\n                                }}\n                                name={fieldName}\n                                slotProps={{\n                                    textField: {\n                                        variant,\n                                        placeholder,\n                                        error: showError,\n                                        helperText: showError ? helperText : showHelperTextWhenValid ? helperText : undefined,\n                                        FormHelperTextProps: {\n                                            children: ' ', // reserves line height for error message\n                                            style: { textAlign: 'right' },\n                                        },\n                                    },\n                                }}\n                                disabled={isSubmitting || disabled}\n                                disablePast={disablePast}\n                                disableFuture={disablefuture}\n                            />\n                            {description && (\n                                <Typography variant=\"caption\" sx={{ color: theme.palette.text.secondary }}>\n                                    {description}\n                                </Typography>\n                            )}\n                        </Box>\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 GenericDatePickerField;\n"],"names":["StyledDateTimePicker","styled","DateTimePicker","theme","marginTop","spacing","width","GenericDatePickerField","label","fieldName","description","validation","variant","layout","onChange","disabled","disablePast","disablefuture","placeholder","showHelperTextWhenValid","useTheme","renderField","_jsx","Field","name","validate","children","field","form","errors","touched","isSubmitting","fieldError","showError","helperText","useRenderValidText","value","_jsxs","Box","sx","paddingRight","undefined","setFieldValue","slotProps","textField","error","FormHelperTextProps","style","textAlign","disableFuture","Typography","color","palette","text","secondary","_Fragment","component","FormItemLayout"],"mappings":"yYASA,MAAMA,EAAuBC,EAAOC,EAAPD,EAAuB,EAAGE,YAAa,CAChEC,UAAWD,EAAME,QAAQ,GACzBC,MAAO,WAiBLC,EAAyB,EAC3BC,QACAC,YACAC,cACAC,aACAC,UAAU,WACVC,SACAC,WACAC,YAAW,EACXC,eAAc,EACdC,iBAAgB,EAChBC,cACAC,2BAA0B,MAE1B,MAAMhB,EAAQiB,IAERC,EAAc,IAEZC,EAACC,GAAMC,KAAMf,EAAWgB,SAAUd,EAAUe,SACvC,EAAGC,QAAOC,WACP,MAAMC,OAAEA,EAAMC,QAAEA,EAAOC,aAAEA,GAAiBH,EACpCI,EAAaH,EAAOF,EAAMH,MAC1BS,IAAcD,GAAeF,EAAQH,EAAMH,MAC3CU,EAAaC,EAAmB,CAClCH,aACAC,YACAH,UAAWA,EAAQH,EAAMH,MACzBY,MAAOT,EAAMS,QAGjB,OACIC,EAACC,GAAIC,GAAI,CAAEC,aAAc,kBACrBlB,EAACtB,GACGQ,MAAmB,aAAZI,OAAyB6B,EAAYjC,EAC5C4B,MAAOT,EAAMS,MACbtB,SAAWsB,IAEPR,EAAKc,cAAcf,EAAMH,KAAMY,GAC3BtB,GACAA,EAASsB,EACZ,EAELZ,KAAMf,EACNkC,UAAW,CACPC,UAAW,CACPhC,UACAM,cACA2B,MAAOZ,EACPC,WAAYD,GAAyBd,EAAbe,OAAoDO,EAC5EK,oBAAqB,CACjBpB,SAAU,IACVqB,MAAO,CAAEC,UAAW,YAIhCjC,SAAUgB,GAAgBhB,EAC1BC,YAAaA,EACbiC,cAAehC,IAElBP,GACGY,EAAC4B,EAAW,CAAAtC,QAAQ,UAAU2B,GAAI,CAAEY,MAAOhD,EAAMiD,QAAQC,KAAKC,WACzD5B,SAAAhB,MAIf,IAMlB,MAAe,aAAXG,EAEIwB,EAAAkB,EAAA,CAAA7B,SAAA,CACiB,aAAZd,GACGU,EAAC4B,EAAU,CAACtC,QAAQ,YAAY4C,UAAU,KAAKL,MAAM,cAChDzB,SAAAlB,IAGRa,OAKNC,EAACmC,EAAc,CAACjD,MAAOA,EAAQkB,SAAAL,KAA+B"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flipdish/portal-library",
-  "version": "1.0.35",
+  "version": "1.0.37",
   "files": [
     "dist"
   ],
@@ -10,7 +10,9 @@
     "@emotion/styled": "11.13.0",
     "@mui/icons-material": "5.16.7",
     "@mui/material": "5.16.7",
+    "@mui/x-date-pickers": "^7.22.2",
     "formik": "^2.4.6",
+    "moment": "^2.30.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-error-boundary": "^4.0.13"