@mintjamsinc/ichigojs 0.1.56 → 0.1.58

package/dist/ichigo.esm.js

@@ -8647,6 +8647,14 @@ class VDirectiveManager {
         // Other directives (@click, :class, etc.) will be processed on the cloned/rendered elements.
         const attributes = [];
         if (element.hasAttribute(StandardDirectiveName.V_FOR)) {
+            // <template v-for v-if> is not supported: v-for clones .content (a
+            // DocumentFragment), so the v-if attribute on the <template> itself
+            // is lost. Warn the developer so silent failure is avoided.
+            if (element instanceof HTMLTemplateElement && element.hasAttribute(StandardDirectiveName.V_IF)) {
+                console.warn('[ichigo.js] <template> cannot combine v-for and v-if. ' +
+                    'The v-if will be ignored. Move v-if to an inner element, ' +
+                    'or replace <template> with a regular element.', element);
+            }
             // For v-for template element: only process v-for and :key
             // Other attributes will be processed when child VNodes are created for cloned elements
             attributes.push(element.getAttributeNode(StandardDirectiveName.V_FOR));
@@ -11393,23 +11401,27 @@ class VOnDirective {
         this.#listener = (event) => {
             // Check key modifiers for keyboard events
             if (event instanceof KeyboardEvent) {
-                const keyModifiers = ['enter', 'tab', 'delete', 'esc', 'space', 'up', 'down', 'left', 'right'];
-                const hasKeyModifier = keyModifiers.some(key => this.#modifiers.has(key));
+                // Map of modifier alias -> KeyboardEvent.key values it matches.
+                // Multiple values allow a single modifier to match several physical keys
+                // (e.g. `.delete` matches both Delete and Backspace, matching Vue's behavior).
+                // Multiple aliases pointing to the same key are allowed (e.g. `.esc` / `.escape`).
+                const keyMap = {
+                    'enter': ['Enter'],
+                    'tab': ['Tab'],
+                    'delete': ['Delete', 'Backspace'],
+                    'esc': ['Escape'],
+                    'escape': ['Escape'],
+                    'space': [' '],
+                    'up': ['ArrowUp'],
+                    'down': ['ArrowDown'],
+                    'left': ['ArrowLeft'],
+                    'right': ['ArrowRight']
+                };
+                const hasKeyModifier = Object.keys(keyMap).some(key => this.#modifiers.has(key));
                 if (hasKeyModifier) {
-                    const keyMap = {
-                        'enter': 'Enter',
-                        'tab': 'Tab',
-                        'delete': 'Delete',
-                        'esc': 'Escape',
-                        'space': ' ',
-                        'up': 'ArrowUp',
-                        'down': 'ArrowDown',
-                        'left': 'ArrowLeft',
-                        'right': 'ArrowRight'
-                    };
                     let keyMatched = false;
-                    for (const [modifier, keyValue] of Object.entries(keyMap)) {
-                        if (this.#modifiers.has(modifier) && event.key === keyValue) {
+                    for (const [modifier, keyValues] of Object.entries(keyMap)) {
+                        if (this.#modifiers.has(modifier) && keyValues.includes(event.key)) {
                             keyMatched = true;
                             break;
                         }