import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
import React from 'react';
import { NiceButton as We, NiceSelect as fn, NiceCheckbox as Fr } from '../packages/ui/dist/index.js';
import styles from './VectorEditor.module.css.js';

const VectorEditorMenuBar$1 = ({ api, hasOnSaveToLibrary }) => {
    const { selId, hasClipboard, snapGrid, fInp, shapes, boolSecondShape, newCanvas, setDlgSvg, setBoolSecondShape, exportSVG, exportPNG, exportJPG, exportWebP, exportBMP, undo, redo, duplicateShape, copyShape, pasteShape, deleteShape, bringToFront, sendToBack, flipH, flipV, alignShapes, setSnapGrid, saveToLibrary, unionShapes, subtractShapes, intersectShapes, excludeShapes, outlineStroke, } = api;
    // Check if we can perform boolean ops (need 2 shapes selected)
    const canBool = selId && boolSecondShape && selId !== boolSecondShape;
    return (jsxs("div", { className: styles.menuBar, children: [jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: newCanvas, children: "New" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: () => { var _a; return (_a = fInp.current) === null || _a === void 0 ? void 0 : _a.click(); }, children: "Open SVG" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: () => setDlgSvg(true), children: "Paste SVG" }), jsx("div", { className: styles.menuSep }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: exportSVG, children: "SVG" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: exportPNG, children: "PNG" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: exportJPG, children: "JPG" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: exportWebP, children: "WebP" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: exportBMP, children: "BMP" }), jsx("div", { className: styles.menuSep }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: undo, children: "Undo" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: redo, children: "Redo" }), jsx("div", { className: styles.menuSep }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: duplicateShape, disabled: !selId, "aria-label": "Ctrl+D", children: "Dup" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: copyShape, disabled: !selId, "aria-label": "Ctrl+C", children: "Copy" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: pasteShape, disabled: !hasClipboard, "aria-label": "Ctrl+V", children: "Paste" }), jsx("div", { className: styles.menuSep }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: deleteShape, disabled: !selId, children: "Delete" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: bringToFront, disabled: !selId, children: "\u2191 Front" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: sendToBack, disabled: !selId, children: "\u2193 Back" }), jsx("div", { className: styles.menuSep }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: flipH, disabled: !selId, "aria-label": "Flip H", children: "\u21D4" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: flipV, disabled: !selId, "aria-label": "Flip V", children: "\u21D5" }), jsx("div", { className: styles.menuSep }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: () => alignShapes("left"), disabled: !selId, "aria-label": "Align Left", children: "\u25E7" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: () => alignShapes("center"), disabled: !selId, "aria-label": "Align Center", children: "\u25EB" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: () => alignShapes("right"), disabled: !selId, "aria-label": "Align Right", children: "\u25E8" }), jsx("div", { className: styles.menuSep }), shapes.length >= 2 && (jsxs(Fragment, { children: [jsx(fn, { className: styles.menuBtn, value: boolSecondShape || "", onChange: (val) => setBoolSecondShape(val || null), options: [
                            { value: "", label: "2nd Shape" },
                            ...shapes.filter(s => s.id !== selId).map((s, i) => ({ value: s.id, label: `Shape ${i + 1}` })),
                        ], style: { minWidth: 80 } }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: unionShapes, disabled: !canBool, "aria-label": "Union", children: "\u222A" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: subtractShapes, disabled: !canBool, "aria-label": "Subtract", children: "\u2212" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: intersectShapes, disabled: !canBool, "aria-label": "Intersect", children: "\u2229" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: excludeShapes, disabled: !canBool, "aria-label": "Exclude", children: "\u2295" }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: outlineStroke, disabled: !selId, "aria-label": "Outline Stroke", children: "\u25AD" }), jsx("div", { className: styles.menuSep })] })), jsxs("label", { className: styles.menuLabel, children: [jsx(Fr, { checked: snapGrid, onChange: () => setSnapGrid((v) => !v) }), "Snap"] }), hasOnSaveToLibrary && (jsxs(Fragment, { children: [jsx("div", { className: styles.menuSep }), jsx(We, { className: styles.menuBtn, variant: "ghost", size: "sm", onClick: saveToLibrary, children: "\uD83D\uDCE6 Save to Library" })] }))] }));
};
var VectorEditorMenuBar = React.memo(VectorEditorMenuBar$1);

export { VectorEditorMenuBar as default };
//# sourceMappingURL=VectorEditorMenuBar.js.map
