@grafana/ui/dist/esm/components/DragHandle/DragHandle.mjs.map

Grafana Components Library

{"version":3,"file":"DragHandle.mjs","sources":["../../../../src/components/DragHandle/DragHandle.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nexport type DragHandlePosition = 'middle' | 'start' | 'end';\n\nexport const getDragStyles = (theme: GrafanaTheme2, handlePosition?: DragHandlePosition) => {\n  const position = handlePosition || 'middle';\n  const baseColor = theme.colors.emphasize(theme.colors.background.secondary, 0.15);\n  const hoverColor = theme.colors.primary.border;\n  const clickTargetSize = theme.spacing(2);\n  const handlebarThickness = 4;\n  const handlebarWidth = 200;\n  let verticalOffset = '50%';\n  let horizontalOffset = '50%';\n\n  switch (position) {\n    case 'start': {\n      verticalOffset = '0%';\n      horizontalOffset = '0%';\n      break;\n    }\n    case 'end': {\n      verticalOffset = '100%';\n      horizontalOffset = '100%';\n      break;\n    }\n  }\n\n  const dragHandleBase = css({\n    position: 'relative',\n\n    '&:before': {\n      content: '\"\"',\n      position: 'absolute',\n      transition: theme.transitions.create('border-color'),\n      zIndex: 1,\n    },\n\n    '&:after': {\n      background: baseColor,\n      content: '\"\"',\n      position: 'absolute',\n      transition: theme.transitions.create('background'),\n      transform: 'translate(-50%, -50%)',\n      borderRadius: theme.shape.radius.pill,\n      zIndex: 1,\n    },\n\n    '&:hover': {\n      '&:before': {\n        borderColor: hoverColor,\n      },\n\n      '&:after': {\n        background: hoverColor,\n      },\n    },\n  });\n\n  const beforeVertical = {\n    borderRight: '1px solid transparent',\n    height: '100%',\n    left: verticalOffset,\n    transform: 'translateX(-50%)',\n  };\n\n  const beforeHorizontal = {\n    borderTop: '1px solid transparent',\n    top: horizontalOffset,\n    transform: 'translateY(-50%)',\n  };\n\n  return {\n    dragHandleVertical: cx(\n      dragHandleBase,\n      css({\n        cursor: 'col-resize',\n        width: clickTargetSize,\n\n        '&:before': beforeVertical,\n\n        '&:after': {\n          left: verticalOffset,\n          top: '50%',\n          height: handlebarWidth,\n          width: handlebarThickness,\n        },\n      })\n    ),\n    dragHandleHorizontal: cx(\n      dragHandleBase,\n      css({\n        height: clickTargetSize,\n        cursor: 'row-resize',\n\n        '&:before': beforeHorizontal,\n\n        '&:after': {\n          left: '50%',\n          top: horizontalOffset,\n          height: handlebarThickness,\n          width: handlebarWidth,\n        },\n      })\n    ),\n    dragHandleBaseVertical: cx(\n      dragHandleBase,\n      css({\n        cursor: 'col-resize',\n        width: clickTargetSize,\n\n        '&:before': beforeVertical,\n      })\n    ),\n    dragHandleBaseHorizontal: cx(\n      dragHandleBase,\n      css({\n        cursor: 'row-resize',\n        height: clickTargetSize,\n\n        '&:before': beforeHorizontal,\n      })\n    ),\n  };\n};\n"],"names":[],"mappings":"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"}