nodality 1.0.138 → 1.0.140

package/layout/animator.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */
@@ -169,11 +169,12 @@ class Animator {
 */
 
   // Map of obj keys → style properties
+  // Extended 2026-04-27 — first-class CSS props so callers don't need keySet.
+  // Categories: positioning, flex-item, grid, typography, shadows/effects,
+  // overflow, sizing, pointer/selection.
     const styleMap = {
+        // ── Typography / sizing (pre-existing) ─────────────────────────
         exact: "fontSize",
-        zIndex: "zIndex",
-        position: "position",
-        top: "top",
         cursor: "cursor",
         width: "width",
         maxWidth: "maxWidth",
@@ -183,9 +184,67 @@ class Animator {
         lineHeight: "lineHeight",
         background: "background",
         font: "fontFamily",
-		opacity: "opacity",
-		gap: "gap",
-		minHeight: "minHeight"
+        opacity: "opacity",
+        gap: "gap",
+        minHeight: "minHeight",
+
+        // ── Positioning ────────────────────────────────────────────────
+        position: "position",
+        inset: "inset",
+        top: "top",
+        right: "right",
+        bottom: "bottom",
+        left: "left",
+        zIndex: "zIndex",
+
+        // ── Flex item / wrapping ───────────────────────────────────────
+        flex: "flex",
+        flexShrink: "flexShrink",
+        flexGrow: "flexGrow",
+        flexBasis: "flexBasis",
+        flexWrap: "flexWrap",
+        alignSelf: "alignSelf",
+        // `display` accepts any value: "inline-flex", "grid", "block", etc.
+        display: "display",
+
+        // ── Grid ───────────────────────────────────────────────────────
+        gridTemplateColumns: "gridTemplateColumns",
+        gridTemplateRows: "gridTemplateRows",
+        rowGap: "rowGap",
+        columnGap: "columnGap",
+
+        // ── Typography (extended) ──────────────────────────────────────
+        letterSpacing: "letterSpacing",
+        textTransform: "textTransform",
+        whiteSpace: "whiteSpace",
+
+        // ── Shadows / effects ──────────────────────────────────────────
+        boxShadow: "boxShadow",
+        backdropFilter: "backdropFilter",
+        WebkitBackdropFilter: "WebkitBackdropFilter",
+
+        // ── Overflow ───────────────────────────────────────────────────
+        overflow: "overflow",
+        overflowX: "overflowX",
+        overflowY: "overflowY",
+        WebkitOverflowScrolling: "WebkitOverflowScrolling",
+        WebkitTapHighlightColor: "WebkitTapHighlightColor",
+
+        // ── Sizing (extended) ──────────────────────────────────────────
+        minWidth: "minWidth",
+        boxSizing: "boxSizing",
+
+        // ── Pointer / selection ────────────────────────────────────────
+        pointerEvents: "pointerEvents",
+        userSelect: "userSelect",
+        WebkitUserSelect: "WebkitUserSelect",
+
+        // ── Convenience extras ─────────────────────────────────────────
+        // textAlign here lets non-Text classes (Wrapper, FlexRow) align
+        // child text without falling through to keySet. Text already
+        // exposes `align` separately.
+        textAlign: "textAlign",
+        transition: "transition",
     };
 
     // Apply styles safely
@@ -194,6 +253,14 @@ class Animator {
             this.res.style[styleMap[key]] = obj[key];
         }
     }
+
+    // `transform` is overloaded: a string is a plain CSS transform, an
+    // object is a Nodality animation descriptor handled by reactOnTransform
+    // (called further below). Strings are applied here so they reach the
+    // DOM without going through the animation system.
+    if (typeof obj.transform === "string") {
+        this.res.style.transform = obj.transform;
+    }
 //alert(obj.respad);
     // Special methods
     obj.pad && this.pad(obj.pad);
@@ -207,7 +274,9 @@ class Animator {
     obj.noTheme && (this._noTheme = true);
     obj.theme && this.theme(obj.theme);
     obj.hide && this.isHidden(obj.hide);
-	obj.transform && this.reactOnTransform(obj.transform);
+	// Only route to the animation system for object-shaped transforms.
+	// String transforms are applied above via the styleMap path.
+	(obj.transform && typeof obj.transform === "object") && this.reactOnTransform(obj.transform);
 
 	(obj.opacity !== undefined) && (this.res.style.opacity = obj.opacity);
 

package/layout/audio.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/audionew.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/base-2.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/base.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/beta-desktop-bar.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/beta-mobile-bar.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/box.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/button.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/cards.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/center.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/checkbox.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/circle.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/clean-row.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/code.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */
@@ -55,7 +55,8 @@ class Code extends Animator {
 
 		let arr = [];
 
-		if (obj.stroke || obj.gradient || obj.span || obj.backgroundOp || obj.layout || obj.shadow || obj.animation || obj.filtera || obj.transform){
+		const _hasAnimTransform = obj.transform && typeof obj.transform === "object";
+		if (obj.stroke || obj.gradient || obj.span || obj.backgroundOp || obj.layout || obj.shadow || obj.animation || obj.filtera || _hasAnimTransform){
 			if (obj.gradient){
 				this.globalGradient = obj.gradient.op.gradient;
 			
@@ -74,7 +75,7 @@ class Code extends Animator {
 			}
 
 
-			let ft = [obj.stroke, obj.gradient, obj.animation, obj.span, obj.backgroundOp, obj.layout, obj.marginOp, obj.shadow, /*obj.animation || obj.filtera*/obj.animation, obj.filtera, obj.transform];
+			let ft = [obj.stroke, obj.gradient, obj.animation, obj.span, obj.backgroundOp, obj.layout, obj.marginOp, obj.shadow, /*obj.animation || obj.filtera*/obj.animation, obj.filtera, _hasAnimTransform ? obj.transform : undefined];
 			ft = ft.filter(el => el != undefined);
 
 		

package/layout/container.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */
@@ -175,7 +175,10 @@ code = `${pad}new Wrapper()`;
 
 		let arr = [];
 
-		if (obj.stroke || obj.gradient || obj.span || obj.backgroundOp || obj.layout || obj.shadow || obj.animation || obj.filtera || obj.transform){
+		// Plain CSS string transforms are handled by commonMethods. Only
+		// object-shaped transform descriptors enter the animation pipeline.
+		const _hasAnimTransform = obj.transform && typeof obj.transform === "object";
+		if (obj.stroke || obj.gradient || obj.span || obj.backgroundOp || obj.layout || obj.shadow || obj.animation || obj.filtera || _hasAnimTransform){
 			if (obj.gradient){
 				this.globalGradient = obj.gradient.op.gradient;
 			if (obj.gradient.op.direction === "radial") {
@@ -183,7 +186,7 @@ code = `${pad}new Wrapper()`;
 				}
 			}
 
-		
+
 			if (obj.stroke){
 				super.setAny({globalBlast: `${obj.stroke.op.width} ${obj.stroke.op.color}`});
 			}
@@ -193,7 +196,7 @@ code = `${pad}new Wrapper()`;
 			}
 
 
-			let ft = [obj.stroke, obj.gradient, obj.animation, obj.span, obj.backgroundOp, obj.layout, obj.marginOp, obj.shadow, /*obj.animation || obj.filtera*/obj.animation, obj.filtera, obj.transform];
+			let ft = [obj.stroke, obj.gradient, obj.animation, obj.span, obj.backgroundOp, obj.layout, obj.marginOp, obj.shadow, /*obj.animation || obj.filtera*/obj.animation, obj.filtera, _hasAnimTransform ? obj.transform : undefined];
 			ft = ft.filter(el => el != undefined);
 
 		
@@ -229,7 +232,7 @@ code = `${pad}new Wrapper()`;
 			keep.push("span");
 		}
 
-		if (obj.transform){
+		if (_hasAnimTransform){
 			keep.push("transform");
 		}
 
@@ -309,7 +312,9 @@ code = `${pad}new Wrapper()`;
 		obj.width && (stra += `\n width: "${obj.width}",`);	
 
 
-		obj.overflow && (this.res.style.overflow = "hidden");
+		// Overflow is handled by commonMethods (styleMap) — it now respects
+		// the actual value (visible / hidden / auto / scroll / clip), not
+		// just hard-coded "hidden". Kept here only for codegen output.
 		obj.overflow && (stra += `\n overflow: "${obj.overflow}",`);
 
 		obj.height && this.heightNoAuto(obj.height);
@@ -369,7 +374,9 @@ code = `${pad}new Wrapper()`;
 
 		obj.zIndex && (this.res.style.zIndex = obj.zIndex);
 	
-		obj.transform && this.reactOnTransform(obj.transform); 
+		// String transforms are handled by commonMethods. Only object-shaped
+		// transform descriptors (with .op / .transform) go to the animation system.
+		(obj.transform && typeof obj.transform === "object") && this.reactOnTransform(obj.transform);
 		// obj.makeResponsiveBehaviour && obj.makeResponsiveBehaviour !== "undefined" && this.makeResponsiveBehaviour(obj.makeResponsiveBehaviour);
 		obj.name && (this.name = obj.name)
 		obj.responsive && this.rsp(obj.responsive);

package/layout/custom.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/div-image.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/dropdown-2025.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/dropdown.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/empty-element.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/external-stylesheet.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/flex-card.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/flex-grid.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */
@@ -100,7 +100,8 @@ class FlexGrid extends Animator {
 
 		let arr = [];
 
-		if (obj.stroke || obj.gradient || obj.span || obj.backgroundOp || obj.layout || obj.shadow || obj.animation || obj.filtera || obj.transform){
+		const _hasAnimTransform = obj.transform && typeof obj.transform === "object";
+		if (obj.stroke || obj.gradient || obj.span || obj.backgroundOp || obj.layout || obj.shadow || obj.animation || obj.filtera || _hasAnimTransform){
 			if (obj.gradient){
 				this.globalGradient = obj.gradient.op.gradient;
 			
@@ -119,7 +120,7 @@ class FlexGrid extends Animator {
 			}
 
 
-			let ft = [obj.stroke, obj.gradient, obj.animation, obj.span, obj.backgroundOp, obj.layout, obj.marginOp, obj.shadow, /*obj.animation || obj.filtera*/obj.animation, obj.filtera, obj.transform];
+			let ft = [obj.stroke, obj.gradient, obj.animation, obj.span, obj.backgroundOp, obj.layout, obj.marginOp, obj.shadow, /*obj.animation || obj.filtera*/obj.animation, obj.filtera, _hasAnimTransform ? obj.transform : undefined];
 			ft = ft.filter(el => el != undefined);
 
 		

package/layout/flex-row.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */
@@ -345,7 +345,10 @@ let stringified = JSON.stringify(options.borderObj);
 
 		let arr = [];
 
-		if (obj.stroke || obj.gradient || obj.span || obj.backgroundOp || obj.layout || obj.shadow || obj.animation || obj.filtera || obj.transform){
+		// String transforms are plain CSS — handled by commonMethods. Only
+		// object-shaped transforms (animation descriptors with .op) belong here.
+		const _hasAnimTransform = obj.transform && typeof obj.transform === "object";
+		if (obj.stroke || obj.gradient || obj.span || obj.backgroundOp || obj.layout || obj.shadow || obj.animation || obj.filtera || _hasAnimTransform){
 			if (obj.gradient){
 				this.globalGradient = obj.gradient.op.gradient;
 		
@@ -364,7 +367,7 @@ let stringified = JSON.stringify(options.borderObj);
 			}
 
 
-			let ft = [obj.stroke, obj.gradient, obj.animation, obj.span, obj.backgroundOp, obj.layout, obj.marginOp, obj.shadow, /*obj.animation || obj.filtera*/obj.animation, obj.filtera, obj.transform];
+			let ft = [obj.stroke, obj.gradient, obj.animation, obj.span, obj.backgroundOp, obj.layout, obj.marginOp, obj.shadow, /*obj.animation || obj.filtera*/obj.animation, obj.filtera, _hasAnimTransform ? obj.transform : undefined];
 			ft = ft.filter(el => el != undefined);
 
 		

package/layout/footer.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/form-components/custom.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/form-components/data-list.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/form-components/floating-input.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/form-components/form-all.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/form-components/form.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/form-components/image-picker.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/form-components/picker.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/form-components/radio.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/form-components/radiogroup.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/form-components/range.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/free.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/grid-new.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/grid-switcher.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/grid.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/group.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/header.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/horizontal-scroller.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/image-old.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/image.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/index.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/label.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/link.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/list-OLD.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/list.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/meta-adder.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */

package/layout/modal-2025.js

@@ -1,5 +1,5 @@
 /*!
- * nodality v1.0.138
+ * nodality v1.0.140
  * (c) 2026 Filip Vabrousek
  * License: MIT
  */