hyperclayjs 1.21.0 → 1.22.1

package/README.md

@@ -74,9 +74,10 @@ import 'hyperclayjs/presets/standard.js';
 | Module | Size | Description |
 |--------|------|-------------|
 | ajax-elements | 2.6KB | [ajax-form], [ajax-button] for async form submissions |
-| dom-helpers | 6.2KB | el.nearest, el.val, el.text, el.exec, el.cycle |
+| dom-helpers | 6.8KB | el.nearest, el.val, el.text, el.exec, el.cycle |
 | event-attrs | 4.6KB | [onclickaway], [onclickchildren], [onclone], [onpagemutation], [onrender] |
 | input-helpers | 3.9KB | [prevent-enter], [autosize] for textareas |
+| movable | 2.5KB | Free-positioning drag with [movable] and [movable-handle], edit mode only |
 | onaftersave | 1KB | [onaftersave] attribute - run JS when save status changes |
 | sortable | 3.4KB | Drag-drop sorting with [sortable], lazy-loads ~118KB Sortable.js in edit mode |
 
@@ -137,12 +138,12 @@ Essential features for basic editing
 
 **Modules:** `save-core`, `snapshot`, `save-system`, `edit-mode-helpers`, `toast`, `save-toast`, `export-to-window`, `view-mode-excludes-edit-modules`
 
-### Standard (~80.9KB)
+### Standard (~81.5KB)
 Standard feature set for most use cases
 
 **Modules:** `save-core`, `snapshot`, `save-system`, `unsaved-warning`, `edit-mode-helpers`, `persist`, `option-visibility`, `event-attrs`, `dom-helpers`, `toast`, `save-toast`, `export-to-window`, `view-mode-excludes-edit-modules`
 
-### Everything (~215.5KB)
+### Everything (~218.6KB)
 All available features
 
 Includes all available modules across all categories.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hyperclayjs",
-  "version": "1.21.0",
+  "version": "1.22.1",
   "description": "Modular JavaScript library for building interactive malleable HTML files with Hyperclay",
   "type": "module",
   "main": "src/hyperclay.js",

package/src/custom-attributes/domHelpers.js

@@ -8,7 +8,23 @@ function init () {
     return;
   }
 
+  // elem.el.menu returns nearest element with a "menu" attribute (alias for elem.nearest.menu)
   // elem.nearest.project returns nearest element with a "project" attribute
+  Object.defineProperty(HTMLElement.prototype, 'el', {
+    configurable: true,
+    get: function() {
+      let element = this;
+
+      const handler = {
+        get(target, prop) {
+          return nearest(element, `[${prop}], .${prop}`);
+        }
+      };
+
+      return new Proxy({}, handler);
+    }
+  });
+
   Object.defineProperty(HTMLElement.prototype, 'nearest', {
     configurable: true,
     get: function() {
@@ -183,6 +199,16 @@ function init () {
     if (next) this.setAttribute(setAttr, next);
   };
 
+  Element.prototype.show = function() {
+    this.style.display = '';
+    return this;
+  };
+
+  Element.prototype.hide = function() {
+    this.style.display = 'none';
+    return this;
+  };
+
 }
 
 // Auto-export to window unless suppressed by loader

package/src/hyperclay.js

@@ -1,7 +1,7 @@
 /**
  * DO NOT EDIT THIS FILE DIRECTLY — it is generated from build/hyperclay.template.js
  *
- * HyperclayJS v1.21.0 - Minimal Browser-Native Loader
+ * HyperclayJS v1.22.1 - Minimal Browser-Native Loader
  *
  * Modules auto-init when imported (no separate init call needed).
  * Include `export-to-window` feature to export to window.hyperclay.
@@ -40,6 +40,7 @@ const MODULE_PATHS = {
   "event-attrs": "./custom-attributes/events.js",
   "ajax-elements": "./custom-attributes/ajaxElements.js",
   "sortable": "./custom-attributes/sortable.js",
+  "movable": "./custom-attributes/movable.js",
   "dom-helpers": "./custom-attributes/domHelpers.js",
   "input-helpers": "./custom-attributes/inputHelpers.js",
   "onaftersave": "./custom-attributes/onaftersave.js",
@@ -119,6 +120,7 @@ const PRESETS = {
       "event-attrs",
       "ajax-elements",
       "sortable",
+      "movable",
       "dom-helpers",
       "input-helpers",
       "onaftersave",
@@ -162,6 +164,7 @@ const PRESETS = {
       "event-attrs",
       "ajax-elements",
       "sortable",
+      "movable",
       "dom-helpers",
       "input-helpers",
       "onaftersave",
@@ -203,6 +206,7 @@ const EDIT_MODE_ONLY = new Set([
   "persist",
   "snapshot",
   "sortable",
+  "movable",
   "onaftersave",
   "cache-bust",
   "hyper-morph",