{"version":3,"file":"Input-BhrDRtKU.js","sources":["../../Client/components/Modal.tsx","../../Client/components/FormErrorText.tsx","../../Client/components/Input.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport MicroModal from '../shared/Modal';\nimport { R } from '@/Resources.resx';\nimport classNames from 'classnames';\n\nconst containers: { [id: string]: HTMLElement } = {};\nlet _modalContainer: HTMLElement | null;\nfunction getModalContainer(id: string) {\n    if (_modalContainer == null) {\n        _modalContainer = document.createElement('div');\n        document.body.appendChild(_modalContainer);\n    }\n\n    let container = containers[id];\n    if (container == null) {\n        container = document.createElement('div');\n        container.id = id;\n        container.className = 'modal';\n        container.ariaHidden = 'true';\n        containers[id] = container;\n        _modalContainer.appendChild(container);\n    }\n\n    return container;\n}\n\ntype Props = {\n    title?: string;\n    hideCloseButton?: boolean;\n    showCloseButtonInRightCorner?: boolean;\n    onClose: () => void;\n    children: React.ReactNode;\n    containerClassName?: string;\n    className?: string;\n};\nexport function Modal({\n    title,\n    hideCloseButton = false,\n    showCloseButtonInRightCorner = false,\n    containerClassName,\n    className,\n    onClose,\n    children,\n}: Props) {\n    const [id, setID] = useState(crypto.randomUUID());\n    const container = getModalContainer(id);\n    useEffect(() => {\n        MicroModal.show(id, () => {\n            onClose();\n            setID(crypto.randomUUID());\n        });\n        return () => {\n            MicroModal.close(id);\n            container.remove();\n        };\n    }, [id]);\n\n    const modal = (\n        <div\n            className={classNames(\n                'modal__overlay fixed bottom-0 left-0 right-0 top-0 z-[1] flex items-start justify-center',\n                className,\n            )}\n            style={{ background: 'rgba(0,0,0,0.6)' }}\n            tabIndex={-1}\n        >\n            <div\n                className={classNames(\n                    'modal__container mx-4 mt-6 w-full max-w-[30em] rounded-xl bg-white p-6 ns:p-10',\n                    containerClassName,\n                )}\n                style={{ maxHeight: '100vh', overflowY: 'auto' }}\n                role=\"dialog\"\n                aria-modal=\"true\"\n                aria-labelledby={id + '-title'}\n            >\n                <header className=\"mb-4 flex flex-row-reverse items-center justify-between\">\n                    {hideCloseButton || (\n                        <button\n                            className={classNames(\n                                'modal__close cursor-pointer border-0 bg-transparent',\n                                {\n                                    'ml-auto': showCloseButtonInRightCorner,\n                                },\n                            )}\n                            aria-label={R.Close}\n                            data-micromodal-close\n                        >\n                            &#10005;\n                        </button>\n                    )}\n                    {title && (\n                        <h4 className=\"m-0 leading-tight\" id={id + '-title'}>\n                            {title}\n                        </h4>\n                    )}\n                </header>\n                {children}\n            </div>\n        </div>\n    );\n\n    return createPortal(modal, container);\n}\n","export type FormErrorTextProps = {\n    message: string;\n};\n\nexport function FormErrorText({ message }: FormErrorTextProps) {\n    return <div className=\"form-error-text\">{message}</div>;\n}\n","import React, {\n    ComponentPropsWithoutRef,\n    ForwardedRef,\n    forwardRef,\n} from 'react';\nimport { UseFormRegister } from 'react-hook-form';\nimport { FormErrorText } from '@/components/FormErrorText';\n\ntype InputProps<T = undefined> = Omit<\n    ComponentPropsWithoutRef<'input'>,\n    'name' | 'id'\n> & {\n    label?: string;\n    error?: string;\n    inputClassName?: string;\n    containerClassName?: string;\n} & (\n        | UseFormRegister<T>\n        | {\n              name: string;\n              onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n          }\n    );\n\n/**\n * Input component. Use register if used together with React-hook-form.  Use as a standalone input with use of onChange (and no register)\n * The generic type T is the type of the form state object in react hook form. A property name of this object is equal to a property name of the form object.\n *\n * @param name - The id of the input to bound op to label. Is also used as the property name in a form object of react-hook-form\n * @param label\n * @param error\n * @param inputClassName\n * @param containerClassName\n * @param rest - Other props passed to the native input.\n * @param ref\n */\nconst InputPlain = <T extends Record<string, any>>(\n    {\n        name,\n        label,\n        error,\n        inputClassName,\n        containerClassName,\n        ...rest\n    }: InputProps<T>,\n    ref: ForwardedRef<HTMLInputElement>,\n) => {\n    const classesInput = `form-control mb-1 ${inputClassName}`;\n    const classesContainer = `flex flex-col ${containerClassName}`;\n\n    return (\n        <div className={`py-2 ${classesContainer}`}>\n            {label && (\n                <label htmlFor={name} className=\"form-label\">\n                    {label}\n                </label>\n            )}\n            <div className=\"form-group\">\n                <input\n                    id={name}\n                    name={name}\n                    className={classesInput}\n                    ref={ref}\n                    {...rest} // Spread standard input attributes\n                />\n                {error && <FormErrorText message={error} />}\n            </div>\n        </div>\n    );\n};\n\nexport const Input = forwardRef(InputPlain) as <T extends Record<string, any>>(\n    props: InputProps<T> & { ref?: ForwardedRef<HTMLInputElement> },\n) => React.ReactNode;\n"],"names":["containers","_modalContainer","getModalContainer","id","container","Modal","title","hideCloseButton","showCloseButtonInRightCorner","containerClassName","className","onClose","children","setID","useState","useEffect","MicroModal","modal","jsx","classNames","jsxs","R","createPortal","FormErrorText","message","InputPlain","name","label","error","inputClassName","rest","ref","classesInput","classesContainer","Input","forwardRef"],"mappings":"kMAMA,MAAMA,EAA4C,CAAC,EACnD,IAAIC,EACJ,SAASC,EAAkBC,EAAY,CAC/BF,GAAmB,OACDA,EAAA,SAAS,cAAc,KAAK,EACrC,SAAA,KAAK,YAAYA,CAAe,GAGzC,IAAAG,EAAYJ,EAAWG,CAAE,EAC7B,OAAIC,GAAa,OACDA,EAAA,SAAS,cAAc,KAAK,EACxCA,EAAU,GAAKD,EACfC,EAAU,UAAY,QACtBA,EAAU,WAAa,OACvBJ,EAAWG,CAAE,EAAIC,EACjBH,EAAgB,YAAYG,CAAS,GAGlCA,CACX,CAWO,SAASC,EAAM,CAClB,MAAAC,EACA,gBAAAC,EAAkB,GAClB,6BAAAC,EAA+B,GAC/B,mBAAAC,EACA,UAAAC,EACA,QAAAC,EACA,SAAAC,CACJ,EAAU,CACN,KAAM,CAACT,EAAIU,CAAK,EAAIC,EAAAA,SAAS,OAAO,YAAY,EAC1CV,EAAYF,EAAkBC,CAAE,EACtCY,EAAAA,UAAU,KACKC,EAAA,KAAKb,EAAI,IAAM,CACdQ,EAAA,EACFE,EAAA,OAAO,YAAY,CAAA,CAC5B,EACM,IAAM,CACTG,EAAW,MAAMb,CAAE,EACnBC,EAAU,OAAO,CACrB,GACD,CAACD,CAAE,CAAC,EAEP,MAAMc,EACFC,EAAA,IAAC,MAAA,CACG,UAAWC,EACP,2FACAT,CACJ,EACA,MAAO,CAAE,WAAY,iBAAkB,EACvC,SAAU,GAEV,SAAAU,EAAA,KAAC,MAAA,CACG,UAAWD,EACP,iFACAV,CACJ,EACA,MAAO,CAAE,UAAW,QAAS,UAAW,MAAO,EAC/C,KAAK,SACL,aAAW,OACX,kBAAiBN,EAAK,SAEtB,SAAA,CAACiB,EAAAA,KAAA,SAAA,CAAO,UAAU,0DACb,SAAA,CACGb,GAAAW,EAAA,IAAC,SAAA,CACG,UAAWC,EACP,sDACA,CACI,UAAWX,CAAA,CAEnB,EACA,aAAYa,EAAE,MACd,wBAAqB,GACxB,SAAA,GAAA,CAED,EAEHf,SACI,KAAG,CAAA,UAAU,oBAAoB,GAAIH,EAAK,SACtC,SACLG,CAAA,CAAA,CAAA,EAER,EACCM,CAAA,CAAA,CAAA,CACL,CACJ,EAGG,OAAAU,EAAA,aAAaL,EAAOb,CAAS,CACxC,CCpGgB,SAAAmB,EAAc,CAAE,QAAAC,GAA+B,CAC3D,OAAQN,EAAAA,IAAA,MAAA,CAAI,UAAU,kBAAmB,SAAQM,EAAA,CACrD,CC8BA,MAAMC,EAAa,CACf,CACI,KAAAC,EACA,MAAAC,EACA,MAAAC,EACA,eAAAC,EACA,mBAAApB,EACA,GAAGqB,CACP,EACAC,IACC,CACK,MAAAC,EAAe,qBAAqBH,CAAc,GAClDI,EAAmB,iBAAiBxB,CAAkB,GAE5D,OACKW,EAAA,KAAA,MAAA,CAAI,UAAW,QAAQa,CAAgB,GACnC,SAAA,CAAAN,SACI,QAAM,CAAA,QAASD,EAAM,UAAU,aAC3B,SACLC,EAAA,EAEJP,EAAAA,KAAC,MAAI,CAAA,UAAU,aACX,SAAA,CAAAF,EAAA,IAAC,QAAA,CACG,GAAIQ,EACJ,KAAAA,EACA,UAAWM,EACX,IAAAD,EACC,GAAGD,CAAA,CACR,EACCF,GAASV,EAAAA,IAACK,EAAc,CAAA,QAASK,CAAO,CAAA,CAAA,CAC7C,CAAA,CAAA,EACJ,CAER,EAEaM,EAAQC,aAAWV,CAAU"}