@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
1 lines • 3.58 kB
Source Map (JSON)
{"version":3,"file":"ModalBaseContent.cjs","names":["useModalBaseContext","Transition","classes","FocusTrap","Paper"],"sources":["../../../src/components/ModalBase/ModalBaseContent.tsx"],"sourcesContent":["import cx from 'clsx';\nimport { BoxProps, ElementProps, MantineRadius, MantineShadow } from '../../core';\nimport { FocusTrap } from '../FocusTrap';\nimport { Paper } from '../Paper';\nimport { Transition, TransitionOverride } from '../Transition';\nimport { useModalBaseContext } from './ModalBase.context';\nimport classes from './ModalBase.module.css';\n\nexport interface ModalBaseContentProps extends BoxProps, ElementProps<'div'> {\n /** Props passed down to the `Transition` component */\n transitionProps?: TransitionOverride;\n\n /** Key of `theme.shadows` or any valid CSS value to set `box-shadow` */\n shadow?: MantineShadow;\n\n /** Key of `theme.radius` or any valid CSS value to set border-radius, numbers are converted to rem @default theme.defaultRadius */\n radius?: MantineRadius;\n}\n\ninterface _ModalBaseContentProps extends ModalBaseContentProps {\n innerProps: React.ComponentProps<'div'>;\n}\n\nexport function ModalBaseContent({\n transitionProps,\n className,\n innerProps,\n onKeyDown,\n style,\n ref,\n ...others\n}: _ModalBaseContentProps) {\n const ctx = useModalBaseContext();\n\n return (\n <Transition\n mounted={ctx.opened}\n transition=\"pop\"\n {...ctx.transitionProps}\n onExited={() => {\n ctx.onExitTransitionEnd?.();\n ctx.transitionProps?.onExited?.();\n }}\n onEntered={() => {\n ctx.onEnterTransitionEnd?.();\n ctx.transitionProps?.onEntered?.();\n }}\n {...transitionProps}\n >\n {(transitionStyles) => (\n <div\n {...innerProps}\n className={cx({ [classes.inner]: !ctx.unstyled }, innerProps.className)}\n >\n <FocusTrap active={ctx.opened && ctx.trapFocus} innerRef={ref}>\n <Paper\n {...others}\n component=\"section\"\n role=\"dialog\"\n tabIndex={-1}\n aria-modal\n aria-describedby={ctx.bodyMounted ? ctx.getBodyId() : undefined}\n aria-labelledby={ctx.titleMounted ? ctx.getTitleId() : undefined}\n style={[style, transitionStyles]}\n className={cx({ [classes.content]: !ctx.unstyled }, className)}\n unstyled={ctx.unstyled}\n >\n {others.children}\n </Paper>\n </FocusTrap>\n </div>\n )}\n </Transition>\n );\n}\n\nModalBaseContent.displayName = '@mantine/core/ModalBaseContent';\n"],"mappings":";;;;;;;;;;;AAuBA,SAAgB,iBAAiB,EAC/B,iBACA,WACA,YACA,WACA,OACA,KACA,GAAG,UACsB;CACzB,MAAM,MAAMA,0BAAAA,oBAAoB;CAEhC,OACE,iBAAA,GAAA,kBAAA,KAACC,mBAAAA,YAAD;EACE,SAAS,IAAI;EACb,YAAW;EACX,GAAI,IAAI;EACR,gBAAgB;GACd,IAAI,sBAAsB;GAC1B,IAAI,iBAAiB,WAAW;EAClC;EACA,iBAAiB;GACf,IAAI,uBAAuB;GAC3B,IAAI,iBAAiB,YAAY;EACnC;EACA,GAAI;aAEF,qBACA,iBAAA,GAAA,kBAAA,KAAC,OAAD;GACE,GAAI;GACJ,YAAA,GAAA,KAAA,SAAc,GAAGC,yBAAAA,QAAQ,QAAQ,CAAC,IAAI,SAAS,GAAG,WAAW,SAAS;aAEtE,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD;IAAW,QAAQ,IAAI,UAAU,IAAI;IAAW,UAAU;cACxD,iBAAA,GAAA,kBAAA,KAACC,cAAAA,OAAD;KACE,GAAI;KACJ,WAAU;KACV,MAAK;KACL,UAAU;KACV,cAAA;KACA,oBAAkB,IAAI,cAAc,IAAI,UAAU,IAAI,KAAA;KACtD,mBAAiB,IAAI,eAAe,IAAI,WAAW,IAAI,KAAA;KACvD,OAAO,CAAC,OAAO,gBAAgB;KAC/B,YAAA,GAAA,KAAA,SAAc,GAAGF,yBAAAA,QAAQ,UAAU,CAAC,IAAI,SAAS,GAAG,SAAS;KAC7D,UAAU,IAAI;eAEb,OAAO;IACH,CAAA;GACE,CAAA;EACR,CAAA;CAEG,CAAA;AAEhB;AAEA,iBAAiB,cAAc"}