styled.ts 636 B

123456789101112131415161718192021222324252627282930
  1. import styled from 'styled-components';
  2. export const SVG = styled.svg`
  3. position: absolute;
  4. cursor: pointer;
  5. z-index: 10;
  6. outline: none;
  7. `;
  8. export const Rect = styled.rect`
  9. cursor: move;
  10. fill: #ffffff;
  11. fill-opacity: 0;
  12. stroke-width: 3;
  13. `;
  14. const arrowDirection: { [index: string]: string } = {
  15. 'top-right': 'ne-resize',
  16. top: 'n-resize',
  17. 'top-left': 'nw-resize',
  18. left: 'w-resize',
  19. 'bottom-left': 'sw-resize',
  20. bottom: 's-resize',
  21. 'bottom-right': 'se-resize',
  22. right: 'e-resize',
  23. };
  24. export const Circle = styled('circle')<{ direction: string }>`
  25. cursor: ${(props) => arrowDirection[props.direction]};
  26. `;