{"version":3,"sources":["../src/drawer-content.tsx"],"sourcesContent":["import { cx } from \"@chakra-ui/shared-utils\"\nimport {\n  chakra,\n  forwardRef,\n  HTMLChakraProps,\n  SystemStyleObject,\n} from \"@chakra-ui/system\"\nimport { Slide } from \"@chakra-ui/transition\"\nimport type { HTMLMotionProps } from \"framer-motion\"\n\nimport { useDrawerContext } from \"./drawer\"\nimport { useModalContext, useModalStyles } from \"./modal\"\nimport { ModalFocusScope } from \"./modal-focus\"\n\nconst MotionDiv = chakra(Slide)\n\nexport interface DrawerContentProps extends HTMLChakraProps<\"section\"> {\n  /**\n   * The props to forward to the modal's content wrapper\n   */\n  containerProps?: HTMLChakraProps<\"div\">\n  /**\n   * The custom framer-motion transition to use for the modal\n   */\n  motionProps?: HTMLMotionProps<\"section\">\n}\n\n/**\n * ModalContent is used to group modal's content. It has all the\n * necessary `aria-*` properties to indicate that it is a modal\n */\nexport const DrawerContent = forwardRef<DrawerContentProps, \"section\">(\n  (props, ref) => {\n    const {\n      className,\n      children,\n      motionProps,\n      containerProps: rootProps,\n      ...rest\n    } = props\n\n    const { getDialogProps, getDialogContainerProps, isOpen } =\n      useModalContext()\n\n    const dialogProps = getDialogProps(rest, ref) as any\n    const containerProps = getDialogContainerProps(rootProps)\n\n    const _className = cx(\"chakra-modal__content\", className)\n\n    const styles = useModalStyles()\n\n    const dialogStyles: SystemStyleObject = {\n      display: \"flex\",\n      flexDirection: \"column\",\n      position: \"relative\",\n      width: \"100%\",\n      outline: 0,\n      ...styles.dialog,\n    }\n\n    const dialogContainerStyles: SystemStyleObject = {\n      display: \"flex\",\n      width: \"100vw\",\n      height: \"$100vh\",\n      position: \"fixed\",\n      left: 0,\n      top: 0,\n      ...styles.dialogContainer,\n    }\n\n    const { placement } = useDrawerContext()\n\n    return (\n      <ModalFocusScope>\n        <chakra.div\n          {...containerProps}\n          className=\"chakra-modal__content-container\"\n          __css={dialogContainerStyles}\n        >\n          <MotionDiv\n            motionProps={motionProps}\n            direction={placement}\n            in={isOpen}\n            className={_className}\n            {...dialogProps}\n            __css={dialogStyles}\n          >\n            {children}\n          </MotionDiv>\n        </chakra.div>\n      </ModalFocusScope>\n    )\n  },\n)\n\nDrawerContent.displayName = \"DrawerContent\"\n"],"mappings":";;;;;;;;;;;;;AAAA,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,OAGK;AACP,SAAS,aAAa;AAwEZ;AAjEV,IAAM,YAAY,OAAO,KAAK;AAiBvB,IAAM,gBAAgB;AAAA,EAC3B,CAAC,OAAO,QAAQ;AACd,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB;AAAA,MAChB,GAAG;AAAA,IACL,IAAI;AAEJ,UAAM,EAAE,gBAAgB,yBAAyB,OAAO,IACtD,gBAAgB;AAElB,UAAM,cAAc,eAAe,MAAM,GAAG;AAC5C,UAAM,iBAAiB,wBAAwB,SAAS;AAExD,UAAM,aAAa,GAAG,yBAAyB,SAAS;AAExD,UAAM,SAAS,eAAe;AAE9B,UAAM,eAAkC;AAAA,MACtC,SAAS;AAAA,MACT,eAAe;AAAA,MACf,UAAU;AAAA,MACV,OAAO;AAAA,MACP,SAAS;AAAA,MACT,GAAG,OAAO;AAAA,IACZ;AAEA,UAAM,wBAA2C;AAAA,MAC/C,SAAS;AAAA,MACT,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,UAAU;AAAA,MACV,MAAM;AAAA,MACN,KAAK;AAAA,MACL,GAAG,OAAO;AAAA,IACZ;AAEA,UAAM,EAAE,UAAU,IAAI,iBAAiB;AAEvC,WACE,oBAAC,mBACC;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACE,GAAG;AAAA,QACJ,WAAU;AAAA,QACV,OAAO;AAAA,QAEP;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,WAAW;AAAA,YACX,IAAI;AAAA,YACJ,WAAW;AAAA,YACV,GAAG;AAAA,YACJ,OAAO;AAAA,YAEN;AAAA;AAAA,QACH;AAAA;AAAA,IACF,GACF;AAAA,EAEJ;AACF;AAEA,cAAc,cAAc;","names":[]}