import { css } from "@node-projects/base-custom-webcomponent";
import { FlexboxExtension } from './FlexboxExtension.js';
import { NodeType } from '../../../../item/NodeType.js';
export const flexboxExtensionShowOverlayOptionName = 'flexboxExtensionShowOverlay';
export class FlexboxExtensionProvider {
    shouldExtend(extensionManager, designerCanvas, designItem) {
        if (designItem.nodeType != NodeType.Element)
            return false;
        const display = getComputedStyle(designItem.element).display;
        if (display == 'flex' || display == 'inline-flex')
            return designerCanvas.instanceServiceContainer.designContext.extensionOptions[flexboxExtensionShowOverlayOptionName] !== false;
        return false;
    }
    getExtension(extensionManager, designerCanvas, designItem) {
        return new FlexboxExtension(extensionManager, designerCanvas, designItem);
    }
    style = css `
    .svg-flexbox { stroke: orange; fill: #9a47ff22; }
  `;
}
//# sourceMappingURL=FlexboxExtensionProvider.js.map