@chakra-ui/layout/dist/chunk-KRPLQIP4.mjs.map

Chakra UI layout components that give you massive speed

{"version":3,"sources":["../src/flex.tsx"],"sourcesContent":["import {\n  chakra,\n  forwardRef,\n  SystemProps,\n  HTMLChakraProps,\n} from \"@chakra-ui/system\"\n\nexport interface FlexOptions {\n  /**\n   * Shorthand for `alignItems` style prop\n   * @type SystemProps[\"alignItems\"]\n   */\n  align?: SystemProps[\"alignItems\"]\n\n  /**\n   * Shorthand for `justifyContent` style prop\n   * @type SystemProps[\"justifyContent\"]\n   */\n  justify?: SystemProps[\"justifyContent\"]\n\n  /**\n   * Shorthand for `flexWrap` style prop\n   * @type SystemProps[\"flexWrap\"]\n   */\n  wrap?: SystemProps[\"flexWrap\"]\n\n  /**\n   * Shorthand for `flexDirection` style prop\n   * @type SystemProps[\"flexDirection\"]\n   * @default \"row\"\n   */\n  direction?: SystemProps[\"flexDirection\"]\n\n  /**\n   * Shorthand for `flexBasis` style prop\n   * @type SystemProps[\"flexBasis\"]\n   */\n  basis?: SystemProps[\"flexBasis\"]\n\n  /**\n   * Shorthand for `flexGrow` style prop\n   * @type SystemProps[\"flexGrow\"]\n   */\n  grow?: SystemProps[\"flexGrow\"]\n\n  /**\n   * Shorthand for `flexShrink` style prop\n   * @type SystemProps[\"flexShrink\"]\n   */\n  shrink?: SystemProps[\"flexShrink\"]\n}\n\nexport interface FlexProps extends HTMLChakraProps<\"div\">, FlexOptions {}\n\n/**\n * React component used to create flexbox layouts.\n *\n * It renders a `div` with `display: flex` and\n * comes with helpful style shorthand.\n *\n * @see Docs https://chakra-ui.com/flex\n */\nexport const Flex = forwardRef<FlexProps, \"div\">(function Flex(props, ref) {\n  const { direction, align, justify, wrap, basis, grow, shrink, ...rest } =\n    props\n\n  const styles = {\n    display: \"flex\",\n    flexDirection: direction,\n    alignItems: align,\n    justifyContent: justify,\n    flexWrap: wrap,\n    flexBasis: basis,\n    flexGrow: grow,\n    flexShrink: shrink,\n  }\n\n  return <chakra.div ref={ref} __css={styles} {...rest} />\n})\n\nFlex.displayName = \"Flex\"\n"],"mappings":";;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,OAGK;AAwEE;AAfF,IAAM,OAAO,WAA6B,SAASA,MAAK,OAAO,KAAK;AACzE,QAAM,EAAE,WAAW,OAAO,SAAS,MAAM,OAAO,MAAM,QAAQ,GAAG,KAAK,IACpE;AAEF,QAAM,SAAS;AAAA,IACb,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,UAAU;AAAA,IACV,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,EACd;AAEA,SAAO,oBAAC,OAAO,KAAP,EAAW,KAAU,OAAO,QAAS,GAAG,MAAM;AACxD,CAAC;AAED,KAAK,cAAc;","names":["Flex"]}