import { getBBox } from "../../util/Elements.mjs";
import { create, attr, append } from "../../../../tiny-svg/dist/index.esm.mjs";
import { query } from "../../../../min-dom/dist/index.esm.mjs";
import { assign } from "../../../../min-dash/dist/index.esm.mjs";
var LOW_PRIORITY = 500;
function Outline(eventBus, styles, elementRegistry) {
  this.offset = 6;
  var OUTLINE_STYLE = styles.cls("djs-outline", ["no-fill"]);
  var self = this;
  function createOutline(gfx, bounds) {
    var outline = create("rect");
    attr(outline, assign({
      x: 10,
      y: 10,
      rx: 3,
      width: 100,
      height: 100
    }, OUTLINE_STYLE));
    append(gfx, outline);
    return outline;
  }
  eventBus.on(["shape.added", "shape.changed"], LOW_PRIORITY, function(event) {
    var element = event.element, gfx = event.gfx;
    var outline = query(".djs-outline", gfx);
    if (!outline) {
      outline = createOutline(gfx);
    }
    self.updateShapeOutline(outline, element);
  });
  eventBus.on(["connection.added", "connection.changed"], function(event) {
    var element = event.element, gfx = event.gfx;
    var outline = query(".djs-outline", gfx);
    if (!outline) {
      outline = createOutline(gfx);
    }
    self.updateConnectionOutline(outline, element);
  });
}
Outline.prototype.updateShapeOutline = function(outline, element) {
  attr(outline, {
    x: -this.offset,
    y: -this.offset,
    width: element.width + this.offset * 2,
    height: element.height + this.offset * 2
  });
};
Outline.prototype.updateConnectionOutline = function(outline, connection) {
  var bbox = getBBox(connection);
  attr(outline, {
    x: bbox.x - this.offset,
    y: bbox.y - this.offset,
    width: bbox.width + this.offset * 2,
    height: bbox.height + this.offset * 2
  });
};
Outline.$inject = ["eventBus", "styles", "elementRegistry"];
export {
  Outline as default
};
