UNPKG

@atlaskit/pragmatic-drag-and-drop-react-drop-indicator

Version:

An optional Pragmatic drag and drop package containing react components that provide a visual indication about what the user will achieve when the drop (eg lines)

51 lines (49 loc) 1.38 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.DropIndicator = DropIndicator; var _react = _interopRequireDefault(require("react")); var _border = require("./border"); var _box = require("./box"); // exporting the type for consumption ease var axisLookup = { vertical: { start: 'top', end: 'bottom' }, horizontal: { start: 'left', end: 'right' } }; function DropIndicator(_ref) { var instruction = _ref.instruction, lineGap = _ref.lineGap, lineType = _ref.lineType; var appearance = instruction.blocked ? 'warning' : 'default'; var axis = axisLookup[instruction.axis]; if (instruction.operation === 'combine') { return /*#__PURE__*/_react.default.createElement(_border.DropIndicator, { appearance: appearance }); } if (instruction.operation === 'reorder-before') { return /*#__PURE__*/_react.default.createElement(_box.DropIndicator, { edge: axis.start, appearance: appearance, gap: lineGap, type: lineType }); } if (instruction.operation === 'reorder-after') { return /*#__PURE__*/_react.default.createElement(_box.DropIndicator, { edge: axis.end, appearance: appearance, gap: lineGap, type: lineType }); } return null; }