@mantine/core/cjs/components/Container/Container.cjs.map

React components library focused on usability, accessibility and developer experience

{"version":3,"file":"Container.cjs","names":["createVarsResolver","getSize","factory","useProps","useStyles","Box","classes"],"sources":["../../../src/components/Container/Container.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getSize,\n  MantineSize,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport classes from './Container.module.css';\n\nexport type ContainerStylesNames = 'root';\nexport type ContainerCssVariables = {\n  root: '--container-size';\n};\n\nexport interface ContainerProps\n  extends BoxProps, StylesApiProps<ContainerFactory>, ElementProps<'div'> {\n  /** `max-width` of the container, value is not responsive – it is the same for all screen sizes. Numbers are converted to rem. Ignored when `fluid` prop is set. @default 'md' */\n  size?: MantineSize | (string & {}) | number;\n\n  /** If set, the container takes 100% width of its parent and `size` prop is ignored. @default false */\n  fluid?: boolean;\n\n  /** Centering strategy @default 'block' */\n  strategy?: 'block' | 'grid';\n}\n\nexport type ContainerFactory = Factory<{\n  props: ContainerProps;\n  ref: HTMLDivElement;\n  stylesNames: ContainerStylesNames;\n  vars: ContainerCssVariables;\n}>;\n\nconst defaultProps = {\n  strategy: 'block',\n} satisfies Partial<ContainerProps>;\n\nconst varsResolver = createVarsResolver<ContainerFactory>((_, { size, fluid }) => ({\n  root: {\n    '--container-size': fluid ? undefined : getSize(size, 'container-size'),\n  },\n}));\n\nexport const Container = factory<ContainerFactory>((_props) => {\n  const props = useProps('Container', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    fluid,\n    mod,\n    attributes,\n    strategy,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<ContainerFactory>({\n    name: 'Container',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return <Box mod={[{ fluid, strategy }, mod]} {...getStyles('root')} {...others} />;\n});\n\nContainer.classes = classes;\nContainer.varsResolver = varsResolver;\nContainer.displayName = '@mantine/core/Container';\n\nexport namespace Container {\n  export type Props = ContainerProps;\n  export type StylesNames = ContainerStylesNames;\n  export type CssVariables = ContainerCssVariables;\n  export type Factory = ContainerFactory;\n}\n"],"mappings":";;;;;;;;;;;AAuCA,MAAM,eAAe,EACnB,UAAU,QACZ;AAEA,MAAM,eAAeA,6BAAAA,oBAAsC,GAAG,EAAE,MAAM,aAAa,EACjF,MAAM,EACJ,oBAAoB,QAAQ,KAAA,IAAYC,iBAAAA,QAAQ,MAAM,gBAAgB,EACxE,EACF,EAAE;AAEF,MAAa,YAAYC,gBAAAA,SAA2B,WAAW;CAC7D,MAAM,QAAQC,kBAAAA,SAAS,aAAa,cAAc,MAAM;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,KACA,YACA,UACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAA4B;EAC5C,MAAM;EACN,SAAA,yBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,KAAK,CAAC;GAAE;GAAO;EAAS,GAAG,GAAG;EAAG,GAAI,UAAU,MAAM;EAAG,GAAI;CAAS,CAAA;AACnF,CAAC;AAED,UAAU,UAAUC,yBAAAA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}