@grafana/ui/dist/esm/components/Layout/Stack/Stack.mjs.map

Grafana Components Library

{"version":3,"file":"Stack.mjs","sources":["../../../../../src/components/Layout/Stack/Stack.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport * as React from 'react';\n\nimport { GrafanaTheme2, ThemeSpacingTokens } from '@grafana/data';\n\nimport { useStyles2 } from '../../../themes/ThemeContext';\nimport { AlignItems, Direction, FlexProps, JustifyContent, Wrap } from '../types';\nimport { ResponsiveProp, getResponsiveStyle } from '../utils/responsiveness';\nimport { getSizeStyles, SizeProps } from '../utils/styles';\n\ninterface StackProps extends FlexProps, SizeProps, Omit<React.HTMLAttributes<HTMLElement>, 'className' | 'style'> {\n  gap?: ResponsiveProp<ThemeSpacingTokens>;\n  rowGap?: ResponsiveProp<ThemeSpacingTokens>;\n  columnGap?: ResponsiveProp<ThemeSpacingTokens>;\n  alignItems?: ResponsiveProp<AlignItems>;\n  justifyContent?: ResponsiveProp<JustifyContent>;\n  direction?: ResponsiveProp<Direction>;\n  wrap?: ResponsiveProp<Wrap>;\n  children?: React.ReactNode;\n}\n\nexport const Stack = React.forwardRef<HTMLDivElement, StackProps>((props, ref) => {\n  const {\n    gap = 1,\n    rowGap,\n    columnGap,\n    alignItems,\n    justifyContent,\n    direction,\n    wrap,\n    children,\n    grow,\n    shrink,\n    basis,\n    flex,\n    width,\n    minWidth,\n    maxWidth,\n    height,\n    minHeight,\n    maxHeight,\n    ...rest\n  } = props;\n  const styles = useStyles2(\n    getStyles,\n    gap,\n    rowGap,\n    columnGap,\n    alignItems,\n    justifyContent,\n    direction,\n    wrap,\n    grow,\n    shrink,\n    basis,\n    flex\n  );\n  const sizeStyles = useStyles2(getSizeStyles, width, minWidth, maxWidth, height, minHeight, maxHeight);\n  return (\n    <div ref={ref} className={cx(styles.flex, sizeStyles)} {...rest}>\n      {children}\n    </div>\n  );\n});\n\nStack.displayName = 'Stack';\n\nconst getStyles = (\n  theme: GrafanaTheme2,\n  gap: StackProps['gap'],\n  rowGap: StackProps['rowGap'],\n  columnGap: StackProps['columnGap'],\n  alignItems: StackProps['alignItems'],\n  justifyContent: StackProps['justifyContent'],\n  direction: StackProps['direction'],\n  wrap: StackProps['wrap'],\n  grow: StackProps['grow'],\n  shrink: StackProps['shrink'],\n  basis: StackProps['basis'],\n  flex: StackProps['flex']\n) => {\n  return {\n    flex: css([\n      {\n        display: 'flex',\n      },\n      getResponsiveStyle(theme, direction, (val) => ({\n        flexDirection: val,\n      })),\n      getResponsiveStyle(theme, wrap, (val) => ({\n        flexWrap: typeof val === 'boolean' ? (val ? 'wrap' : 'nowrap') : val,\n      })),\n      getResponsiveStyle(theme, alignItems, (val) => ({\n        alignItems: val,\n      })),\n      getResponsiveStyle(theme, justifyContent, (val) => ({\n        justifyContent: val,\n      })),\n      getResponsiveStyle(theme, gap, (val) => ({\n        gap: theme.spacing(val),\n      })),\n      getResponsiveStyle(theme, rowGap, (val) => ({\n        rowGap: theme.spacing(val),\n      })),\n      getResponsiveStyle(theme, columnGap, (val) => ({\n        columnGap: theme.spacing(val),\n      })),\n      getResponsiveStyle(theme, grow, (val) => ({\n        flexGrow: val,\n      })),\n      getResponsiveStyle(theme, shrink, (val) => ({\n        flexShrink: val,\n      })),\n      getResponsiveStyle(theme, basis, (val) => ({\n        flexBasis: val,\n      })),\n      getResponsiveStyle(theme, flex, (val) => ({\n        flex: val,\n      })),\n    ]),\n  };\n};\n"],"names":[],"mappings":"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"}