see Docs see Source see WAI-ARIA import { defineComponent , PropType , withDirectives , VNode , cloneVNode , } from "vue" ; import { BodyScrollLockDirective } from "./body-scoll-lock.directive" ; export const CScrollLock = defineComponent ( { name : "CScrollLock" , props : { enabled : { type : Boolean as PropType < boolean > , default : false , } , } , setup ( props , { slots , attrs } ) { return ( ) => { const [ firstChild ] = slots . default ?. ( { } ) as VNode [ ] ; if ( ! firstChild ) { console . warn ( `[chakra-ui:focus-lock]: Focus lock component expects at least and only one child element.` ) ; return ; } const scrollLockVNode = cloneVNode ( firstChild , { ... attrs , "data-chakra-scroll-lock" : `${ props . enabled }` , } ) ; return withDirectives ( scrollLockVNode , [ [ BodyScrollLockDirective , props . enabled ] , ] ) ; } ; } , } ) ;