import { nodeOrNew, register, wrapWithAttrCheck } from '../utils/adopter.js' import { registerMethods } from '../utils/methods.js' import Container from './Container.js' import baseFind from '../modules/core/selector.js' export default class ClipPath extends Container { constructor(node, attrs = node) { super(nodeOrNew('clipPath', node), attrs) } // Unclip all clipped elements and remove itself remove() { // unclip all targets this.targets().forEach(function (el) { el.unclip() }) // remove clipPath from parent return super.remove() } targets() { return baseFind('svg [clip-path*=' + this.id() + ']') } } registerMethods({ Container: { // Create clipping element clip: wrapWithAttrCheck(function () { return this.defs().put(new ClipPath()) }) }, Element: { // Distribute clipPath to svg element clipper() { return this.reference('clip-path') }, clipWith(element) { // use given clip or create a new one const clipper = element instanceof ClipPath ? element : this.parent().clip().add(element) // apply mask return this.attr('clip-path', 'url(#' + clipper.id() + ')') }, // Unclip element unclip() { return this.attr('clip-path', null) } } }) register(ClipPath, 'ClipPath')