@adamjanicki/ui 1.6.9 → 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
  1. package/package.json +1 -1
  2. package/utils/transformVfx.js +199 -97
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adamjanicki/ui",
3
- "version": "1.6.9",
3
+ "version": "1.7.1",
4
4
  "description": "Basic UI components and hooks for React in TypeScript",
5
5
  "type": "module",
6
6
  "main": "./index.js",
package/utils/transformVfx.js CHANGED
@@ -1,105 +1,207 @@
1
- export default function transformVfx(vfx) {
2
- if (!vfx)
3
- return null;
4
- var pos = vfx.pos, axis = vfx.axis, wrap = vfx.wrap, align = vfx.align, justify = vfx.justify, gap = vfx.gap, overflow = vfx.overflow, overflowX = vfx.overflowX, overflowY = vfx.overflowY, z = vfx.z, padding = vfx.padding, paddingX = vfx.paddingX, paddingY = vfx.paddingY, paddingTop = vfx.paddingTop, paddingBottom = vfx.paddingBottom, paddingLeft = vfx.paddingLeft, paddingRight = vfx.paddingRight, margin = vfx.margin, marginX = vfx.marginX, marginY = vfx.marginY, marginTop = vfx.marginTop, marginBottom = vfx.marginBottom, marginLeft = vfx.marginLeft, marginRight = vfx.marginRight, width = vfx.width, height = vfx.height, maxWidth = vfx.maxWidth, maxHeight = vfx.maxHeight, border = vfx.border, borderTop = vfx.borderTop, borderBottom = vfx.borderBottom, borderRight = vfx.borderRight, borderLeft = vfx.borderLeft, borderColor = vfx.borderColor, borderStyle = vfx.borderStyle, borderWidth = vfx.borderWidth, fontSize = vfx.fontSize, fontWeight = vfx.fontWeight, textAlign = vfx.textAlign, italics = vfx.italics, radius = vfx.radius, shadow = vfx.shadow, color = vfx.color, backgroundColor = vfx.backgroundColor, opacity = vfx.opacity, cursor = vfx.cursor;
5
- var classes = [];
1
+ var transformers = {
6
2
  // --- Layout ---
7
- if (pos)
8
- classes.push("aui-pos-".concat(pos));
9
- if (axis)
10
- classes.push("aui-flex-".concat(axis));
11
- if (wrap)
12
- classes.push("aui-flex-wrap");
13
- if (align)
14
- classes.push("aui-align-".concat(align));
15
- if (justify)
16
- classes.push("aui-justify-".concat(justify));
17
- if (gap)
18
- classes.push("aui-gap-".concat(gap));
19
- if (overflow)
20
- classes.push("aui-ov-".concat(overflow));
21
- if (overflowX)
22
- classes.push("aui-ov-x-".concat(overflowX));
23
- if (overflowY)
24
- classes.push("aui-ov-y-".concat(overflowY));
25
- if (z)
26
- classes.push("aui-z-".concat(z));
3
+ pos: function (_a) {
4
+ var pos = _a.pos;
5
+ return "aui-pos-".concat(pos);
6
+ },
7
+ axis: function (_a) {
8
+ var axis = _a.axis;
9
+ return "aui-flex-".concat(axis);
10
+ },
11
+ gap: function (_a) {
12
+ var gap = _a.gap;
13
+ return "aui-gap-".concat(gap);
14
+ },
15
+ align: function (_a) {
16
+ var align = _a.align;
17
+ return "aui-align-".concat(align);
18
+ },
19
+ justify: function (_a) {
20
+ var justify = _a.justify;
21
+ return "aui-justify-".concat(justify);
22
+ },
23
+ wrap: function () { return "aui-flex-wrap"; },
24
+ overflow: function (_a) {
25
+ var overflow = _a.overflow;
26
+ return "aui-ov-".concat(overflow);
27
+ },
28
+ overflowX: function (_a) {
29
+ var overflowX = _a.overflowX;
30
+ return "aui-ov-x-".concat(overflowX);
31
+ },
32
+ overflowY: function (_a) {
33
+ var overflowY = _a.overflowY;
34
+ return "aui-ov-y-".concat(overflowY);
35
+ },
36
+ z: function (_a) {
37
+ var z = _a.z;
38
+ return "aui-z-".concat(z);
39
+ },
27
40
  // --- Spacing ---
28
- var pt = paddingTop !== null && paddingTop !== void 0 ? paddingTop : paddingY;
29
- var pb = paddingBottom !== null && paddingBottom !== void 0 ? paddingBottom : paddingY;
30
- var pl = paddingLeft !== null && paddingLeft !== void 0 ? paddingLeft : paddingX;
31
- var pr = paddingRight !== null && paddingRight !== void 0 ? paddingRight : paddingX;
32
- var mt = marginTop !== null && marginTop !== void 0 ? marginTop : marginY;
33
- var mb = marginBottom !== null && marginBottom !== void 0 ? marginBottom : marginY;
34
- var ml = marginLeft !== null && marginLeft !== void 0 ? marginLeft : marginX;
35
- var mr = marginRight !== null && marginRight !== void 0 ? marginRight : marginX;
36
- if (padding)
37
- classes.push("aui-pa-".concat(padding));
38
- if (pt)
39
- classes.push("aui-pt-".concat(pt));
40
- if (pb)
41
- classes.push("aui-pb-".concat(pb));
42
- if (pl)
43
- classes.push("aui-pl-".concat(pl));
44
- if (pr)
45
- classes.push("aui-pr-".concat(pr));
46
- if (margin)
47
- classes.push("aui-ma-".concat(margin));
48
- if (mt)
49
- classes.push("aui-mt-".concat(mt));
50
- if (mb)
51
- classes.push("aui-mb-".concat(mb));
52
- if (ml)
53
- classes.push("aui-ml-".concat(ml));
54
- if (mr)
55
- classes.push("aui-mr-".concat(mr));
41
+ padding: function (_a) {
42
+ var padding = _a.padding;
43
+ return "aui-pa-".concat(padding);
44
+ },
45
+ paddingX: function (_a) {
46
+ var paddingX = _a.paddingX, paddingLeft = _a.paddingLeft, paddingRight = _a.paddingRight;
47
+ var result = [];
48
+ if (!paddingLeft)
49
+ result.push("aui-pl-".concat(paddingX));
50
+ if (!paddingRight)
51
+ result.push("aui-pr-".concat(paddingX));
52
+ return result.join(" ");
53
+ },
54
+ paddingY: function (_a) {
55
+ var paddingY = _a.paddingY, paddingTop = _a.paddingTop, paddingBottom = _a.paddingBottom;
56
+ var result = [];
57
+ if (!paddingTop)
58
+ result.push("aui-pt-".concat(paddingY));
59
+ if (!paddingBottom)
60
+ result.push("aui-pb-".concat(paddingY));
61
+ return result.join(" ");
62
+ },
63
+ paddingTop: function (_a) {
64
+ var paddingTop = _a.paddingTop;
65
+ return "aui-pt-".concat(paddingTop);
66
+ },
67
+ paddingBottom: function (_a) {
68
+ var paddingBottom = _a.paddingBottom;
69
+ return "aui-pb-".concat(paddingBottom);
70
+ },
71
+ paddingLeft: function (_a) {
72
+ var paddingLeft = _a.paddingLeft;
73
+ return "aui-pl-".concat(paddingLeft);
74
+ },
75
+ paddingRight: function (_a) {
76
+ var paddingRight = _a.paddingRight;
77
+ return "aui-pr-".concat(paddingRight);
78
+ },
79
+ margin: function (_a) {
80
+ var margin = _a.margin;
81
+ return "aui-ma-".concat(margin);
82
+ },
83
+ marginX: function (_a) {
84
+ var marginX = _a.marginX, marginLeft = _a.marginLeft, marginRight = _a.marginRight;
85
+ var result = [];
86
+ if (!marginLeft)
87
+ result.push("aui-ml-".concat(marginX));
88
+ if (!marginRight)
89
+ result.push("aui-mr-".concat(marginX));
90
+ return result.join(" ");
91
+ },
92
+ marginY: function (_a) {
93
+ var marginY = _a.marginY, marginTop = _a.marginTop, marginBottom = _a.marginBottom;
94
+ var result = [];
95
+ if (!marginTop)
96
+ result.push("aui-mt-".concat(marginY));
97
+ if (!marginBottom)
98
+ result.push("aui-mb-".concat(marginY));
99
+ return result.join(" ");
100
+ },
101
+ marginTop: function (_a) {
102
+ var marginTop = _a.marginTop;
103
+ return "aui-mt-".concat(marginTop);
104
+ },
105
+ marginBottom: function (_a) {
106
+ var marginBottom = _a.marginBottom;
107
+ return "aui-mb-".concat(marginBottom);
108
+ },
109
+ marginLeft: function (_a) {
110
+ var marginLeft = _a.marginLeft;
111
+ return "aui-ml-".concat(marginLeft);
112
+ },
113
+ marginRight: function (_a) {
114
+ var marginRight = _a.marginRight;
115
+ return "aui-mr-".concat(marginRight);
116
+ },
56
117
  // --- Dimensions ---
57
- if (width)
58
- classes.push("aui-w-".concat(width));
59
- if (height)
60
- classes.push("aui-h-".concat(height));
61
- if (maxWidth)
62
- classes.push("aui-mw-".concat(maxWidth));
63
- if (maxHeight)
64
- classes.push("aui-mh-".concat(maxHeight));
118
+ width: function (_a) {
119
+ var width = _a.width;
120
+ return "aui-w-".concat(width);
121
+ },
122
+ maxWidth: function (_a) {
123
+ var maxWidth = _a.maxWidth;
124
+ return "aui-mw-".concat(maxWidth);
125
+ },
126
+ height: function (_a) {
127
+ var height = _a.height;
128
+ return "aui-h-".concat(height);
129
+ },
130
+ maxHeight: function (_a) {
131
+ var maxHeight = _a.maxHeight;
132
+ return "aui-mh-".concat(maxHeight);
133
+ },
65
134
  // --- Borders ---
66
- if (border)
67
- classes.push("aui-ba");
68
- if (borderTop)
69
- classes.push("aui-bt");
70
- if (borderBottom)
71
- classes.push("aui-bb");
72
- if (borderLeft)
73
- classes.push("aui-bl");
74
- if (borderRight)
75
- classes.push("aui-br");
76
- if (borderWidth)
77
- classes.push("aui-bw-".concat(borderWidth));
78
- if (borderStyle)
79
- classes.push("aui-bs-".concat(borderStyle));
80
- if (borderColor)
81
- classes.push("aui-bc-".concat(borderColor));
135
+ radius: function (_a) {
136
+ var radius = _a.radius;
137
+ return "aui-radius-".concat(radius);
138
+ },
139
+ border: function () { return "aui-ba"; },
140
+ borderTop: function () { return "aui-bt"; },
141
+ borderBottom: function () { return "aui-bb"; },
142
+ borderLeft: function () { return "aui-bl"; },
143
+ borderRight: function () { return "aui-br"; },
144
+ borderWidth: function (_a) {
145
+ var borderWidth = _a.borderWidth;
146
+ return "aui-bw-".concat(borderWidth);
147
+ },
148
+ borderStyle: function (_a) {
149
+ var borderStyle = _a.borderStyle;
150
+ return "aui-bs-".concat(borderStyle);
151
+ },
152
+ borderColor: function (_a) {
153
+ var borderColor = _a.borderColor;
154
+ return "aui-bc-".concat(borderColor);
155
+ },
156
+ // --- Effects ---
157
+ shadow: function (_a) {
158
+ var shadow = _a.shadow;
159
+ return "aui-shadow-".concat(shadow);
160
+ },
161
+ opacity: function (_a) {
162
+ var opacity = _a.opacity;
163
+ return "aui-op-".concat(opacity);
164
+ },
82
165
  // --- Typography ---
83
- if (fontSize)
84
- classes.push("aui-f-".concat(fontSize));
85
- if (fontWeight)
86
- classes.push("aui-fw-".concat(fontWeight));
87
- if (textAlign)
88
- classes.push("aui-ta-".concat(textAlign));
89
- if (italics)
90
- classes.push("aui-it");
166
+ fontSize: function (_a) {
167
+ var fontSize = _a.fontSize;
168
+ return "aui-f-".concat(fontSize);
169
+ },
170
+ fontWeight: function (_a) {
171
+ var fontWeight = _a.fontWeight;
172
+ return "aui-fw-".concat(fontWeight);
173
+ },
174
+ textAlign: function (_a) {
175
+ var textAlign = _a.textAlign;
176
+ return "aui-ta-".concat(textAlign);
177
+ },
178
+ italics: function () { return "aui-it"; },
179
+ // --- Colors ---
180
+ color: function (_a) {
181
+ var color = _a.color;
182
+ return "aui-c-".concat(color);
183
+ },
184
+ backgroundColor: function (_a) {
185
+ var backgroundColor = _a.backgroundColor;
186
+ return "aui-bg-".concat(backgroundColor);
187
+ },
91
188
  // --- Misc ---
92
- if (radius)
93
- classes.push("aui-radius-".concat(radius));
94
- if (shadow)
95
- classes.push("aui-shadow-".concat(shadow));
96
- if (color)
97
- classes.push("aui-c-".concat(color));
98
- if (backgroundColor)
99
- classes.push("aui-bg-".concat(backgroundColor));
100
- if (opacity)
101
- classes.push("aui-op-".concat(opacity));
102
- if (cursor)
103
- classes.push("aui-cur-".concat(cursor));
189
+ cursor: function (_a) {
190
+ var cursor = _a.cursor;
191
+ return "aui-cur-".concat(cursor);
192
+ },
193
+ };
194
+ // Main function
195
+ export default function transformVfx(vfx) {
196
+ if (!vfx)
197
+ return null;
198
+ var classes = [];
199
+ for (var key in vfx) {
200
+ var transformer = transformers[key];
201
+ var result = transformer(vfx);
202
+ if (result) {
203
+ classes.push(result);
204
+ }
205
+ }
104
206
  return classes.join(" ") || null;
105
207
  }