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

React components library focused on usability, accessibility and developer experience

{"version":3,"file":"Stack.cjs","names":["createVarsResolver","getSpacing","factory","useProps","Box","useStyles","classes"],"sources":["../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getSpacing,\n  MantineSpacing,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '../../core';\nimport classes from './Stack.module.css';\n\nexport type StackStylesNames = 'root';\nexport type StackCssVariables = {\n  root: '--stack-gap' | '--stack-align' | '--stack-justify';\n};\n\nexport interface StackProps extends BoxProps, StylesApiProps<StackFactory>, ElementProps<'div'> {\n  /** Key of `theme.spacing` or any valid CSS value to set `gap` property, numbers are converted to rem @default 'md' */\n  gap?: MantineSpacing;\n\n  /** Controls `align-items` CSS property @default 'stretch' */\n  align?: React.CSSProperties['alignItems'];\n\n  /** Controls `justify-content` CSS property @default 'flex-start' */\n  justify?: React.CSSProperties['justifyContent'];\n}\n\nexport type StackFactory = Factory<{\n  props: StackProps;\n  ref: HTMLDivElement;\n  stylesNames: StackStylesNames;\n  vars: StackCssVariables;\n}>;\n\nconst defaultProps = {\n  gap: 'md',\n  align: 'stretch',\n  justify: 'flex-start',\n} satisfies Partial<StackProps>;\n\nconst varsResolver = createVarsResolver<StackFactory>((_, { gap, align, justify }) => ({\n  root: {\n    '--stack-gap': getSpacing(gap),\n    '--stack-align': align,\n    '--stack-justify': justify,\n  },\n}));\n\nexport const Stack = factory<StackFactory>((_props) => {\n  const props = useProps('Stack', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    align,\n    justify,\n    gap,\n    variant,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<StackFactory>({\n    name: 'Stack',\n    props,\n    classes,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  return <Box {...getStyles('root')} variant={variant} {...others} />;\n});\n\nStack.classes = classes;\nStack.varsResolver = varsResolver;\nStack.displayName = '@mantine/core/Stack';\n"],"mappings":";;;;;;;;;;;AAsCA,MAAM,eAAe;CACnB,KAAK;CACL,OAAO;CACP,SAAS;CACV;AAED,MAAM,eAAeA,6BAAAA,oBAAkC,GAAG,EAAE,KAAK,OAAO,eAAe,EACrF,MAAM;CACJ,eAAeC,iBAAAA,WAAW,IAAI;CAC9B,iBAAiB;CACjB,mBAAmB;CACpB,EACF,EAAE;AAEH,MAAa,QAAQC,gBAAAA,SAAuB,WAAW;CACrD,MAAM,QAAQC,kBAAAA,SAAS,SAAS,cAAc,OAAO;CACrD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,SACA,KACA,SACA,YACA,GAAG,WACD;AAgBJ,QAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAdMC,mBAAAA,UAAwB;GACxC,MAAM;GACN;GACA,SAAA,qBAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAEwB,OAAO;EAAW;EAAS,GAAI;EAAU,CAAA;EACnE;AAEF,MAAM,UAAUC,qBAAAA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}