npm - @adamjanicki/ui - Versions diffs - 1.7.0 → 1.7.1 - Mend

@adamjanicki/ui 1.7.0 → 1.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2) hide show

package/package.json +1 -1
package/utils/transformVfx.js +102 -91

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@adamjanicki/ui",
-  "version": "1.7.0",
+  "version": "1.7.1",
   "description": "Basic UI components and hooks for React in TypeScript",
   "type": "module",
   "main": "./index.js",

package/utils/transformVfx.js CHANGED Viewed

@@ -1,186 +1,194 @@
 var transformers = {
     // --- Layout ---
-    pos: function (classes, _a) {
+    pos: function (_a) {
         var pos = _a.pos;
-        return classes.push("aui-pos-".concat(pos));
+        return "aui-pos-".concat(pos);
     },
-    axis: function (classes, _a) {
+    axis: function (_a) {
         var axis = _a.axis;
-        return classes.push("aui-flex-".concat(axis));
+        return "aui-flex-".concat(axis);
     },
-    gap: function (classes, _a) {
+    gap: function (_a) {
         var gap = _a.gap;
-        return classes.push("aui-gap-".concat(gap));
+        return "aui-gap-".concat(gap);
     },
-    align: function (classes, _a) {
+    align: function (_a) {
         var align = _a.align;
-        return classes.push("aui-align-".concat(align));
+        return "aui-align-".concat(align);
     },
-    justify: function (classes, _a) {
+    justify: function (_a) {
         var justify = _a.justify;
-        return classes.push("aui-justify-".concat(justify));
+        return "aui-justify-".concat(justify);
     },
-    wrap: function (classes) { return classes.push("aui-flex-wrap"); },
-    overflow: function (classes, _a) {
+    wrap: function () { return "aui-flex-wrap"; },
+    overflow: function (_a) {
         var overflow = _a.overflow;
-        return classes.push("aui-ov-".concat(overflow));
+        return "aui-ov-".concat(overflow);
     },
-    overflowX: function (classes, _a) {
+    overflowX: function (_a) {
         var overflowX = _a.overflowX;
-        return classes.push("aui-ov-x-".concat(overflowX));
+        return "aui-ov-x-".concat(overflowX);
     },
-    overflowY: function (classes, _a) {
+    overflowY: function (_a) {
         var overflowY = _a.overflowY;
-        return classes.push("aui-ov-y-".concat(overflowY));
+        return "aui-ov-y-".concat(overflowY);
     },
-    z: function (classes, _a) {
+    z: function (_a) {
         var z = _a.z;
-        return classes.push("aui-z-".concat(z));
+        return "aui-z-".concat(z);
     },
     // --- Spacing ---
-    padding: function (classes, _a) {
+    padding: function (_a) {
         var padding = _a.padding;
-        return classes.push("aui-pa-".concat(padding));
+        return "aui-pa-".concat(padding);
     },
-    paddingX: function (classes, _a) {
+    paddingX: function (_a) {
         var paddingX = _a.paddingX, paddingLeft = _a.paddingLeft, paddingRight = _a.paddingRight;
+        var result = [];
         if (!paddingLeft)
-            classes.push("aui-pl-".concat(paddingX));
+            result.push("aui-pl-".concat(paddingX));
         if (!paddingRight)
-            classes.push("aui-pr-".concat(paddingX));
+            result.push("aui-pr-".concat(paddingX));
+        return result.join(" ");
     },
-    paddingY: function (classes, _a) {
+    paddingY: function (_a) {
         var paddingY = _a.paddingY, paddingTop = _a.paddingTop, paddingBottom = _a.paddingBottom;
+        var result = [];
         if (!paddingTop)
-            classes.push("aui-pt-".concat(paddingY));
+            result.push("aui-pt-".concat(paddingY));
         if (!paddingBottom)
-            classes.push("aui-pb-".concat(paddingY));
+            result.push("aui-pb-".concat(paddingY));
+        return result.join(" ");
     },
-    paddingTop: function (classes, _a) {
+    paddingTop: function (_a) {
         var paddingTop = _a.paddingTop;
-        return classes.push("aui-pt-".concat(paddingTop));
+        return "aui-pt-".concat(paddingTop);
     },
-    paddingBottom: function (classes, _a) {
+    paddingBottom: function (_a) {
         var paddingBottom = _a.paddingBottom;
-        return classes.push("aui-pb-".concat(paddingBottom));
+        return "aui-pb-".concat(paddingBottom);
     },
-    paddingLeft: function (classes, _a) {
+    paddingLeft: function (_a) {
         var paddingLeft = _a.paddingLeft;
-        return classes.push("aui-pl-".concat(paddingLeft));
+        return "aui-pl-".concat(paddingLeft);
     },
-    paddingRight: function (classes, _a) {
+    paddingRight: function (_a) {
         var paddingRight = _a.paddingRight;
-        return classes.push("aui-pr-".concat(paddingRight));
+        return "aui-pr-".concat(paddingRight);
     },
-    margin: function (classes, _a) {
+    margin: function (_a) {
         var margin = _a.margin;
-        return classes.push("aui-ma-".concat(margin));
+        return "aui-ma-".concat(margin);
     },
-    marginX: function (classes, _a) {
+    marginX: function (_a) {
         var marginX = _a.marginX, marginLeft = _a.marginLeft, marginRight = _a.marginRight;
+        var result = [];
         if (!marginLeft)
-            classes.push("aui-ml-".concat(marginX));
+            result.push("aui-ml-".concat(marginX));
         if (!marginRight)
-            classes.push("aui-mr-".concat(marginX));
+            result.push("aui-mr-".concat(marginX));
+        return result.join(" ");
     },
-    marginY: function (classes, _a) {
+    marginY: function (_a) {
         var marginY = _a.marginY, marginTop = _a.marginTop, marginBottom = _a.marginBottom;
+        var result = [];
         if (!marginTop)
-            classes.push("aui-mt-".concat(marginY));
+            result.push("aui-mt-".concat(marginY));
         if (!marginBottom)
-            classes.push("aui-mb-".concat(marginY));
+            result.push("aui-mb-".concat(marginY));
+        return result.join(" ");
     },
-    marginTop: function (classes, _a) {
+    marginTop: function (_a) {
         var marginTop = _a.marginTop;
-        return classes.push("aui-mt-".concat(marginTop));
+        return "aui-mt-".concat(marginTop);
     },
-    marginBottom: function (classes, _a) {
+    marginBottom: function (_a) {
         var marginBottom = _a.marginBottom;
-        return classes.push("aui-mb-".concat(marginBottom));
+        return "aui-mb-".concat(marginBottom);
     },
-    marginLeft: function (classes, _a) {
+    marginLeft: function (_a) {
         var marginLeft = _a.marginLeft;
-        return classes.push("aui-ml-".concat(marginLeft));
+        return "aui-ml-".concat(marginLeft);
     },
-    marginRight: function (classes, _a) {
+    marginRight: function (_a) {
         var marginRight = _a.marginRight;
-        return classes.push("aui-mr-".concat(marginRight));
+        return "aui-mr-".concat(marginRight);
     },
     // --- Dimensions ---
-    width: function (classes, _a) {
+    width: function (_a) {
         var width = _a.width;
-        return classes.push("aui-w-".concat(width));
+        return "aui-w-".concat(width);
     },
-    maxWidth: function (classes, _a) {
+    maxWidth: function (_a) {
         var maxWidth = _a.maxWidth;
-        return classes.push("aui-mw-".concat(maxWidth));
+        return "aui-mw-".concat(maxWidth);
     },
-    height: function (classes, _a) {
+    height: function (_a) {
         var height = _a.height;
-        return classes.push("aui-h-".concat(height));
+        return "aui-h-".concat(height);
     },
-    maxHeight: function (classes, _a) {
+    maxHeight: function (_a) {
         var maxHeight = _a.maxHeight;
-        return classes.push("aui-mh-".concat(maxHeight));
+        return "aui-mh-".concat(maxHeight);
     },
     // --- Borders ---
-    radius: function (classes, _a) {
+    radius: function (_a) {
         var radius = _a.radius;
-        return classes.push("aui-radius-".concat(radius));
-    },
-    border: function (classes) { return classes.push("aui-ba"); },
-    borderTop: function (classes) { return classes.push("aui-bt"); },
-    borderBottom: function (classes) { return classes.push("aui-bb"); },
-    borderLeft: function (classes) { return classes.push("aui-bl"); },
-    borderRight: function (classes) { return classes.push("aui-br"); },
-    borderWidth: function (classes, _a) {
+        return "aui-radius-".concat(radius);
+    },
+    border: function () { return "aui-ba"; },
+    borderTop: function () { return "aui-bt"; },
+    borderBottom: function () { return "aui-bb"; },
+    borderLeft: function () { return "aui-bl"; },
+    borderRight: function () { return "aui-br"; },
+    borderWidth: function (_a) {
         var borderWidth = _a.borderWidth;
-        return classes.push("aui-bw-".concat(borderWidth));
+        return "aui-bw-".concat(borderWidth);
     },
-    borderStyle: function (classes, _a) {
+    borderStyle: function (_a) {
         var borderStyle = _a.borderStyle;
-        return classes.push("aui-bs-".concat(borderStyle));
+        return "aui-bs-".concat(borderStyle);
     },
-    borderColor: function (classes, _a) {
+    borderColor: function (_a) {
         var borderColor = _a.borderColor;
-        return classes.push("aui-bc-".concat(borderColor));
+        return "aui-bc-".concat(borderColor);
     },
     // --- Effects ---
-    shadow: function (classes, _a) {
+    shadow: function (_a) {
         var shadow = _a.shadow;
-        return classes.push("aui-shadow-".concat(shadow));
+        return "aui-shadow-".concat(shadow);
     },
-    opacity: function (classes, _a) {
+    opacity: function (_a) {
         var opacity = _a.opacity;
-        return classes.push("aui-op-".concat(opacity));
+        return "aui-op-".concat(opacity);
     },
     // --- Typography ---
-    fontSize: function (classes, _a) {
+    fontSize: function (_a) {
         var fontSize = _a.fontSize;
-        return classes.push("aui-f-".concat(fontSize));
+        return "aui-f-".concat(fontSize);
     },
-    fontWeight: function (classes, _a) {
+    fontWeight: function (_a) {
         var fontWeight = _a.fontWeight;
-        return classes.push("aui-fw-".concat(fontWeight));
+        return "aui-fw-".concat(fontWeight);
     },
-    textAlign: function (classes, _a) {
+    textAlign: function (_a) {
         var textAlign = _a.textAlign;
-        return classes.push("aui-ta-".concat(textAlign));
+        return "aui-ta-".concat(textAlign);
     },
-    italics: function (classes) { return classes.push("aui-it"); },
+    italics: function () { return "aui-it"; },
     // --- Colors ---
-    color: function (classes, _a) {
+    color: function (_a) {
         var color = _a.color;
-        return classes.push("aui-c-".concat(color));
+        return "aui-c-".concat(color);
     },
-    backgroundColor: function (classes, _a) {
+    backgroundColor: function (_a) {
         var backgroundColor = _a.backgroundColor;
-        return classes.push("aui-bg-".concat(backgroundColor));
+        return "aui-bg-".concat(backgroundColor);
     },
     // --- Misc ---
-    cursor: function (classes, _a) {
+    cursor: function (_a) {
         var cursor = _a.cursor;
-        return classes.push("aui-cursor-".concat(cursor));
+        return "aui-cur-".concat(cursor);
     },
 };
 // Main function
@@ -190,7 +198,10 @@ export default function transformVfx(vfx) {
     var classes = [];
     for (var key in vfx) {
         var transformer = transformers[key];
-        transformer(classes, vfx);
+        var result = transformer(vfx);
+        if (result) {
+            classes.push(result);
+        }
     }
     return classes.join(" ") || null;
 }