{"version":3,"file":"Flex.mjs","sources":["../../../src/components/Flex/Flex.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  ElementProps,\n  filterProps,\n  InlineStyles,\n  parseStyleProps,\n  polymorphicFactory,\n  PolymorphicFactory,\n  RaikouSize,\n  StyleProp,\n  StylesApiProps,\n  useProps,\n  useRaikouTheme,\n  useRandomClassName,\n  useStyles,\n} from '../../core';\nimport { FLEX_STYLE_PROPS_DATA } from './flex-props';\nimport { FlexRootStyle } from './Flex.css';\n\nexport type FlexStylesNames = 'root';\n\nexport interface FlexProps extends BoxProps, StylesApiProps<FlexFactory>, ElementProps<'div'> {\n  /** `gap` CSS property */\n  gap?: StyleProp<RaikouSize | (string & {}) | number>;\n\n  /** `row-gap` CSS property */\n  rowGap?: StyleProp<RaikouSize | (string & {}) | number>;\n\n  /** `column-gap` CSS property */\n  columnGap?: StyleProp<RaikouSize | (string & {}) | number>;\n\n  /** `align-items` CSS property */\n  align?: StyleProp<React.CSSProperties['alignItems']>;\n\n  /** `justify-content` CSS property */\n  justify?: StyleProp<React.CSSProperties['justifyContent']>;\n\n  /** `flex-wrap` CSS property */\n  wrap?: StyleProp<React.CSSProperties['flexWrap']>;\n\n  /** `flex-direction` CSS property */\n  direction?: StyleProp<React.CSSProperties['flexDirection']>;\n}\n\nexport type FlexFactory = PolymorphicFactory<{\n  props: FlexProps;\n  defaultRef: HTMLDivElement;\n  defaultComponent: 'div';\n  stylesNames: FlexStylesNames;\n}>;\n\nconst defaultProps: Partial<FlexProps> = {};\n\nexport const Flex = polymorphicFactory<FlexFactory>((_props, ref) => {\n  const props = useProps('Flex', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    gap,\n    rowGap,\n    columnGap,\n    align,\n    justify,\n    wrap,\n    direction,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<FlexFactory>({\n    name: 'Flex',\n    classes: {\n      root: FlexRootStyle,\n    },\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    vars,\n  });\n\n  const theme = useRaikouTheme();\n  const responsiveClassName = useRandomClassName();\n  const parsedStyleProps = parseStyleProps({\n    // @ts-ignore\n    styleProps: { gap, rowGap, columnGap, align, justify, wrap, direction },\n    theme,\n    data: FLEX_STYLE_PROPS_DATA,\n  });\n\n  return (\n    <>\n      {parsedStyleProps.hasResponsiveStyles && (\n        <InlineStyles\n          selector={`.${responsiveClassName}`}\n          styles={parsedStyleProps.styles}\n          media={parsedStyleProps.media}\n        />\n      )}\n      <Box\n        ref={ref}\n        {...getStyles('root', {\n          className: responsiveClassName,\n          style: filterProps(parsedStyleProps.inlineStyles),\n        })}\n        {...others}\n      />\n    </>\n  );\n});\n\nFlex.displayName = '@raikou/core/Flex';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAoDA,MAAM,eAAmC,EAAC;AAEnC,MAAM,IAAO,GAAA,kBAAA,CAAgC,CAAC,MAAA,EAAQ,GAAQ,KAAA;AACnE,EAAA,MAAM,KAAQ,GAAA,QAAA,CAAS,MAAQ,EAAA,YAAA,EAAc,MAAM,CAAA;AACnD,EAAM,MAAA;AAAA,IACJ,UAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA,IAAA;AAAA,IACA,GAAA;AAAA,IACA,MAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EAAA,MAAM,YAAY,SAAuB,CAAA;AAAA,IACvC,IAAM,EAAA,MAAA;AAAA,IACN,OAAS,EAAA;AAAA,MACP,IAAM,EAAA;AAAA,KACR;AAAA,IACA,KAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,UAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,GACD,CAAA;AAED,EAAA,MAAM,QAAQ,cAAe,EAAA;AAC7B,EAAA,MAAM,sBAAsB,kBAAmB,EAAA;AAC/C,EAAA,MAAM,mBAAmB,eAAgB,CAAA;AAAA;AAAA,IAEvC,UAAA,EAAY,EAAE,GAAK,EAAA,MAAA,EAAQ,WAAW,KAAO,EAAA,OAAA,EAAS,MAAM,SAAU,EAAA;AAAA,IACtE,KAAA;AAAA,IACA,IAAM,EAAA;AAAA,GACP,CAAA;AAED,EAAA,uBAEK,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,IAAA,gBAAA,CAAiB,mBAChB,oBAAA,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAU,IAAI,mBAAmB,CAAA,CAAA;AAAA,QACjC,QAAQ,gBAAiB,CAAA,MAAA;AAAA,QACzB,OAAO,gBAAiB,CAAA;AAAA;AAAA,KAC1B;AAAA,oBAEF,GAAA;AAAA,MAAC,GAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACC,GAAG,UAAU,MAAQ,EAAA;AAAA,UACpB,SAAW,EAAA,mBAAA;AAAA,UACX,KAAA,EAAO,WAAY,CAAA,gBAAA,CAAiB,YAAY;AAAA,SACjD,CAAA;AAAA,QACA,GAAG;AAAA;AAAA;AACN,GACF,EAAA,CAAA;AAEJ,CAAC;AAED,IAAA,CAAK,WAAc,GAAA,mBAAA;;;;"}