@nice2dev/ui-graphics 1.2.0 → 1.2.2

package/dist/cjs/pixel/PixelEditorRightPanel.js

@@ -4,36 +4,44 @@ var jsxRuntime = require('react/jsx-runtime');
 var ui = require('@nice2dev/ui');
 var uiCore = require('@nice2dev/ui-core');
 var React = require('react');
+var i18n = require('../core/i18n.js');
 var HSVPicker = require('./HSVPicker.js');
 var PixelEditor_module = require('./PixelEditor.module.css.js');
 var pixelEditorTypes = require('./pixelEditorTypes.js');
 
 /** A collapsible section header: rotating chevron + title. */
 const sectionTrigger = (title) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: PixelEditor_module.collapseChevron, children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "chevron-right", size: 12 }) }), jsxRuntime.jsx("span", { children: title })] }));
-const PixelEditorRightPanel = React.memo(({ api }) => (jsxRuntime.jsxs("div", { className: PixelEditor_module.rightPanel, children: [jsxRuntime.jsxs(ui.NiceCollapse, { className: PixelEditor_module.panelSection, defaultExpanded: true, trigger: sectionTrigger('Brush'), children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.brushSlider, children: [jsxRuntime.jsx("label", { children: "Size" }), jsxRuntime.jsx(ui.NiceSlider, { min: 1, max: 64, value: api.brush.size, onChange: (val) => api.setBrush((b) => ({ ...b, size: val })), "aria-label": "Brush size" }), jsxRuntime.jsx("span", { children: api.brush.size })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.brushSlider, children: [jsxRuntime.jsx("label", { children: "Opacity" }), jsxRuntime.jsx(ui.NiceSlider, { min: 1, max: 100, value: api.brush.opacity, onChange: (val) => api.setBrush((b) => ({ ...b, opacity: val })), "aria-label": "Brush opacity" }), jsxRuntime.jsxs("span", { children: [api.brush.opacity, "%"] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.brushSlider, children: [jsxRuntime.jsx("label", { children: "Flow" }), jsxRuntime.jsx(ui.NiceSlider, { min: 1, max: 100, value: api.brush.flow, onChange: (val) => api.setBrush((b) => ({ ...b, flow: val })), "aria-label": "Brush flow" }), jsxRuntime.jsxs("span", { children: [api.brush.flow, "%"] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.brushSlider, children: [jsxRuntime.jsx("label", { children: "Hard" }), jsxRuntime.jsx(ui.NiceSlider, { min: 0, max: 100, value: api.brush.hardness, onChange: (val) => api.setBrush((b) => ({ ...b, hardness: val })), "aria-label": "Brush hardness" }), jsxRuntime.jsxs("span", { children: [api.brush.hardness, "%"] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.brushSlider, children: [jsxRuntime.jsx("label", { children: "Space" }), jsxRuntime.jsx(ui.NiceSlider, { min: 1, max: 100, value: api.brush.spacing, onChange: (val) => api.setBrush((b) => ({ ...b, spacing: val })), "aria-label": "Brush spacing" }), jsxRuntime.jsxs("span", { children: [api.brush.spacing, "%"] })] }), jsxRuntime.jsx("div", { className: PixelEditor_module.brushShapes, children: pixelEditorTypes.BRUSH_SHAPES.map((s) => (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.miniBtn} ${api.brush.shape === s.id ? PixelEditor_module.miniBtnActive : ''}`, variant: api.brush.shape === s.id ? 'primary' : 'ghost', size: "sm", onClick: () => api.setBrush((b) => ({ ...b, shape: s.id })), title: s.label, "aria-label": s.label, children: jsxRuntime.jsx(uiCore.NiceIcon, { name: s.icon, size: 16 }) }, s.id))) }), jsxRuntime.jsxs("div", { className: PixelEditor_module.pressureToggles, children: [jsxRuntime.jsx(ui.NiceCheckbox, { checked: api.brush.pressureSize, onChange: (checked) => api.setBrush((b) => ({ ...b, pressureSize: checked })), label: "Pressure\u2192Size", className: PixelEditor_module.checkLabel }), jsxRuntime.jsx(ui.NiceCheckbox, { checked: api.brush.pressureOpacity, onChange: (checked) => api.setBrush((b) => ({ ...b, pressureOpacity: checked })), label: "Pressure\u2192Opacity", className: PixelEditor_module.checkLabel })] })] }), jsxRuntime.jsx(ui.NiceCollapse, { className: PixelEditor_module.panelSection, defaultExpanded: true, trigger: sectionTrigger('Colour'), children: jsxRuntime.jsx(HSVPicker.HSVPicker, { color: api.col1, onChange: api.setCol1 }) }), jsxRuntime.jsxs(ui.NiceCollapse, { className: PixelEditor_module.panelSection, defaultExpanded: true, trigger: sectionTrigger('Layers'), children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.layerActions, children: [jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.addLayer, title: "Add Layer", "aria-label": "Add Layer", children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "plus", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.dupLayer, title: "Duplicate Layer", "aria-label": "Duplicate Layer", children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "copy", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.rmLayer, title: "Remove Layer", "aria-label": "Remove Layer", children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "minus", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.mergeDown, title: "Merge Down", "aria-label": "Merge Down", children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "arrow-down", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.moveLayerUp, title: "Move Up", "aria-label": "Move Up", children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "arrow-up", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.moveLayerDown, title: "Move Down", "aria-label": "Move Down", children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "arrow-down", size: 16 }) })] }), [...api.layers]
-                    .map((l, i) => ({ l, i }))
-                    .reverse()
-                    .map(({ l, i }) => (jsxRuntime.jsxs("div", { className: `${PixelEditor_module.layerItem} ${i === api.aLi ? PixelEditor_module.layerItemActive : ''}`, onClick: () => api.setALi(i), children: [jsxRuntime.jsx("span", { className: PixelEditor_module.layerVis, onClick: (e) => {
-                                e.stopPropagation();
-                                api.toggleVis(i);
-                            }, title: l.visible ? 'Visible' : 'Hidden', children: jsxRuntime.jsx(uiCore.NiceIcon, { name: l.visible ? 'eye' : 'eye-off', size: 14 }) }), jsxRuntime.jsx("span", { className: PixelEditor_module.layerLock, onClick: (e) => {
-                                e.stopPropagation();
-                                api.toggleLock(i);
-                            }, title: l.locked ? 'Locked' : 'Unlocked', children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "lock", size: 14 }) }), api.editingLayerName === l.id ? (jsxRuntime.jsx(ui.NiceTextInput, { className: PixelEditor_module.layerNameInput, value: l.name, onChange: (val) => api.renameLayer(i, val), onBlur: () => api.setEditingLayerName(null), onKeyDown: (e) => {
-                                if (e.key === 'Enter') {
-                                    api.setEditingLayerName(null);
+const PixelEditorRightPanel = /* @__PURE__ */ Object.assign(
+/* @__PURE__ */ React.memo(({ api }) => {
+    const { t } = i18n.useNiceTranslation();
+    return (jsxRuntime.jsxs("div", { className: PixelEditor_module.rightPanel, children: [jsxRuntime.jsxs(ui.NiceCollapse, { className: PixelEditor_module.panelSection, defaultExpanded: true, trigger: sectionTrigger('Brush'), children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.brushSlider, children: [jsxRuntime.jsx("label", { children: t('pixelEditorRightPanel.size', 'Size') }), jsxRuntime.jsx(ui.NiceSlider, { min: 1, max: 64, value: api.brush.size, onChange: (val) => api.setBrush((b) => ({ ...b, size: val })), "aria-label": t('pixelEditorRightPanel.brushSize', 'Brush size') }), jsxRuntime.jsx("span", { children: api.brush.size })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.brushSlider, children: [jsxRuntime.jsx("label", { children: t('pixelEditorRightPanel.opacity', 'Opacity') }), jsxRuntime.jsx(ui.NiceSlider, { min: 1, max: 100, value: api.brush.opacity, onChange: (val) => api.setBrush((b) => ({ ...b, opacity: val })), "aria-label": t('pixelEditorRightPanel.brushOpacity', 'Brush opacity') }), jsxRuntime.jsxs("span", { children: [api.brush.opacity, "%"] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.brushSlider, children: [jsxRuntime.jsx("label", { children: t('pixelEditorRightPanel.flow', 'Flow') }), jsxRuntime.jsx(ui.NiceSlider, { min: 1, max: 100, value: api.brush.flow, onChange: (val) => api.setBrush((b) => ({ ...b, flow: val })), "aria-label": t('pixelEditorRightPanel.brushFlow', 'Brush flow') }), jsxRuntime.jsxs("span", { children: [api.brush.flow, "%"] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.brushSlider, children: [jsxRuntime.jsx("label", { children: t('pixelEditorRightPanel.hard', 'Hard') }), jsxRuntime.jsx(ui.NiceSlider, { min: 0, max: 100, value: api.brush.hardness, onChange: (val) => api.setBrush((b) => ({ ...b, hardness: val })), "aria-label": t('pixelEditorRightPanel.brushHardness', 'Brush hardness') }), jsxRuntime.jsxs("span", { children: [api.brush.hardness, "%"] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.brushSlider, children: [jsxRuntime.jsx("label", { children: t('pixelEditorRightPanel.space', 'Space') }), jsxRuntime.jsx(ui.NiceSlider, { min: 1, max: 100, value: api.brush.spacing, onChange: (val) => api.setBrush((b) => ({ ...b, spacing: val })), "aria-label": t('pixelEditorRightPanel.brushSpacing', 'Brush spacing') }), jsxRuntime.jsxs("span", { children: [api.brush.spacing, "%"] })] }), jsxRuntime.jsx("div", { className: PixelEditor_module.brushShapes, children: pixelEditorTypes.BRUSH_SHAPES.map((s) => (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.miniBtn} ${api.brush.shape === s.id ? PixelEditor_module.miniBtnActive : ''}`, variant: api.brush.shape === s.id ? 'primary' : 'ghost', size: "sm", onClick: () => api.setBrush((b) => ({ ...b, shape: s.id })), title: s.label, "aria-label": s.label, children: jsxRuntime.jsx(uiCore.NiceIcon, { name: s.icon, size: 16 }) }, s.id))) }), jsxRuntime.jsxs("div", { className: PixelEditor_module.pressureToggles, children: [jsxRuntime.jsx(ui.NiceCheckbox, { checked: api.brush.pressureSize, onChange: (checked) => api.setBrush((b) => ({ ...b, pressureSize: checked })), label: t('pixelEditorRightPanel.pressureSize', 'Pressure→Size'), className: PixelEditor_module.checkLabel }), jsxRuntime.jsx(ui.NiceCheckbox, { checked: api.brush.pressureOpacity, onChange: (checked) => api.setBrush((b) => ({ ...b, pressureOpacity: checked })), label: t('pixelEditorRightPanel.pressureOpacity', 'Pressure→Opacity'), className: PixelEditor_module.checkLabel })] })] }), jsxRuntime.jsx(ui.NiceCollapse, { className: PixelEditor_module.panelSection, defaultExpanded: true, trigger: sectionTrigger('Colour'), children: jsxRuntime.jsx(HSVPicker.HSVPicker, { color: api.col1, onChange: api.setCol1 }) }), jsxRuntime.jsxs(ui.NiceCollapse, { className: PixelEditor_module.panelSection, defaultExpanded: true, trigger: sectionTrigger('Layers'), children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.layerActions, children: [jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.addLayer, title: t('pixelEditorRightPanel.addLayer', 'Add Layer'), "aria-label": t('pixelEditorRightPanel.addLayer', 'Add Layer'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "plus", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.dupLayer, title: t('pixelEditorRightPanel.duplicateLayer', 'Duplicate Layer'), "aria-label": t('pixelEditorRightPanel.duplicateLayer', 'Duplicate Layer'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "copy", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.rmLayer, title: t('pixelEditorRightPanel.removeLayer', 'Remove Layer'), "aria-label": t('pixelEditorRightPanel.removeLayer', 'Remove Layer'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "minus", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.mergeDown, title: t('pixelEditorRightPanel.mergeDown', 'Merge Down'), "aria-label": t('pixelEditorRightPanel.mergeDown', 'Merge Down'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "arrow-down", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.moveLayerUp, title: t('pixelEditorRightPanel.moveUp', 'Move Up'), "aria-label": t('pixelEditorRightPanel.moveUp', 'Move Up'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "arrow-up", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.moveLayerDown, title: t('pixelEditorRightPanel.moveDown', 'Move Down'), "aria-label": t('pixelEditorRightPanel.moveDown', 'Move Down'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "arrow-down", size: 16 }) })] }), [...api.layers]
+                        .map((l, i) => ({ l, i }))
+                        .reverse()
+                        .map(({ l, i }) => (jsxRuntime.jsxs("div", { className: `${PixelEditor_module.layerItem} ${i === api.aLi ? PixelEditor_module.layerItemActive : ''}`, onClick: () => api.setALi(i), children: [jsxRuntime.jsx("span", { className: PixelEditor_module.layerVis, onClick: (e) => {
+                                    e.stopPropagation();
+                                    api.toggleVis(i);
+                                }, title: l.visible
+                                    ? t('pixelEditorRightPanel.visible', 'Visible')
+                                    : t('pixelEditorRightPanel.hidden', 'Hidden'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: l.visible ? 'eye' : 'eye-off', size: 14 }) }), jsxRuntime.jsx("span", { className: PixelEditor_module.layerLock, onClick: (e) => {
+                                    e.stopPropagation();
+                                    api.toggleLock(i);
+                                }, title: l.locked
+                                    ? t('pixelEditorRightPanel.locked', 'Locked')
+                                    : t('pixelEditorRightPanel.unlocked', 'Unlocked'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "lock", size: 14 }) }), api.editingLayerName === l.id ? (jsxRuntime.jsx(ui.NiceTextInput, { className: PixelEditor_module.layerNameInput, value: l.name, onChange: (val) => api.renameLayer(i, val), onBlur: () => api.setEditingLayerName(null), onKeyDown: (e) => {
+                                    if (e.key === 'Enter') {
+                                        api.setEditingLayerName(null);
+                                    }
+                                }, autoFocus: true, "aria-label": t('pixelEditorRightPanel.layerName', 'Layer name') })) : (jsxRuntime.jsx("span", { className: PixelEditor_module.layerName, onDoubleClick: (e) => {
+                                    e.stopPropagation();
+                                    api.setEditingLayerName(l.id);
+                                }, children: l.name })), jsxRuntime.jsxs("span", { className: PixelEditor_module.layerOpacity, children: [Math.round((l.opacity / 255) * 100), "%"] })] }, l.id))), api.layers[api.aLi] && (jsxRuntime.jsxs("div", { className: PixelEditor_module.layerControls, children: [jsxRuntime.jsx(ui.NiceSelect, { value: api.layers[api.aLi].blendMode, onChange: (val) => api.setLayerBlendMode(api.aLi, val), className: PixelEditor_module.blendSelect, "aria-label": t('pixelEditorRightPanel.blendMode', 'Blend mode'), options: pixelEditorTypes.BLEND_MODES.map((m) => ({ value: m, label: m })) }), jsxRuntime.jsx(ui.NiceSlider, { min: 0, max: 255, value: api.layers[api.aLi].opacity, onChange: (val) => api.setLayerOpacity(api.aLi, val), className: PixelEditor_module.layerOpSlider, title: t('pixelEditorRightPanel.opacity2', 'Opacity: {opacity}%').replace('{opacity}', String(Math.round((api.layers[api.aLi].opacity / 255) * 100))) })] }))] }), jsxRuntime.jsxs(ui.NiceCollapse, { className: PixelEditor_module.panelSection, defaultExpanded: true, trigger: sectionTrigger('Palette'), children: [jsxRuntime.jsx("div", { className: PixelEditor_module.layerActions, children: jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: () => {
+                                if (!api.pal.includes(api.col1)) {
+                                    api.setPal((p) => [...p, api.col1]);
                                 }
-                            }, autoFocus: true, "aria-label": "Layer name" })) : (jsxRuntime.jsx("span", { className: PixelEditor_module.layerName, onDoubleClick: (e) => {
-                                e.stopPropagation();
-                                api.setEditingLayerName(l.id);
-                            }, children: l.name })), jsxRuntime.jsxs("span", { className: PixelEditor_module.layerOpacity, children: [Math.round((l.opacity / 255) * 100), "%"] })] }, l.id))), api.layers[api.aLi] && (jsxRuntime.jsxs("div", { className: PixelEditor_module.layerControls, children: [jsxRuntime.jsx(ui.NiceSelect, { value: api.layers[api.aLi].blendMode, onChange: (val) => api.setLayerBlendMode(api.aLi, val), className: PixelEditor_module.blendSelect, "aria-label": "Blend mode", options: pixelEditorTypes.BLEND_MODES.map((m) => ({ value: m, label: m })) }), jsxRuntime.jsx(ui.NiceSlider, { min: 0, max: 255, value: api.layers[api.aLi].opacity, onChange: (val) => api.setLayerOpacity(api.aLi, val), className: PixelEditor_module.layerOpSlider, title: `Opacity: ${Math.round((api.layers[api.aLi].opacity / 255) * 100)}%` })] }))] }), jsxRuntime.jsxs(ui.NiceCollapse, { className: PixelEditor_module.panelSection, defaultExpanded: true, trigger: sectionTrigger('Palette'), children: [jsxRuntime.jsx("div", { className: PixelEditor_module.layerActions, children: jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: () => {
-                            if (!api.pal.includes(api.col1)) {
-                                api.setPal((p) => [...p, api.col1]);
-                            }
-                        }, title: "Add current colour", "aria-label": "Add current colour", children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "plus", size: 16 }) }) }), jsxRuntime.jsx("div", { className: PixelEditor_module.paletteGrid, children: api.pal.map((c, i) => (jsxRuntime.jsx("div", { className: `${PixelEditor_module.paletteSwatch} ${c === api.col1 ? PixelEditor_module.paletteSwatchActive : ''}`, style: { backgroundColor: c }, onClick: () => api.setCol1(c), onContextMenu: (e) => {
-                            e.preventDefault();
-                            api.setCol2(c);
-                        }, title: c }, i))) })] })] })));
-PixelEditorRightPanel.displayName = 'PixelEditorRightPanel';
+                            }, title: t('pixelEditorRightPanel.addCurrentColour', 'Add current colour'), "aria-label": t('pixelEditorRightPanel.addCurrentColour', 'Add current colour'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "plus", size: 16 }) }) }), jsxRuntime.jsx("div", { className: PixelEditor_module.paletteGrid, children: api.pal.map((c, i) => (jsxRuntime.jsx("div", { className: `${PixelEditor_module.paletteSwatch} ${c === api.col1 ? PixelEditor_module.paletteSwatchActive : ''}`, style: { backgroundColor: c }, onClick: () => api.setCol1(c), onContextMenu: (e) => {
+                                e.preventDefault();
+                                api.setCol2(c);
+                            }, title: c }, i))) })] })] }));
+}), { displayName: 'PixelEditorRightPanel' });
 
 module.exports = PixelEditorRightPanel;

package/dist/cjs/pixel/PixelEditorStatusBar.js

@@ -2,13 +2,21 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
+var i18n = require('../core/i18n.js');
 var PixelEditor_module = require('./PixelEditor.module.css.js');
 var pixelEditorTypes = require('./pixelEditorTypes.js');
 
-const PixelEditorStatusBar = React.memo(({ api }) => {
+const PixelEditorStatusBar = /* @__PURE__ */ Object.assign(
+/* @__PURE__ */ React.memo(({ api }) => {
     var _a;
-    return (jsxRuntime.jsxs("div", { className: PixelEditor_module.statusBar, children: [jsxRuntime.jsxs("span", { children: [api.dw, "\u00D7", api.dh] }), jsxRuntime.jsxs("span", { children: ["Zoom ", Math.round(api.zoom * 100), "%"] }), api.cursor && pixelEditorTypes.inB(api.cursor.x, api.cursor.y, api.dw, api.dh) && (jsxRuntime.jsxs("span", { children: ["(", api.cursor.x, ", ", api.cursor.y, ")"] })), jsxRuntime.jsx("span", { children: api.tool }), jsxRuntime.jsxs("span", { children: ["Brush: ", api.brush.size, "px ", api.brush.shape] }), jsxRuntime.jsxs("span", { children: ["Pressure: ", Math.round(api.pressure * 100), "%"] }), jsxRuntime.jsxs("span", { children: ["Layer: ", (_a = api.layers[api.aLi]) === null || _a === void 0 ? void 0 : _a.name] }), jsxRuntime.jsxs("span", { children: ["Frame ", api.afi + 1, "/", api.fc] }), api.symmetry !== 'none' && jsxRuntime.jsxs("span", { children: ["Sym: ", api.symmetry] }), api.shapeFilled && jsxRuntime.jsx("span", { children: "Filled" }), api.sel && (jsxRuntime.jsxs("span", { children: ["Sel: ", api.sel.w, "\u00D7", api.sel.h] }))] }));
-});
-PixelEditorStatusBar.displayName = 'PixelEditorStatusBar';
+    const { t } = i18n.useNiceTranslation();
+    return (jsxRuntime.jsxs("div", { className: PixelEditor_module.statusBar, children: [jsxRuntime.jsxs("span", { children: [api.dw, "\u00D7", api.dh] }), jsxRuntime.jsx("span", { children: t('pixelEditorStatusBar.zoom', 'Zoom {zoom}%').replace('{zoom}', String(Math.round(api.zoom * 100))) }), api.cursor && pixelEditorTypes.inB(api.cursor.x, api.cursor.y, api.dw, api.dh) && (jsxRuntime.jsxs("span", { children: ["(", api.cursor.x, ", ", api.cursor.y, ")"] })), jsxRuntime.jsx("span", { children: api.tool }), jsxRuntime.jsx("span", { children: t('pixelEditorStatusBar.brushPx', 'Brush: {size}px {shape}')
+                    .replace('{size}', String(api.brush.size))
+                    .replace('{shape}', String(api.brush.shape)) }), jsxRuntime.jsx("span", { children: t('pixelEditorStatusBar.pressure', 'Pressure: {pressure}%').replace('{pressure}', String(Math.round(api.pressure * 100))) }), jsxRuntime.jsx("span", { children: t('pixelEditorStatusBar.layer', 'Layer: {name}').replace('{name}', String((_a = api.layers[api.aLi]) === null || _a === void 0 ? void 0 : _a.name)) }), jsxRuntime.jsx("span", { children: t('pixelEditorStatusBar.frame', 'Frame {current}/{total}')
+                    .replace('{current}', String(api.afi + 1))
+                    .replace('{total}', String(api.fc)) }), api.symmetry !== 'none' && (jsxRuntime.jsx("span", { children: t('pixelEditorStatusBar.sym', 'Sym: {symmetry}').replace('{symmetry}', String(api.symmetry)) })), api.shapeFilled && jsxRuntime.jsx("span", { children: t('pixelEditorStatusBar.filled', 'Filled') }), api.sel && (jsxRuntime.jsx("span", { children: t('pixelEditorStatusBar.sel', 'Sel: {w}×{h}')
+                    .replace('{w}', String(api.sel.w))
+                    .replace('{h}', String(api.sel.h)) }))] }));
+}), { displayName: 'PixelEditorStatusBar' });
 
 module.exports = PixelEditorStatusBar;

package/dist/cjs/pixel/PixelEditorTimeline.js

@@ -4,9 +4,22 @@ var jsxRuntime = require('react/jsx-runtime');
 var ui = require('@nice2dev/ui');
 var uiCore = require('@nice2dev/ui-core');
 var React = require('react');
+var i18n = require('../core/i18n.js');
 var PixelEditor_module = require('./PixelEditor.module.css.js');
 
-const PixelEditorTimeline = React.memo(({ api }) => (jsxRuntime.jsxs("div", { className: PixelEditor_module.bottomPanel, children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.timelineControls, children: [jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.addFrame, children: "+ Frame" }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.dupFrame, "aria-label": "Duplicate frame", children: "Dup" }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.rmFrame, "aria-label": "Remove frame", children: "\u2212 Frame" }), jsxRuntime.jsx("div", { className: PixelEditor_module.menuSep }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: () => api.setPlaying((p) => !p), "aria-label": api.playing ? 'Pause' : 'Play', children: jsxRuntime.jsx(uiCore.NiceIcon, { name: api.playing ? 'pause' : 'play', size: 16 }) }), jsxRuntime.jsx("label", { children: "FPS:" }), jsxRuntime.jsx(ui.NiceNumberInput, { min: 1, max: 60, value: api.fps, onChange: (val) => api.setFps(val !== null && val !== void 0 ? val : 8), "aria-label": "Frames per second" }), jsxRuntime.jsx("div", { className: PixelEditor_module.menuSep }), jsxRuntime.jsx(ui.NiceCheckbox, { checked: api.onion, onChange: (checked) => api.setOnion(checked), label: "Onion" }), jsxRuntime.jsx("div", { style: { flex: 1 } }), jsxRuntime.jsxs("span", { children: [api.fc, " frame", api.fc !== 1 ? 's' : ''] })] }), jsxRuntime.jsx("div", { className: PixelEditor_module.timelineFrames, children: Array.from({ length: api.fc }, (_, fi) => (jsxRuntime.jsxs("div", { className: `${PixelEditor_module.frameThumb} ${fi === api.afi ? PixelEditor_module.frameThumbActive : ''}`, onClick: () => api.setAfi(fi), children: [api.thumbs[fi] && (jsxRuntime.jsx("img", { src: api.thumbs[fi], alt: `Frame ${fi + 1}`, style: { width: 36, height: 36, imageRendering: 'pixelated', objectFit: 'contain' } })), jsxRuntime.jsx("span", { className: PixelEditor_module.frameNum, children: fi + 1 })] }, fi))) })] })));
-PixelEditorTimeline.displayName = 'PixelEditorTimeline';
+const PixelEditorTimeline = /* @__PURE__ */ Object.assign(
+/* @__PURE__ */ React.memo(({ api }) => {
+    const { t } = i18n.useNiceTranslation();
+    return (jsxRuntime.jsxs("div", { className: PixelEditor_module.bottomPanel, children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.timelineControls, children: [jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.addFrame, children: t('pixelEditorTimeline.frame', '+ Frame') }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.dupFrame, "aria-label": t('pixelEditorTimeline.duplicateFrame', 'Duplicate frame'), children: t('pixelEditorTimeline.dup', 'Dup') }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: api.rmFrame, "aria-label": t('pixelEditorTimeline.removeFrame', 'Remove frame'), children: t('pixelEditorTimeline.frame2', '− Frame') }), jsxRuntime.jsx("div", { className: PixelEditor_module.menuSep }), jsxRuntime.jsx(ui.NiceButton, { variant: "ghost", size: "sm", onClick: () => api.setPlaying((p) => !p), "aria-label": api.playing
+                            ? t('pixelEditorTimeline.pause', 'Pause')
+                            : t('pixelEditorTimeline.play', 'Play'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: api.playing ? 'pause' : 'play', size: 16 }) }), jsxRuntime.jsx("label", { children: t('pixelEditorTimeline.fps', 'FPS:') }), jsxRuntime.jsx(ui.NiceNumberInput, { min: 1, max: 60, value: api.fps, onChange: (val) => api.setFps(val !== null && val !== void 0 ? val : 8), "aria-label": t('pixelEditorTimeline.framesPerSecond', 'Frames per second') }), jsxRuntime.jsx("div", { className: PixelEditor_module.menuSep }), jsxRuntime.jsx(ui.NiceCheckbox, { checked: api.onion, onChange: (checked) => api.setOnion(checked), label: t('pixelEditorTimeline.onion', 'Onion') }), jsxRuntime.jsx("div", { style: { flex: 1 } }), jsxRuntime.jsx("span", { children: api.fc !== 1
+                            ? t('pixelEditorTimeline.framesMany', '{fc} frames').replace('{fc}', String(api.fc))
+                            : t('pixelEditorTimeline.framesOne', '{fc} frame').replace('{fc}', String(api.fc)) })] }), jsxRuntime.jsx("div", { className: PixelEditor_module.timelineFrames, children: Array.from({ length: api.fc }, (_, fi) => (jsxRuntime.jsxs("div", { className: `${PixelEditor_module.frameThumb} ${fi === api.afi ? PixelEditor_module.frameThumbActive : ''}`, onClick: () => api.setAfi(fi), children: [api.thumbs[fi] && (jsxRuntime.jsx("img", { src: api.thumbs[fi], alt: t('pixelEditorTimeline.frame3', 'Frame {fi}').replace('{fi}', String(fi + 1)), style: {
+                                width: 36,
+                                height: 36,
+                                imageRendering: 'pixelated',
+                                objectFit: 'contain',
+                            } })), jsxRuntime.jsx("span", { className: PixelEditor_module.frameNum, children: fi + 1 })] }, fi))) })] }));
+}), { displayName: 'PixelEditorTimeline' });
 
 module.exports = PixelEditorTimeline;

package/dist/cjs/pixel/PixelEditorToolbar.js

@@ -4,14 +4,20 @@ var jsxRuntime = require('react/jsx-runtime');
 var ui = require('@nice2dev/ui');
 var uiCore = require('@nice2dev/ui-core');
 var React = require('react');
+var i18n = require('../core/i18n.js');
 var PixelEditor_module = require('./PixelEditor.module.css.js');
 var pixelEditorTypes = require('./pixelEditorTypes.js');
 
-const PixelEditorToolbar = React.memo(({ api }) => (jsxRuntime.jsxs("div", { className: PixelEditor_module.toolbar, children: [pixelEditorTypes.TOOLS.map((t) => (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.toolBtn} ${api.tool === t.id ? PixelEditor_module.toolBtnActive : ''}`, variant: api.tool === t.id ? 'primary' : 'ghost', size: "sm", onClick: () => api.setTool(t.id), title: `${t.label} (${t.key})`, "aria-label": t.label, children: jsxRuntime.jsx(uiCore.NiceIcon, { name: t.icon, size: 16 }) }, t.id))), jsxRuntime.jsx("div", { className: PixelEditor_module.toolSep }), jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.toolBtn} ${api.shapeFilled ? PixelEditor_module.toolBtnActive : ''}`, variant: api.shapeFilled ? 'primary' : 'ghost', size: "sm", onClick: () => api.setShapeFilled((f) => !f), title: `${api.shapeFilled ? 'Filled' : 'Outline'} (F)`, "aria-label": api.shapeFilled ? 'Filled shape' : 'Outline shape', children: jsxRuntime.jsx(uiCore.NiceIcon, { name: api.shapeFilled ? 'check-square' : 'square', size: 16 }) }), jsxRuntime.jsx("div", { className: PixelEditor_module.toolGroup, children: pixelEditorTypes.SYMMETRY_MODES.map((m) => (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.miniBtn} ${api.symmetry === m.id ? PixelEditor_module.miniBtnActive : ''}`, variant: api.symmetry === m.id ? 'primary' : 'ghost', size: "sm", onClick: () => api.setSymmetry(m.id), title: `Symmetry: ${m.label}`, "aria-label": `Symmetry: ${m.label}`, children: jsxRuntime.jsx(uiCore.NiceIcon, { name: m.icon, size: 14 }) }, m.id))) }), jsxRuntime.jsxs("div", { className: PixelEditor_module.colorSwatches, children: [jsxRuntime.jsx("label", { style: { position: 'relative', width: 28, height: 28, cursor: 'pointer' }, title: "Primary Colour (click for HSV)", children: jsxRuntime.jsx(ui.NiceColorPicker, { value: api.col1, onChange: (c) => api.setCol1(c) }) }), jsxRuntime.jsx("label", { style: { position: 'relative', width: 22, height: 22, cursor: 'pointer' }, title: "Secondary Colour", children: jsxRuntime.jsx(ui.NiceColorPicker, { value: api.col2, onChange: (c) => api.setCol2(c) }) }), jsxRuntime.jsx(ui.NiceButton, { className: PixelEditor_module.toolBtn, variant: "ghost", size: "sm", onClick: () => {
-                        const tmp = api.col1;
-                        api.setCol1(api.col2);
-                        api.setCol2(tmp);
-                    }, title: "Swap (X)", "aria-label": "Swap colours", style: { fontSize: 12, width: 24, height: 24 }, children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "shuffle", size: 14 }) })] })] })));
-PixelEditorToolbar.displayName = 'PixelEditorToolbar';
+const PixelEditorToolbar = /* @__PURE__ */ Object.assign(
+/* @__PURE__ */ React.memo(({ api }) => {
+    const { t } = i18n.useNiceTranslation();
+    return (jsxRuntime.jsxs("div", { className: PixelEditor_module.toolbar, children: [pixelEditorTypes.TOOLS.map((t) => (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.toolBtn} ${api.tool === t.id ? PixelEditor_module.toolBtnActive : ''}`, variant: api.tool === t.id ? 'primary' : 'ghost', size: "sm", onClick: () => api.setTool(t.id), title: `${t.label} (${t.key})`, "aria-label": t.label, children: jsxRuntime.jsx(uiCore.NiceIcon, { name: t.icon, size: 16 }) }, t.id))), jsxRuntime.jsx("div", { className: PixelEditor_module.toolSep }), jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.toolBtn} ${api.shapeFilled ? PixelEditor_module.toolBtnActive : ''}`, variant: api.shapeFilled ? 'primary' : 'ghost', size: "sm", onClick: () => api.setShapeFilled((f) => !f), title: `${api.shapeFilled ? 'Filled' : 'Outline'} (F)`, "aria-label": api.shapeFilled
+                    ? t('pixelEditorToolbar.filledShape', 'Filled shape')
+                    : t('pixelEditorToolbar.outlineShape', 'Outline shape'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: api.shapeFilled ? 'check-square' : 'square', size: 16 }) }), jsxRuntime.jsx("div", { className: PixelEditor_module.toolGroup, children: pixelEditorTypes.SYMMETRY_MODES.map((m) => (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.miniBtn} ${api.symmetry === m.id ? PixelEditor_module.miniBtnActive : ''}`, variant: api.symmetry === m.id ? 'primary' : 'ghost', size: "sm", onClick: () => api.setSymmetry(m.id), title: t('pixelEditorToolbar.symmetry', 'Symmetry: {label}').replace('{label}', String(m.label)), "aria-label": t('pixelEditorToolbar.symmetry', 'Symmetry: {label}').replace('{label}', String(m.label)), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: m.icon, size: 14 }) }, m.id))) }), jsxRuntime.jsxs("div", { className: PixelEditor_module.colorSwatches, children: [jsxRuntime.jsx("label", { style: { position: 'relative', width: 28, height: 28, cursor: 'pointer' }, title: t('pixelEditorToolbar.primaryColourClickForHsv', 'Primary Colour (click for HSV)'), children: jsxRuntime.jsx(ui.NiceColorPicker, { value: api.col1, onChange: (c) => api.setCol1(c) }) }), jsxRuntime.jsx("label", { style: { position: 'relative', width: 22, height: 22, cursor: 'pointer' }, title: t('pixelEditorToolbar.secondaryColour', 'Secondary Colour'), children: jsxRuntime.jsx(ui.NiceColorPicker, { value: api.col2, onChange: (c) => api.setCol2(c) }) }), jsxRuntime.jsx(ui.NiceButton, { className: PixelEditor_module.toolBtn, variant: "ghost", size: "sm", onClick: () => {
+                            const tmp = api.col1;
+                            api.setCol1(api.col2);
+                            api.setCol2(tmp);
+                        }, title: t('pixelEditorToolbar.swapX', 'Swap (X)'), "aria-label": t('pixelEditorToolbar.swapColours', 'Swap colours'), style: { fontSize: 12, width: 24, height: 24 }, children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "shuffle", size: 14 }) })] })] }));
+}), { displayName: 'PixelEditorToolbar' });
 
 module.exports = PixelEditorToolbar;

package/dist/cjs/pixel/SpriteGeneratorPanel.js

@@ -4,6 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var ui = require('@nice2dev/ui');
 var uiCore = require('@nice2dev/ui-core');
 var React = require('react');
+var i18n = require('../core/i18n.js');
 var animalGeneratorPresets = require('./animalGeneratorPresets.js');
 var buildingGeneratorPresets = require('./buildingGeneratorPresets.js');
 var characterGeneratorPresets = require('./characterGeneratorPresets.js');
@@ -68,6 +69,7 @@ const ANIMAL_CATEGORIES = [
 const NiceSpriteGeneratorPanel = ({ onSendToCanvas, onClose, mode,
 // presets and onGenerate are exposed for forward-compat; not currently consumed.
  }) => {
+    const { t } = i18n.useNiceTranslation();
     ensureInitialized();
     /* ── State ── */
     const [tab, setTab] = React.useState(mode !== null && mode !== void 0 ? mode : 'character');
@@ -226,19 +228,19 @@ const NiceSpriteGeneratorPanel = ({ onSendToCanvas, onClose, mode,
             case 'character':
                 return [
                     {
-                        label: 'Skin',
+                        label: t('spriteGeneratorPanel.skin', 'Skin'),
                         options: palettesToOptions(characterGeneratorPresets.SKIN_PALETTES),
                         value: skinPalette,
                         set: setSkinPalette,
                     },
                     {
-                        label: 'Hair',
+                        label: t('spriteGeneratorPanel.hair', 'Hair'),
                         options: palettesToOptions(characterGeneratorPresets.HAIR_PALETTES),
                         value: hairPalette,
                         set: setHairPalette,
                     },
                     {
-                        label: 'Clothing',
+                        label: t('spriteGeneratorPanel.clothing', 'Clothing'),
                         options: palettesToOptions(characterGeneratorPresets.CLOTHING_PALETTES),
                         value: clothPalette,
                         set: setClothPalette,
@@ -247,13 +249,13 @@ const NiceSpriteGeneratorPanel = ({ onSendToCanvas, onClose, mode,
             case 'building':
                 return [
                     {
-                        label: 'Walls',
+                        label: t('spriteGeneratorPanel.walls', 'Walls'),
                         options: palettesToOptions(buildingGeneratorPresets.WALL_PALETTES),
                         value: wallPalette,
                         set: setWallPalette,
                     },
                     {
-                        label: 'Roof',
+                        label: t('spriteGeneratorPanel.roof', 'Roof'),
                         options: palettesToOptions(buildingGeneratorPresets.ROOF_PALETTES),
                         value: roofPalette,
                         set: setRoofPalette,
@@ -262,16 +264,16 @@ const NiceSpriteGeneratorPanel = ({ onSendToCanvas, onClose, mode,
             case 'animal':
                 return [
                     {
-                        label: 'Fur',
+                        label: t('spriteGeneratorPanel.fur', 'Fur'),
                         options: palettesToOptions(animalGeneratorPresets.FUR_PALETTES),
                         value: furPalette,
                         set: setFurPalette,
                     },
                 ];
         }
-    }, [tab, skinPalette, hairPalette, clothPalette, wallPalette, roofPalette, furPalette]);
+    }, [tab, skinPalette, hairPalette, clothPalette, wallPalette, roofPalette, furPalette, t]);
     /* ── Render ── */
-    return (jsxRuntime.jsx(ui.NiceModal, { open: true, onClose: onClose !== null && onClose !== void 0 ? onClose : (() => { }), title: "Sprite Generator", size: "xl", children: jsxRuntime.jsxs("div", { className: PixelEditor_module.genPanel, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.genTabs, children: ['character', 'building', 'animal'].map((t) => (jsxRuntime.jsxs(ui.NiceButton, { className: `${PixelEditor_module.genTabBtn} ${tab === t ? PixelEditor_module.genTabBtnActive : ''}`, variant: tab === t ? 'primary' : 'ghost', size: "sm", onClick: () => setTab(t), children: [jsxRuntime.jsx(uiCore.NiceIcon, { name: t === 'character' ? 'user' : t === 'building' ? 'home' : 'heart', size: 14 }), ' ', t.charAt(0).toUpperCase() + t.slice(1)] }, t))) }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genBody, children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.genLeft, children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.panelSection, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.panelTitle, children: jsxRuntime.jsx("span", { children: "Presets" }) }), jsxRuntime.jsx("div", { className: PixelEditor_module.genPresetGrid, children: presets.map((preset, i) => (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.genPresetBtn} ${i === selectedPresetIdx ? PixelEditor_module.genPresetBtnActive : ''}`, variant: i === selectedPresetIdx ? 'primary' : 'ghost', size: "sm", onClick: () => applyPreset(i), title: preset.name, children: preset.name }, i))) })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.panelSection, style: { flex: 1, overflowY: 'auto' }, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.panelTitle, children: jsxRuntime.jsx("span", { children: "Parts" }) }), categories.map((cat) => {
+    return (jsxRuntime.jsx(ui.NiceModal, { open: true, onClose: onClose !== null && onClose !== void 0 ? onClose : (() => { }), title: t('spriteGeneratorPanel.spriteGenerator', 'Sprite Generator'), size: "xl", children: jsxRuntime.jsxs("div", { className: PixelEditor_module.genPanel, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.genTabs, children: ['character', 'building', 'animal'].map((t) => (jsxRuntime.jsxs(ui.NiceButton, { className: `${PixelEditor_module.genTabBtn} ${tab === t ? PixelEditor_module.genTabBtnActive : ''}`, variant: tab === t ? 'primary' : 'ghost', size: "sm", onClick: () => setTab(t), children: [jsxRuntime.jsx(uiCore.NiceIcon, { name: t === 'character' ? 'user' : t === 'building' ? 'home' : 'heart', size: 14 }), ' ', t.charAt(0).toUpperCase() + t.slice(1)] }, t))) }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genBody, children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.genLeft, children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.panelSection, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.panelTitle, children: jsxRuntime.jsx("span", { children: t('spriteGeneratorPanel.presets', 'Presets') }) }), jsxRuntime.jsx("div", { className: PixelEditor_module.genPresetGrid, children: presets.map((preset, i) => (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.genPresetBtn} ${i === selectedPresetIdx ? PixelEditor_module.genPresetBtnActive : ''}`, variant: i === selectedPresetIdx ? 'primary' : 'ghost', size: "sm", onClick: () => applyPreset(i), title: preset.name, children: preset.name }, i))) })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.panelSection, style: { flex: 1, overflowY: 'auto' }, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.panelTitle, children: jsxRuntime.jsx("span", { children: t('spriteGeneratorPanel.parts', 'Parts') }) }), categories.map((cat) => {
                                             const parts = spriteGeneratorCore.getPartsByCategory(cat);
                                             if (parts.length === 0) {
                                                 return null;
@@ -285,26 +287,35 @@ const NiceSpriteGeneratorPanel = ({ onSendToCanvas, onClose, mode,
                                                             const active = selectedParts.some((p) => { var _a; return p.partId === part.id && ((_a = p.visible) !== null && _a !== void 0 ? _a : true); });
                                                             return (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.miniBtn} ${PixelEditor_module.genPartBtn} ${active ? PixelEditor_module.miniBtnActive : ''}`, variant: active ? 'primary' : 'ghost', size: "sm", onClick: () => (active ? removePart(part.id) : addPart(part.id)), title: part.name, children: part.name }, part.id));
                                                         }) })] }, cat));
-                                        })] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genCenter, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.genPreviewWrap, children: jsxRuntime.jsx("canvas", { ref: previewRef, className: PixelEditor_module.genPreviewCanvas }) }), jsxRuntime.jsx("div", { className: PixelEditor_module.genDirGrid, children: spriteGeneratorCore.ALL_DIRECTIONS.map((d) => (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.miniBtn} ${direction === d ? PixelEditor_module.miniBtnActive : ''}`, variant: direction === d ? 'primary' : 'ghost', size: "sm", onClick: () => setDirection(d), children: d }, d))) }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genRow, children: [jsxRuntime.jsx("label", { style: { fontSize: 10, color: 'var(--nice-text-muted)' }, children: "Projection" }), jsxRuntime.jsx(ui.NiceSelect, { className: PixelEditor_module.propSelect, value: projection, onChange: (val) => setProjection(val), options: [
-                                                { value: 'topDown', label: 'Top-Down' },
-                                                { value: 'sideView', label: 'Side View' },
-                                                { value: 'iso25d', label: '2.5D Isometric' },
-                                            ] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genRow, children: [jsxRuntime.jsx("label", { style: { fontSize: 10, color: 'var(--nice-text-muted)' }, children: "Size" }), jsxRuntime.jsx(ui.NiceNumberInput, { min: 8, max: 256, value: canvasW, onChange: (val) => setCanvasW(val !== null && val !== void 0 ? val : 32) }), jsxRuntime.jsx("span", { style: { fontSize: 10, color: 'var(--nice-text-muted)' }, children: "\u00D7" }), jsxRuntime.jsx(ui.NiceNumberInput, { min: 8, max: 256, value: canvasH, onChange: (val) => setCanvasH(val !== null && val !== void 0 ? val : 32) })] }), jsxRuntime.jsx(ui.NiceCheckbox, { checked: generate8Dir, onChange: (checked) => setGenerate8Dir(checked), label: "Generate 8-direction sheet", className: PixelEditor_module.checkLabel })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genRight, children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.panelSection, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.panelTitle, children: jsxRuntime.jsx("span", { children: "Colors" }) }), paletteGroups.map((group) => {
+                                        })] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genCenter, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.genPreviewWrap, children: jsxRuntime.jsx("canvas", { ref: previewRef, className: PixelEditor_module.genPreviewCanvas }) }), jsxRuntime.jsx("div", { className: PixelEditor_module.genDirGrid, children: spriteGeneratorCore.ALL_DIRECTIONS.map((d) => (jsxRuntime.jsx(ui.NiceButton, { className: `${PixelEditor_module.miniBtn} ${direction === d ? PixelEditor_module.miniBtnActive : ''}`, variant: direction === d ? 'primary' : 'ghost', size: "sm", onClick: () => setDirection(d), children: d }, d))) }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genRow, children: [jsxRuntime.jsx("label", { style: { fontSize: 10, color: 'var(--nice-text-muted)' }, children: t('spriteGeneratorPanel.projection', 'Projection') }), jsxRuntime.jsx(ui.NiceSelect, { className: PixelEditor_module.propSelect, value: projection, onChange: (val) => setProjection(val), options: [
+                                                { value: 'topDown', label: t('spriteGeneratorPanel.topDown', 'Top-Down') },
+                                                { value: 'sideView', label: t('spriteGeneratorPanel.sideView', 'Side View') },
+                                                {
+                                                    value: 'iso25d',
+                                                    label: t('spriteGeneratorPanel.n25dIsometric', '2.5D Isometric'),
+                                                },
+                                            ] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genRow, children: [jsxRuntime.jsx("label", { style: { fontSize: 10, color: 'var(--nice-text-muted)' }, children: t('spriteGeneratorPanel.size', 'Size') }), jsxRuntime.jsx(ui.NiceNumberInput, { min: 8, max: 256, value: canvasW, onChange: (val) => setCanvasW(val !== null && val !== void 0 ? val : 32) }), jsxRuntime.jsx("span", { style: { fontSize: 10, color: 'var(--nice-text-muted)' }, children: "\u00D7" }), jsxRuntime.jsx(ui.NiceNumberInput, { min: 8, max: 256, value: canvasH, onChange: (val) => setCanvasH(val !== null && val !== void 0 ? val : 32) })] }), jsxRuntime.jsx(ui.NiceCheckbox, { checked: generate8Dir, onChange: (checked) => setGenerate8Dir(checked), label: t('spriteGeneratorPanel.generate8DirectionSheet', 'Generate 8-direction sheet'), className: PixelEditor_module.checkLabel })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genRight, children: [jsxRuntime.jsxs("div", { className: PixelEditor_module.panelSection, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.panelTitle, children: jsxRuntime.jsx("span", { children: t('spriteGeneratorPanel.colors', 'Colors') }) }), paletteGroups.map((group) => {
                                             var _a;
                                             return (jsxRuntime.jsxs("div", { style: { marginBottom: 6 }, children: [jsxRuntime.jsx("div", { style: { fontSize: 9, color: 'var(--nice-text-muted)', marginBottom: 2 }, children: group.label }), jsxRuntime.jsx(ui.NiceSelect, { className: PixelEditor_module.propSelect, value: group.value, onChange: (val) => group.set(val), options: group.options.map((opt) => ({
                                                             value: opt.id,
                                                             label: opt.name,
                                                         })) }), jsxRuntime.jsx("div", { className: PixelEditor_module.genColorSwatches, children: (_a = group.options
                                                             .find((o) => o.id === group.value)) === null || _a === void 0 ? void 0 : _a.colors.map((c, i) => (jsxRuntime.jsx("div", { className: PixelEditor_module.genColorSwatch, style: { backgroundColor: c }, title: c }, i))) })] }, group.label));
-                                        })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.panelSection, style: { flex: 1, overflowY: 'auto' }, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.panelTitle, children: jsxRuntime.jsx("span", { children: "Assembly" }) }), selectedParts.map((ap, i) => {
+                                        })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.panelSection, style: { flex: 1, overflowY: 'auto' }, children: [jsxRuntime.jsx("div", { className: PixelEditor_module.panelTitle, children: jsxRuntime.jsx("span", { children: t('spriteGeneratorPanel.assembly', 'Assembly') }) }), selectedParts.map((ap, i) => {
                                             var _a, _b, _c, _d, _e;
                                             const part = partsMapRef.current.get(ap.partId);
                                             return (
                                             // A part can be placed twice (left and right leg, flipped), so its id
                                             // alone is not a unique key.
-                                            jsxRuntime.jsxs("div", { className: PixelEditor_module.genAssemblyItem, children: [jsxRuntime.jsx(ui.NiceButton, { className: PixelEditor_module.btnIcon, variant: "ghost", size: "sm", onClick: () => togglePart(ap.partId), title: ((_a = ap.visible) !== null && _a !== void 0 ? _a : true) ? 'Hide' : 'Show', "aria-label": ((_b = ap.visible) !== null && _b !== void 0 ? _b : true) ? 'Hide' : 'Show', children: jsxRuntime.jsx(uiCore.NiceIcon, { name: ((_c = ap.visible) !== null && _c !== void 0 ? _c : true) ? 'eye' : 'eye-off', size: 14 }) }), jsxRuntime.jsx("span", { className: PixelEditor_module.genAssemblyName, children: (_d = part === null || part === void 0 ? void 0 : part.name) !== null && _d !== void 0 ? _d : ap.partId }), jsxRuntime.jsxs("span", { style: { fontSize: 9, color: 'var(--nice-text-muted)' }, children: ["z:", (_e = part === null || part === void 0 ? void 0 : part.zOrder) !== null && _e !== void 0 ? _e : 0] }), jsxRuntime.jsx(ui.NiceButton, { className: PixelEditor_module.btnIcon, variant: "ghost", size: "sm", onClick: () => removePart(ap.partId), title: "Remove", "aria-label": "Remove", children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "close", size: 14 }) })] }, `${ap.partId}-${i}`));
-                                        })] })] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genFooter, children: [jsxRuntime.jsx(ui.NiceButton, { className: PixelEditor_module.btnSecondary, variant: "ghost", onClick: onClose, children: "Cancel" }), jsxRuntime.jsxs(ui.NiceButton, { className: PixelEditor_module.btnPrimary, variant: "primary", onClick: handleSendToCanvas, children: [jsxRuntime.jsx(uiCore.NiceIcon, { name: "clipboard", size: 14 }), " Send to Canvas"] })] })] }) }));
+                                            jsxRuntime.jsxs("div", { className: PixelEditor_module.genAssemblyItem, children: [jsxRuntime.jsx(ui.NiceButton, { className: PixelEditor_module.btnIcon, variant: "ghost", size: "sm", onClick: () => togglePart(ap.partId), title: ((_a = ap.visible) !== null && _a !== void 0 ? _a : true)
+                                                            ? t('spriteGeneratorPanel.hide', 'Hide')
+                                                            : t('spriteGeneratorPanel.show', 'Show'), "aria-label": ((_b = ap.visible) !== null && _b !== void 0 ? _b : true)
+                                                            ? t('spriteGeneratorPanel.hide', 'Hide')
+                                                            : t('spriteGeneratorPanel.show', 'Show'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: ((_c = ap.visible) !== null && _c !== void 0 ? _c : true) ? 'eye' : 'eye-off', size: 14 }) }), jsxRuntime.jsx("span", { className: PixelEditor_module.genAssemblyName, children: (_d = part === null || part === void 0 ? void 0 : part.name) !== null && _d !== void 0 ? _d : ap.partId }), jsxRuntime.jsxs("span", { style: { fontSize: 9, color: 'var(--nice-text-muted)' }, children: ["z:", (_e = part === null || part === void 0 ? void 0 : part.zOrder) !== null && _e !== void 0 ? _e : 0] }), jsxRuntime.jsx(ui.NiceButton, { className: PixelEditor_module.btnIcon, variant: "ghost", size: "sm", onClick: () => removePart(ap.partId), title: t('spriteGeneratorPanel.remove', 'Remove'), "aria-label": t('spriteGeneratorPanel.remove', 'Remove'), children: jsxRuntime.jsx(uiCore.NiceIcon, { name: "close", size: 14 }) })] }, `${ap.partId}-${i}`));
+                                        })] })] })] }), jsxRuntime.jsxs("div", { className: PixelEditor_module.genFooter, children: [jsxRuntime.jsx(ui.NiceButton, { className: PixelEditor_module.btnSecondary, variant: "ghost", onClick: onClose, children: t('spriteGeneratorPanel.cancel', 'Cancel') }), jsxRuntime.jsxs(ui.NiceButton, { className: PixelEditor_module.btnPrimary, variant: "primary", onClick: handleSendToCanvas, children: [jsxRuntime.jsx(uiCore.NiceIcon, { name: "clipboard", size: 14 }), ' ', t('spriteGeneratorPanel.sendToCanvas', 'Send to Canvas')] })] })] }) }));
 };
-NiceSpriteGeneratorPanel.displayName = 'NiceSpriteGeneratorPanel';
+if (process.env.NODE_ENV !== 'production') {
+    NiceSpriteGeneratorPanel.displayName = 'NiceSpriteGeneratorPanel';
+}
 
 module.exports = NiceSpriteGeneratorPanel;

package/dist/cjs/pixel/animalGeneratorPresets.js

@@ -40,7 +40,7 @@ const FEATHER_PALETTES = {
    ════════════════════════════════════════════════════════════════ */
 const _ = -1;
 /* ── Cat head ── */
-const CAT_HEAD_S = spriteGeneratorCore.createPartData(8, 7, [
+const CAT_HEAD_S = /* @__PURE__ */ spriteGeneratorCore.createPartData(8, 7, [
     [_, 0, _, _, _, _, 0, _],
     [0, 0, 0, 0, 0, 0, 0, 0],
     [0, 0, 0, 0, 0, 0, 0, 0],
@@ -49,7 +49,7 @@ const CAT_HEAD_S = spriteGeneratorCore.createPartData(8, 7, [
     [0, 0, 0, 3, 3, 0, 0, 0],
     [_, 0, 0, 0, 0, 0, 0, _],
 ], ['#e09040', '#c07828', 'var(--nice-success, #40a040)', '#f0a0a0']);
-const CAT_HEAD_E = spriteGeneratorCore.createPartData(6, 7, [
+const CAT_HEAD_E = /* @__PURE__ */ spriteGeneratorCore.createPartData(6, 7, [
     [_, _, _, _, 0, _],
     [_, 0, 0, 0, 0, 0],
     [0, 0, 0, 0, 0, 0],
@@ -59,7 +59,7 @@ const CAT_HEAD_E = spriteGeneratorCore.createPartData(6, 7, [
     [_, 0, 0, 0, 0, _],
 ], ['#e09040', '#c07828', 'var(--nice-success, #40a040)', '#f0a0a0']);
 /* ── Dog head ── */
-const DOG_HEAD_S = spriteGeneratorCore.createPartData(8, 8, [
+const DOG_HEAD_S = /* @__PURE__ */ spriteGeneratorCore.createPartData(8, 8, [
     [_, _, 0, 0, 0, 0, _, _],
     [_, 0, 0, 0, 0, 0, 0, _],
     [0, 0, 0, 0, 0, 0, 0, 0],
@@ -69,7 +69,7 @@ const DOG_HEAD_S = spriteGeneratorCore.createPartData(8, 8, [
     [_, _, 0, 0, 0, 0, _, _],
     [_, _, _, 0, 0, _, _, _],
 ], ['var(--nice-warning-dark, #c08848)', 'var(--nice-warning-dark, #a06830)', 'var(--nice-bg, #301818)', 'var(--nice-bg, #301818)']);
-const DOG_HEAD_E = spriteGeneratorCore.createPartData(7, 8, [
+const DOG_HEAD_E = /* @__PURE__ */ spriteGeneratorCore.createPartData(7, 8, [
     [_, _, 0, 0, 0, _, _],
     [_, 0, 0, 0, 0, 0, _],
     [0, 0, 0, 0, 0, 0, _],
@@ -80,7 +80,7 @@ const DOG_HEAD_E = spriteGeneratorCore.createPartData(7, 8, [
     [_, _, _, 0, 0, 0, _],
 ], ['var(--nice-warning-dark, #c08848)', 'var(--nice-warning-dark, #a06830)', 'var(--nice-bg, #301818)', 'var(--nice-bg, #301818)']);
 /* ── Wolf head ── */
-const WOLF_HEAD_S = spriteGeneratorCore.createPartData(10, 8, [
+const WOLF_HEAD_S = /* @__PURE__ */ spriteGeneratorCore.createPartData(10, 8, [
     [_, 0, _, _, _, _, _, _, 0, _],
     [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
     [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
@@ -91,7 +91,7 @@ const WOLF_HEAD_S = spriteGeneratorCore.createPartData(10, 8, [
     [_, _, _, 0, 0, 0, 0, _, _, _],
 ], ['var(--nice-text-secondary, #808080)', '#606060', '#f0d060', 'var(--nice-bg, #301818)']);
 /* ── Bird head ── */
-const BIRD_HEAD_S = spriteGeneratorCore.createPartData(6, 6, [
+const BIRD_HEAD_S = /* @__PURE__ */ spriteGeneratorCore.createPartData(6, 6, [
     [_, _, 0, 0, _, _],
     [_, 0, 0, 0, 0, _],
     [0, 0, 2, 2, 0, 0],
@@ -100,7 +100,7 @@ const BIRD_HEAD_S = spriteGeneratorCore.createPartData(6, 6, [
     [_, _, _, 3, _, _],
 ], ['#a08040', '#806030', 'var(--nice-bg, #301818)', '#f0a020']);
 /* ── Dragon head ── */
-const DRAGON_HEAD_S = spriteGeneratorCore.createPartData(10, 9, [
+const DRAGON_HEAD_S = /* @__PURE__ */ spriteGeneratorCore.createPartData(10, 9, [
     [_, _, _, 0, _, _, 0, _, _, _],
     [_, _, 0, 0, 0, 0, 0, 0, _, _],
     [_, 0, 0, 0, 0, 0, 0, 0, 0, _],
@@ -112,7 +112,7 @@ const DRAGON_HEAD_S = spriteGeneratorCore.createPartData(10, 9, [
     [_, _, _, 0, 0, 0, 0, _, _, _],
 ], ['var(--nice-success, #40a040)', '#308030', '#f0d060', 'var(--nice-bg, #301818)']);
 /* ── Rabbit head ── */
-const RABBIT_HEAD_S = spriteGeneratorCore.createPartData(8, 10, [
+const RABBIT_HEAD_S = /* @__PURE__ */ spriteGeneratorCore.createPartData(8, 10, [
     [_, _, 0, _, _, 0, _, _],
     [_, _, 0, _, _, 0, _, _],
     [_, _, 0, _, _, 0, _, _],
@@ -125,7 +125,7 @@ const RABBIT_HEAD_S = spriteGeneratorCore.createPartData(8, 10, [
     [_, _, 0, 0, 0, 0, _, _],
 ], ['#f0e8d0', '#d8d0b8', '#d04040', '#f0a0a0']);
 /* ── Bear head ── */
-const BEAR_HEAD_S = spriteGeneratorCore.createPartData(10, 9, [
+const BEAR_HEAD_S = /* @__PURE__ */ spriteGeneratorCore.createPartData(10, 9, [
     [_, 0, 0, _, _, _, _, 0, 0, _],
     [_, 0, 0, 0, 0, 0, 0, 0, 0, _],
     [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
@@ -137,7 +137,7 @@ const BEAR_HEAD_S = spriteGeneratorCore.createPartData(10, 9, [
     [_, _, 0, 0, 0, 0, 0, 0, _, _],
 ], ['#805020', '#603818', '#201010', '#402818']);
 /* ── Horse head ── */
-const HORSE_HEAD_S = spriteGeneratorCore.createPartData(8, 10, [
+const HORSE_HEAD_S = /* @__PURE__ */ spriteGeneratorCore.createPartData(8, 10, [
     [_, _, _, 0, 0, _, _, _],
     [_, _, 0, 0, 0, 0, _, _],
     [_, 0, 0, 0, 0, 0, 0, _],
@@ -150,7 +150,7 @@ const HORSE_HEAD_S = spriteGeneratorCore.createPartData(8, 10, [
     [_, _, _, 0, 0, _, _, _],
 ], ['var(--nice-warning-dark, #c08848)', 'var(--nice-warning-dark, #a06830)', 'var(--nice-bg, #301818)']);
 /* ── Bodies ── */
-const BODY_SMALL = spriteGeneratorCore.createPartData(8, 6, [
+const BODY_SMALL = /* @__PURE__ */ spriteGeneratorCore.createPartData(8, 6, [
     [_, _, 0, 0, 0, 0, _, _],
     [_, 0, 0, 0, 0, 0, 0, _],
     [0, 0, 0, 0, 0, 0, 0, 0],
@@ -158,7 +158,7 @@ const BODY_SMALL = spriteGeneratorCore.createPartData(8, 6, [
     [_, 0, 0, 0, 0, 0, 0, _],
     [_, _, 0, 0, 0, 0, _, _],
 ], ['#e09040', '#c07828']);
-const BODY_MEDIUM = spriteGeneratorCore.createPartData(12, 8, [
+const BODY_MEDIUM = /* @__PURE__ */ spriteGeneratorCore.createPartData(12, 8, [
     [_, _, _, 0, 0, 0, 0, 0, 0, _, _, _],
     [_, _, 0, 0, 0, 0, 0, 0, 0, 0, _, _],
     [_, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, _],
@@ -168,7 +168,7 @@ const BODY_MEDIUM = spriteGeneratorCore.createPartData(12, 8, [
     [_, _, 0, 0, 0, 0, 0, 0, 0, 0, _, _],
     [_, _, _, 0, 0, 0, 0, 0, 0, _, _, _],
 ], ['var(--nice-warning-dark, #c08848)', 'var(--nice-warning-dark, #a06830)']);
-const BODY_LARGE = spriteGeneratorCore.createPartData(14, 10, [
+const BODY_LARGE = /* @__PURE__ */ spriteGeneratorCore.createPartData(14, 10, [
     [_, _, _, _, 0, 0, 0, 0, 0, 0, _, _, _, _],
     [_, _, _, 0, 0, 0, 0, 0, 0, 0, 0, _, _, _],
     [_, _, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, _, _],
@@ -180,7 +180,7 @@ const BODY_LARGE = spriteGeneratorCore.createPartData(14, 10, [
     [_, _, _, 0, 0, 0, 0, 0, 0, 0, 0, _, _, _],
     [_, _, _, _, 0, 0, 0, 0, 0, 0, _, _, _, _],
 ], ['#805020', '#603818']);
-const BODY_BIRD = spriteGeneratorCore.createPartData(8, 7, [
+const BODY_BIRD = /* @__PURE__ */ spriteGeneratorCore.createPartData(8, 7, [
     [_, _, _, 0, 0, _, _, _],
     [_, _, 0, 0, 0, 0, _, _],
     [_, 0, 0, 0, 0, 0, 0, _],
@@ -189,7 +189,7 @@ const BODY_BIRD = spriteGeneratorCore.createPartData(8, 7, [
     [_, _, 0, 0, 0, 0, _, _],
     [_, _, _, 0, 0, _, _, _],
 ], ['#a08040', '#806030']);
-const BODY_DRAGON = spriteGeneratorCore.createPartData(14, 10, [
+const BODY_DRAGON = /* @__PURE__ */ spriteGeneratorCore.createPartData(14, 10, [
     [_, _, _, _, _, 0, 0, 0, 0, _, _, _, _, _],
     [_, _, _, _, 0, 0, 0, 0, 0, 0, _, _, _, _],
     [_, _, _, 0, 0, 0, 0, 0, 0, 0, 0, _, _, _],
@@ -202,28 +202,28 @@ const BODY_DRAGON = spriteGeneratorCore.createPartData(14, 10, [
     [_, _, _, _, 0, 0, 0, 0, 0, 0, _, _, _, _],
 ], ['var(--nice-success, #40a040)', '#f0d060']);
 /* ── Legs ── */
-const LEG_THIN = spriteGeneratorCore.createPartData(2, 5, [
+const LEG_THIN = /* @__PURE__ */ spriteGeneratorCore.createPartData(2, 5, [
     [0, 0],
     [0, 0],
     [0, 0],
     [0, 0],
     [0, 1],
 ], ['var(--nice-warning-dark, #c08848)', 'var(--nice-warning-dark, #a06830)']);
-const LEG_THICK = spriteGeneratorCore.createPartData(3, 5, [
+const LEG_THICK = /* @__PURE__ */ spriteGeneratorCore.createPartData(3, 5, [
     [0, 0, 0],
     [0, 0, 0],
     [0, 0, 0],
     [0, 0, 0],
     [0, 0, 1],
 ], ['#805020', '#603818']);
-const LEG_BIRD = spriteGeneratorCore.createPartData(2, 5, [
+const LEG_BIRD = /* @__PURE__ */ spriteGeneratorCore.createPartData(2, 5, [
     [_, 0],
     [_, 0],
     [_, 0],
     [0, 0],
     [0, 0],
 ], ['#f0a020', '#c08010']);
-const LEG_DRAGON = spriteGeneratorCore.createPartData(3, 6, [
+const LEG_DRAGON = /* @__PURE__ */ spriteGeneratorCore.createPartData(3, 6, [
     [_, 0, 0],
     [0, 0, 0],
     [0, 0, 0],
@@ -232,31 +232,31 @@ const LEG_DRAGON = spriteGeneratorCore.createPartData(3, 6, [
     [0, 1, 0],
 ], ['var(--nice-success, #40a040)', '#206020']);
 /* ── Tails ── */
-const TAIL_SHORT = spriteGeneratorCore.createPartData(4, 3, [
+const TAIL_SHORT = /* @__PURE__ */ spriteGeneratorCore.createPartData(4, 3, [
     [0, 0, _, _],
     [_, 0, 0, _],
     [_, _, 0, 0],
 ], ['#e09040', '#c07828']);
-const TAIL_LONG = spriteGeneratorCore.createPartData(6, 4, [
+const TAIL_LONG = /* @__PURE__ */ spriteGeneratorCore.createPartData(6, 4, [
     [0, 0, _, _, _, _],
     [_, 0, 0, _, _, _],
     [_, _, 0, 0, _, _],
     [_, _, _, 0, 0, 0],
 ], ['var(--nice-warning-dark, #c08848)', 'var(--nice-warning-dark, #a06830)']);
-const TAIL_FLUFFY = spriteGeneratorCore.createPartData(6, 5, [
+const TAIL_FLUFFY = /* @__PURE__ */ spriteGeneratorCore.createPartData(6, 5, [
     [_, 0, 0, _, _, _],
     [0, 0, 0, 0, _, _],
     [_, 0, 0, 0, 0, _],
     [_, _, 0, 0, 0, 0],
     [_, _, _, 0, 0, _],
 ], ['var(--nice-text-secondary, #808080)', '#606060']);
-const TAIL_DRAGON = spriteGeneratorCore.createPartData(8, 4, [
+const TAIL_DRAGON = /* @__PURE__ */ spriteGeneratorCore.createPartData(8, 4, [
     [0, 0, _, _, _, _, _, _],
     [_, 0, 0, 0, _, _, _, _],
     [_, _, _, 0, 0, 0, _, _],
     [_, _, _, _, _, 0, 1, 0],
 ], ['var(--nice-success, #40a040)', '#308030']);
-const TAIL_BIRD = spriteGeneratorCore.createPartData(5, 5, [
+const TAIL_BIRD = /* @__PURE__ */ spriteGeneratorCore.createPartData(5, 5, [
     [_, _, 0, _, _],
     [_, 0, 0, 0, _],
     [0, 0, 0, 0, 0],
@@ -264,14 +264,14 @@ const TAIL_BIRD = spriteGeneratorCore.createPartData(5, 5, [
     [_, _, 0, _, _],
 ], ['#a08040', '#806030']);
 /* ── Wings ── */
-const WING_SMALL = spriteGeneratorCore.createPartData(6, 5, [
+const WING_SMALL = /* @__PURE__ */ spriteGeneratorCore.createPartData(6, 5, [
     [_, _, _, _, 0, _],
     [_, _, _, 0, 0, 0],
     [_, _, 0, 0, 0, 0],
     [_, 0, 0, 0, 0, 0],
     [0, 0, 0, 0, 0, _],
 ], ['#a08040', '#806030']);
-const WING_LARGE = spriteGeneratorCore.createPartData(10, 8, [
+const WING_LARGE = /* @__PURE__ */ spriteGeneratorCore.createPartData(10, 8, [
     [_, _, _, _, _, _, _, _, 0, _],
     [_, _, _, _, _, _, _, 0, 0, 0],
     [_, _, _, _, _, _, 0, 0, 0, 0],
@@ -281,7 +281,7 @@ const WING_LARGE = spriteGeneratorCore.createPartData(10, 8, [
     [_, _, 0, 0, 0, 0, 0, 0, 0, _],
     [_, 0, 0, 0, 0, 0, 0, 0, _, _],
 ], ['var(--nice-success, #40a040)', '#308030']);
-const WING_BAT = spriteGeneratorCore.createPartData(10, 7, [
+const WING_BAT = /* @__PURE__ */ spriteGeneratorCore.createPartData(10, 7, [
     [_, _, 0, _, _, 0, _, _, 0, _],
     [_, 0, 0, _, 0, 0, _, 0, 0, _],
     [_, 0, 0, 0, 0, 0, 0, 0, 0, _],
@@ -291,13 +291,13 @@ const WING_BAT = spriteGeneratorCore.createPartData(10, 7, [
     [_, _, _, 0, 0, 0, 0, _, _, _],
 ], ['var(--nice-border, #404040)', '#303030']);
 /* ── Manes ── */
-const MANE_SHORT = spriteGeneratorCore.createPartData(6, 4, [
+const MANE_SHORT = /* @__PURE__ */ spriteGeneratorCore.createPartData(6, 4, [
     [_, _, 0, 0, _, _],
     [_, 0, 0, 0, 0, _],
     [0, 0, 0, 0, 0, 0],
     [_, _, 0, 0, _, _],
 ], ['var(--nice-warning-dark, #c08848)', 'var(--nice-warning-dark, #a06830)']);
-const MANE_LONG = spriteGeneratorCore.createPartData(6, 8, [
+const MANE_LONG = /* @__PURE__ */ spriteGeneratorCore.createPartData(6, 8, [
     [_, _, 0, 0, _, _],
     [_, 0, 0, 0, 0, _],
     [0, 0, 0, 0, 0, 0],
@@ -308,12 +308,12 @@ const MANE_LONG = spriteGeneratorCore.createPartData(6, 8, [
     [_, _, 0, 0, _, _],
 ], ['var(--nice-warning-dark, #c08848)', 'var(--nice-warning-dark, #a06830)']);
 /* ── Horns ── */
-const HORNS_SMALL = spriteGeneratorCore.createPartData(8, 3, [
+const HORNS_SMALL = /* @__PURE__ */ spriteGeneratorCore.createPartData(8, 3, [
     [0, _, _, _, _, _, _, 0],
     [0, 0, _, _, _, _, 0, 0],
     [_, 0, _, _, _, _, 0, _],
 ], ['#f0e8d0', '#d8d0b8']);
-const HORNS_DRAGON = spriteGeneratorCore.createPartData(10, 4, [
+const HORNS_DRAGON = /* @__PURE__ */ spriteGeneratorCore.createPartData(10, 4, [
     [0, _, _, _, _, _, _, _, _, 0],
     [0, 0, _, _, _, _, _, _, 0, 0],
     [_, 0, 0, _, _, _, _, 0, 0, _],