{"version":3,"sources":["../src/modal-header.tsx"],"sourcesContent":["import { cx } from \"@chakra-ui/shared-utils\"\nimport {\n  HTMLChakraProps,\n  SystemStyleObject,\n  chakra,\n  forwardRef,\n} from \"@chakra-ui/system\"\nimport { useEffect } from \"react\"\n\nimport { useModalContext, useModalStyles } from \"./modal\"\n\nexport interface ModalHeaderProps extends HTMLChakraProps<\"header\"> {}\n\n/**\n * ModalHeader\n *\n * React component that houses the title of the modal.\n *\n * @see Docs https://chakra-ui.com/modal\n */\nexport const ModalHeader = forwardRef<ModalHeaderProps, \"header\">(\n  (props, ref) => {\n    const { className, ...rest } = props\n\n    const { headerId, setHeaderMounted } = useModalContext()\n\n    /**\n     * Notify us if this component was rendered or used,\n     * so we can append `aria-labelledby` automatically\n     */\n    useEffect(() => {\n      setHeaderMounted(true)\n      return () => setHeaderMounted(false)\n    }, [setHeaderMounted])\n\n    const _className = cx(\"chakra-modal__header\", className)\n\n    const styles = useModalStyles()\n    const headerStyles: SystemStyleObject = {\n      flex: 0,\n      ...styles.header,\n    }\n\n    return (\n      <chakra.header\n        ref={ref}\n        className={_className}\n        id={headerId}\n        {...rest}\n        __css={headerStyles}\n      />\n    )\n  },\n)\n\nModalHeader.displayName = \"ModalHeader\"\n"],"mappings":";;;;;;;AAAA,SAAS,UAAU;AACnB;AAAA,EAGE;AAAA,EACA;AAAA,OACK;AACP,SAAS,iBAAiB;AAqCpB;AAxBC,IAAM,cAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,EAAE,WAAW,GAAG,KAAK,IAAI;AAE/B,UAAM,EAAE,UAAU,iBAAiB,IAAI,gBAAgB;AAMvD,cAAU,MAAM;AACd,uBAAiB,IAAI;AACrB,aAAO,MAAM,iBAAiB,KAAK;AAAA,IACrC,GAAG,CAAC,gBAAgB,CAAC;AAErB,UAAM,aAAa,GAAG,wBAAwB,SAAS;AAEvD,UAAM,SAAS,eAAe;AAC9B,UAAM,eAAkC;AAAA,MACtC,MAAM;AAAA,MACN,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACC;AAAA,QACA,WAAW;AAAA,QACX,IAAI;AAAA,QACH,GAAG;AAAA,QACJ,OAAO;AAAA;AAAA,IACT;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;","names":[]}