aleman 1.8.0 → 1.9.1

package/ChangeLog

@@ -1,3 +1,13 @@
+2025.09.14, v1.9.1
+
+feature:
+- f6f0d8d aleman: menu: add link fallback
+
+2025.09.14, v1.9.0
+
+feature:
+- cb8b8bc aleman: menu: add support of $, ^
+
 2025.09.14, v1.8.0
 
 feature:

package/README.md

@@ -23,8 +23,9 @@ bun i aleman
 ## Rules and Addons
 
 Aleman supports two main concepts:
-- ✅addons - events;
-- ✅rules - 🐊**Putout** rules that changes HTML;
+
+- ✅ addons - events;
+- ✅ rules - 🐊**Putout** rules that changes HTML;
 
 All interaction with DOM made using rules, and we interact not with DOM directly, but with JSX AST.
 It makes testing simple, states predictable and independent.
@@ -34,16 +35,17 @@ It makes testing simple, states predictable and independent.
 Addon responsible for UI and interfaction with outer world: clicks, fetches and everything like this.
 Aleman supports next types of addons:
 
-- Global
-- Events
-- Keys
-- Vim
+- ✅ [Global](#globals);
+- ✅ [Events](#events);
+- ✅ [Keys](#keys);
+- ✅ [Vim](#vim);
 
 When you need to filter out events according to `state` use `filter`:
 
 ```js
 export const filter = ({state}) => state.command === 'show';
 ```
+
 #### Global
 
 Any browser event you need to listen globally:
@@ -63,7 +65,7 @@ export const listener = () => ({
 Any browser event you need to listen according to element with `data-name="hello":
 
 ```js
-export const name = 'hello'
+export const name = 'hello';
 export const events = ['click'];
 export const listener = () => ({
     command: 'hide',
@@ -84,7 +86,7 @@ export const listener = ({state, options}) => {
         command: 'hide',
         showSubmenu: false,
         index: -1,
-    }
+    };
 };
 ```
 
@@ -101,7 +103,7 @@ export function listener({state, options}) {
         index,
         submenuIndex,
     } = state;
-
+    
     const newState = {
         ...state,
         index: insideSubmenu ? index : 1,

package/aleman/vim.js

@@ -1,7 +1,11 @@
 const isNumber = (a) => !Number.isNaN(a) && typeof a === 'number';
 
-export const createVimParser = (buffer = []) => (event) => {
-    const {key} = event;
+export const createVimParser = (buffer = []) => ({key}) => {
+    if (key === '^')
+        return ['^'];
+    
+    if (key === '$')
+        return ['$'];
     
     if (!buffer.length && key === 'g') {
         buffer.push('g');

package/menu/README.md

@@ -11,6 +11,19 @@
 - ✅[`submenu`](https://putout.cloudcmd.io/#/gist/b0a3b64d14f3497869a345e7e438d66e/feb671c4a59a555ff408af92fab602bae3a94e2f);
 - ✅[`hide-submenu`](https://putout.cloudcmd.io/#/gist/fdf6cf60a7fdfa2bae64279eda2ab023/ce0d5e24dc5e0b3436b7e87585c62e8a5132a9ab);
 
+## Hot Keys
+
+| Key          | Operation               |
+|:-------------|:------------------------|
+| `F9`         | open                    |
+| `Esc`        | close                   |
+| `Up`, `j`    | move cursor up          |
+| `Down`, `k`  | move cursor down        |
+| `Left`, `h`  | close submenu           |
+| `Right`, `l` | open submenu            |
+| `G` or `$`   | navigate to bottom file |
+| `gg` or `^`  | navigate to top file    |
+
 ## License
 
 MIT

package/menu/addons/gg.js

@@ -1,7 +1,10 @@
 import * as up from './up.js';
 
 export const {filter} = up;
-export const commands = ['gg'];
+export const commands = [
+    'gg',
+    '^',
+];
 
 export function listener({state, options}) {
     const {
@@ -21,4 +24,3 @@ export function listener({state, options}) {
         options,
     });
 }
-

package/menu/addons/j.js

@@ -37,4 +37,3 @@ export function listener({count, state, options}) {
         options,
     });
 }
-

package/menu/addons/k.js

@@ -30,4 +30,3 @@ export function listener({count, state, options}) {
         options,
     });
 }
-

package/menu/addons/shift-g.js

@@ -1,6 +1,9 @@
 import {getSubmenu} from './submenu/index.js';
 
-export const keys = ['G'];
+export const keys = [
+    'G',
+    '$',
+];
 
 export const preventDefault = true;
 

package/menu/menu.js

@@ -7,7 +7,7 @@ export const createMenu = async (elementName, options, menu) => {
     const hydrateElement = createHydrate(name);
     
     await createMap();
-    await createLink();
+    await loadStyle();
     
     createStateElement(name);
     const {hydrateMenu} = await import('./hydrate-menu.js');
@@ -19,21 +19,40 @@ export const createMenu = async (elementName, options, menu) => {
     });
 };
 
-async function createLink() {
+async function loadStyle() {
     const name = 'aleman-menu-style';
     
     if (findByName(name))
         return;
     
-    const style = document.createElement('style');
+    const [error] = await tryToCatch(importCSS);
     
-    style.dataset.name = name;
+    if (!error)
+        return;
+    
+    createLink();
+}
+
+function createLink() {
+    const href = new URL('menu.css', import.meta.url).pathname;
+    const link = document.createElement('link');
+    
+    link.rel = 'stylesheet';
+    link.href = href;
+    document.head.appendChild(link);
+}
+
+async function importCSS() {
     const content = await import('./menu.css', {
         with: {
             type: 'css',
         },
     });
     
+    const style = document.createElement('style');
+    
+    style.dataset.name = name;
+    
     for (const rule of content.default.cssRules) {
         style.innerHTML += rule.cssText;
     }
@@ -89,3 +108,12 @@ async function createMap() {
 function findByName(name) {
     return document.querySelector(`[data-name=${name}]`);
 }
+
+async function tryToCatch(fn, args) {
+    try {
+        return [null, await fn(...args)];
+    } catch(error) {
+        return [error];
+    }
+}
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aleman",
-  "version": "1.8.0",
+  "version": "1.9.1",
   "type": "module",
   "author": "coderaiser <mnemonic.enemy@gmail.com> (https://github.com/coderaiser)",
   "description": "🐊Putout-based framework for web",
@@ -29,7 +29,8 @@
     "html-escaper": "^3.0.3",
     "jessy": "^4.1.0",
     "once": "^1.4.0",
-    "putout": "^40.5.1"
+    "putout": "^40.5.1",
+    "try-to-catch": "^3.0.1"
   },
   "keywords": [
     "putout",