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

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

{"version":3,"file":"Drawer.cjs","sources":["../../../../src/lib/Drawer/Drawer.tsx"],"sourcesContent":["import type {ReactNode} from 'react';\nimport {useMemo} from 'react';\nimport {useLocalTheme, useRootTheme} from 'css-vars-hook';\nimport {forwardRef} from 'react';\nimport classNames from 'classnames';\n\nimport type {DataAttributes, LibraryProps} from '@/internal/LibraryAPI';\nimport {Portal} from '@/internal/Portal';\nimport {useInternalRef} from '@/internal/hooks/useInternalRef';\nimport {useDismiss} from '@/internal/hooks/useDismiss';\nimport {TransitionSlideLeft, TransitionSlideRight} from '@/internal/Transitions';\n\nimport classes from './Drawer.module.css';\nimport {useDrawerState} from './useDrawerState.tsx';\n\nenum Placements {\n    left = 'left',\n    right = 'right',\n}\n\nexport type Props = DataAttributes &\n    LibraryProps & {\n        children?: ReactNode;\n        /** Choose side to attach Drawer */\n        placement?: keyof typeof Placements;\n        /** Provide unique id for Drawer */\n        id: string;\n    };\n\nexport const Drawer = forwardRef<HTMLDivElement, Props>(\n    ({children, className, placement = Placements.left, id, ...nativeProps}, refProp) => {\n        const ref = useInternalRef(refProp);\n        const {isOpen, closeDrawer} = useDrawerState(id);\n\n        const {getTheme} = useRootTheme();\n        const {LocalRoot} = useLocalTheme();\n\n        const Transition = useMemo(\n            () =>\n                ({\n                    [Placements.left]: TransitionSlideLeft,\n                    [Placements.right]: TransitionSlideRight,\n                })[placement],\n            [placement]\n        );\n\n        useDismiss(closeDrawer, ref, isOpen);\n\n        return (\n            <Portal>\n                <Transition show={isOpen} nodeRef={ref}>\n                    <LocalRoot theme={getTheme()} className={classes.provider}>\n                        <div className={classes.backdrop}>\n                            <div\n                                {...nativeProps}\n                                className={classNames(\n                                    classes.drawer,\n                                    {\n                                        [classes.left]: placement === Placements.left,\n                                        [classes.right]: placement === Placements.right,\n                                    },\n                                    className\n                                )}\n                                ref={ref}>\n                                {children}\n                            </div>\n                        </div>\n                    </LocalRoot>\n                </Transition>\n            </Portal>\n        );\n    }\n);\n\nDrawer.displayName = 'Drawer';\n"],"names":["Drawer","forwardRef","children","className","placement","id","nativeProps","refProp","ref","useInternalRef","isOpen","closeDrawer","useDrawerState","getTheme","useRootTheme","LocalRoot","useLocalTheme","Transition","useMemo","TransitionSlideLeft","TransitionSlideRight","useDismiss","jsx","Portal","classes","classNames"],"mappings":"ghBA6BaA,EAASC,EAAA,WAClB,CAAC,CAAC,SAAAC,EAAU,UAAAC,EAAW,UAAAC,EAAY,OAAiB,GAAAC,EAAI,GAAGC,CAAW,EAAGC,IAAY,CAC3E,MAAAC,EAAMC,iBAAeF,CAAO,EAC5B,CAAC,OAAAG,EAAQ,YAAAC,GAAeC,EAAAA,eAAeP,CAAE,EAEzC,CAAC,SAAAQ,CAAQ,EAAIC,eAAa,EAC1B,CAAC,UAAAC,CAAS,EAAIC,gBAAc,EAE5BC,EAAaC,EAAA,QACf,KACK,CACI,KAAkBC,EAAA,UAClB,MAAmBC,EAAAA,aACrBhB,CAAS,EAChB,CAACA,CAAS,CACd,EAEWiB,OAAAA,aAAAV,EAAaH,EAAKE,CAAM,EAG/BY,EAAA,IAACC,UACG,SAACD,EAAA,IAAAL,EAAA,CAAW,KAAMP,EAAQ,QAASF,EAC/B,SAACc,EAAA,IAAAP,EAAA,CAAU,MAAOF,EAAS,EAAG,UAAWW,EAAQ,QAAA,SAC7C,eAAC,MAAI,CAAA,UAAWA,UAAQ,SACpB,SAAAF,EAAA,IAAC,MAAA,CACI,GAAGhB,EACJ,UAAWmB,EACPD,EAAAA,QAAQ,OACR,CACI,CAACA,EAAA,QAAQ,IAAI,EAAGpB,IAAc,OAC9B,CAACoB,EAAA,QAAQ,KAAK,EAAGpB,IAAc,OACnC,EACAD,CACJ,EACA,IAAAK,EACC,SAAAN,CAAA,CAAA,EAET,CACJ,CAAA,CACJ,CAAA,EACJ,CAAA,CAGZ,EAEAF,EAAO,YAAc"}