koval-ui/dist/src/lib/InputGroup/InputGroup.cjs.map

React components collection with minimalistic design. Supports theming, layout, and input validation.

{"version":3,"file":"InputGroup.cjs","sources":["../../../../src/lib/InputGroup/InputGroup.tsx"],"sourcesContent":["import {\n    forwardRef,\n    Children,\n    cloneElement,\n    isValidElement,\n    type ReactElement,\n    type FieldsetHTMLAttributes,\n    useMemo,\n    type ChangeEvent,\n} from 'react';\nimport classNames from 'classnames';\n\nimport type {LibraryProps, DataAttributes} from '@/internal/LibraryAPI';\n\nimport classes from './InputGroup.module.css';\n\ntype ChildProps = {\n    name?: Props['name'];\n    disabled?: Props['disabled'];\n    required?: Props['required'];\n    id?: Props['id'];\n    onChange?: Props['onChange'];\n};\n\nexport type Props = DataAttributes &\n    LibraryProps & {\n        /**\n         * Provide onChange callback for the whole group\n         */\n        onChange?: (event: ChangeEvent<HTMLInputElement>) => void;\n        /**\n         * Set a label text for the group\n         */\n        label?: string;\n        children: ReactElement<ChildProps & unknown>[];\n        /**\n         * Provide a name for each input control in the group\n         * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name\n         */\n        name: string;\n        /**\n         * Disable all inputs in the group\n         * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#disabled\n         */\n        disabled?: FieldsetHTMLAttributes<HTMLFieldSetElement>['disabled'];\n        /**\n         * Make all inputs in the group required\n         * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/required\n         */\n        required?: boolean;\n        /**\n         * Set a text for the hint displayed below the group\n         */\n        hint?: string;\n    };\n\nexport const InputGroup = forwardRef<HTMLFieldSetElement, Props>(\n    (\n        {className, id, label, children, name, disabled, hint, required, onChange, ...nativeProps},\n        ref\n    ) => {\n        const childrenWithProps = useMemo(() => {\n            return Children.map(children, element => {\n                if (isValidElement(element)) {\n                    const nextProps = {name} as ChildProps;\n                    /* Check if own prop is set and child doesn't have the same prop */\n                    if (disabled !== undefined && typeof element.props.disabled !== 'boolean') {\n                        nextProps.disabled = disabled;\n                    }\n                    if (required !== undefined && typeof element.props.required !== 'boolean') {\n                        nextProps.required = required;\n                    }\n                    if (onChange !== undefined) {\n                        nextProps.onChange = onChange;\n                    }\n                    return cloneElement<ChildProps>(element, nextProps);\n                }\n                return element;\n            });\n        }, [children, disabled, name, onChange, required]);\n        return (\n            <fieldset\n                {...nativeProps}\n                className={classNames(classes.wrapper, className)}\n                disabled={disabled}\n                id={id}\n                ref={ref}>\n                <legend className={classNames(classes.legend, {[classes.disabled]: disabled})}>\n                    {label}\n                </legend>\n                <div className={classes.inputs}>{childrenWithProps}</div>\n                {hint && <div className={classes.hint}>{hint}</div>}\n            </fieldset>\n        );\n    }\n);\n\nInputGroup.displayName = 'InputGroup';\n"],"names":["InputGroup","forwardRef","className","id","label","children","name","disabled","hint","required","onChange","nativeProps","ref","childrenWithProps","useMemo","Children","element","isValidElement","nextProps","cloneElement","jsxs","classNames","classes","jsx"],"mappings":"sNAwDaA,EAAaC,EAAAA,WACtB,CACI,CAAC,UAAAC,EAAW,GAAAC,EAAI,MAAAC,EAAO,SAAAC,EAAU,KAAAC,EAAM,SAAAC,EAAU,KAAAC,EAAM,SAAAC,EAAU,SAAAC,EAAU,GAAGC,CAAA,EAC9EC,IACC,CACD,MAAMC,EAAoBC,EAAAA,QAAQ,IACvBC,WAAS,IAAIV,EAAUW,GAAW,CACrC,GAAIC,EAAAA,eAAeD,CAAO,EAAG,CACzB,MAAME,EAAY,CAAC,KAAAZ,CAAA,EAEnB,OAAIC,IAAa,QAAa,OAAOS,EAAQ,MAAM,UAAa,YAC5DE,EAAU,SAAWX,GAErBE,IAAa,QAAa,OAAOO,EAAQ,MAAM,UAAa,YAC5DE,EAAU,SAAWT,GAErBC,IAAa,SACbQ,EAAU,SAAWR,GAElBS,EAAAA,aAAyBH,EAASE,CAAS,CACtD,CACA,OAAOF,CACX,CAAC,EACF,CAACX,EAAUE,EAAUD,EAAMI,EAAUD,CAAQ,CAAC,EACjD,OACIW,EAAAA,KAAC,WAAA,CACI,GAAGT,EACJ,UAAWU,EAAWC,UAAQ,QAASpB,CAAS,EAChD,SAAAK,EACA,GAAAJ,EACA,IAAAS,EACA,SAAA,CAAAW,EAAAA,IAAC,SAAA,CAAO,UAAWF,EAAWC,EAAAA,QAAQ,OAAQ,CAAC,CAACA,EAAAA,QAAQ,QAAQ,EAAGf,CAAA,CAAS,EACvE,SAAAH,CAAA,CACL,EACAmB,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAQ,OAAS,SAAAT,EAAkB,EAClDL,GAAQe,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAQ,KAAO,SAAAd,CAAA,CAAK,CAAA,CAAA,CAAA,CAGzD,CACJ,EAEAR,EAAW,YAAc"}