funuicss 3.7.14 → 3.7.15
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.
- package/css/fun.css +430 -0
- package/index.d.ts +1 -0
- package/index.js +3 -1
- package/package.json +1 -1
- package/ui/footer/Footer.d.ts +88 -0
- package/ui/footer/Footer.js +324 -0
- package/utils/componentUtils.d.ts +126 -19
- package/utils/componentUtils.js +994 -57
|
@@ -0,0 +1,324 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
'use client';
|
|
3
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
4
|
+
if (k2 === undefined) k2 = k;
|
|
5
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
6
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
7
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
8
|
+
}
|
|
9
|
+
Object.defineProperty(o, k2, desc);
|
|
10
|
+
}) : (function(o, m, k, k2) {
|
|
11
|
+
if (k2 === undefined) k2 = k;
|
|
12
|
+
o[k2] = m[k];
|
|
13
|
+
}));
|
|
14
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
15
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
16
|
+
}) : function(o, v) {
|
|
17
|
+
o["default"] = v;
|
|
18
|
+
});
|
|
19
|
+
var __importStar = (this && this.__importStar) || (function () {
|
|
20
|
+
var ownKeys = function(o) {
|
|
21
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
22
|
+
var ar = [];
|
|
23
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
24
|
+
return ar;
|
|
25
|
+
};
|
|
26
|
+
return ownKeys(o);
|
|
27
|
+
};
|
|
28
|
+
return function (mod) {
|
|
29
|
+
if (mod && mod.__esModule) return mod;
|
|
30
|
+
var result = {};
|
|
31
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
32
|
+
__setModuleDefault(result, mod);
|
|
33
|
+
return result;
|
|
34
|
+
};
|
|
35
|
+
})();
|
|
36
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
37
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
38
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
39
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
40
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
41
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
42
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
43
|
+
});
|
|
44
|
+
};
|
|
45
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
46
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
|
|
47
|
+
return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
48
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
49
|
+
function step(op) {
|
|
50
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
51
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
52
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
53
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
54
|
+
switch (op[0]) {
|
|
55
|
+
case 0: case 1: t = op; break;
|
|
56
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
57
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
58
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
59
|
+
default:
|
|
60
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
61
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
62
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
63
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
64
|
+
if (t[2]) _.ops.pop();
|
|
65
|
+
_.trys.pop(); continue;
|
|
66
|
+
}
|
|
67
|
+
op = body.call(thisArg, _);
|
|
68
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
69
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
70
|
+
}
|
|
71
|
+
};
|
|
72
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
73
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
74
|
+
if (ar || !(i in from)) {
|
|
75
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
76
|
+
ar[i] = from[i];
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
80
|
+
};
|
|
81
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
82
|
+
var react_1 = __importStar(require("react"));
|
|
83
|
+
var pi_1 = require("react-icons/pi");
|
|
84
|
+
var getDynamicIcon_1 = require("../../utils/getDynamicIcon");
|
|
85
|
+
var componentUtils_1 = require("../../utils/componentUtils");
|
|
86
|
+
var Footer = function (localProps) {
|
|
87
|
+
// Use component configuration with variant
|
|
88
|
+
var mergeWithLocal = (0, componentUtils_1.useComponentConfiguration)('Footer', localProps.variant).mergeWithLocal;
|
|
89
|
+
var final = mergeWithLocal(localProps).props;
|
|
90
|
+
var currentYear = final.year || new Date().getFullYear();
|
|
91
|
+
// State for dynamic icons
|
|
92
|
+
var _a = (0, react_1.useState)({}), loadedIcons = _a[0], setLoadedIcons = _a[1];
|
|
93
|
+
// Parse sections if it's a JSON string
|
|
94
|
+
var sections = react_1.default.useMemo(function () {
|
|
95
|
+
if (!final.sections)
|
|
96
|
+
return [];
|
|
97
|
+
if (typeof final.sections === 'string') {
|
|
98
|
+
try {
|
|
99
|
+
return JSON.parse(final.sections);
|
|
100
|
+
}
|
|
101
|
+
catch (e) {
|
|
102
|
+
console.error('Failed to parse sections JSON:', e);
|
|
103
|
+
return [];
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
return final.sections;
|
|
107
|
+
}, [final.sections]);
|
|
108
|
+
// Helper function to check if something is a React element
|
|
109
|
+
function isReactElement(node) {
|
|
110
|
+
return react_1.default.isValidElement(node);
|
|
111
|
+
}
|
|
112
|
+
// Load dynamic icons
|
|
113
|
+
(0, react_1.useEffect)(function () {
|
|
114
|
+
var iconsToLoad = {};
|
|
115
|
+
// Social icons
|
|
116
|
+
if (typeof final.facebookIcon === 'string')
|
|
117
|
+
iconsToLoad.facebook = final.facebookIcon;
|
|
118
|
+
if (typeof final.instagramIcon === 'string')
|
|
119
|
+
iconsToLoad.instagram = final.instagramIcon;
|
|
120
|
+
if (typeof final.twitterIcon === 'string')
|
|
121
|
+
iconsToLoad.twitter = final.twitterIcon;
|
|
122
|
+
if (typeof final.xIcon === 'string')
|
|
123
|
+
iconsToLoad.x = final.xIcon;
|
|
124
|
+
if (typeof final.youtubeIcon === 'string')
|
|
125
|
+
iconsToLoad.youtube = final.youtubeIcon;
|
|
126
|
+
if (typeof final.linkedinIcon === 'string')
|
|
127
|
+
iconsToLoad.linkedin = final.linkedinIcon;
|
|
128
|
+
if (typeof final.githubIcon === 'string')
|
|
129
|
+
iconsToLoad.github = final.githubIcon;
|
|
130
|
+
// Contact icons
|
|
131
|
+
if (typeof final.emailIcon === 'string')
|
|
132
|
+
iconsToLoad.email = final.emailIcon;
|
|
133
|
+
if (typeof final.phoneIcon === 'string')
|
|
134
|
+
iconsToLoad.phone = final.phoneIcon;
|
|
135
|
+
if (typeof final.addressIcon === 'string')
|
|
136
|
+
iconsToLoad.address = final.addressIcon;
|
|
137
|
+
// Social media object
|
|
138
|
+
if (final.socialMedia) {
|
|
139
|
+
Object.entries(final.socialMedia).forEach(function (_a) {
|
|
140
|
+
var key = _a[0], value = _a[1];
|
|
141
|
+
if (typeof value === 'string') {
|
|
142
|
+
iconsToLoad["socialMedia_".concat(key)] = value;
|
|
143
|
+
}
|
|
144
|
+
});
|
|
145
|
+
}
|
|
146
|
+
// Load all dynamic icons
|
|
147
|
+
var loadIcons = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
148
|
+
var loaded, _i, _a, _b, key, iconString, icon;
|
|
149
|
+
return __generator(this, function (_c) {
|
|
150
|
+
switch (_c.label) {
|
|
151
|
+
case 0:
|
|
152
|
+
loaded = {};
|
|
153
|
+
_i = 0, _a = Object.entries(iconsToLoad);
|
|
154
|
+
_c.label = 1;
|
|
155
|
+
case 1:
|
|
156
|
+
if (!(_i < _a.length)) return [3 /*break*/, 4];
|
|
157
|
+
_b = _a[_i], key = _b[0], iconString = _b[1];
|
|
158
|
+
return [4 /*yield*/, (0, getDynamicIcon_1.getDynamicIcon)(iconString)];
|
|
159
|
+
case 2:
|
|
160
|
+
icon = _c.sent();
|
|
161
|
+
if (icon) {
|
|
162
|
+
loaded[key] = icon;
|
|
163
|
+
}
|
|
164
|
+
_c.label = 3;
|
|
165
|
+
case 3:
|
|
166
|
+
_i++;
|
|
167
|
+
return [3 /*break*/, 1];
|
|
168
|
+
case 4:
|
|
169
|
+
setLoadedIcons(loaded);
|
|
170
|
+
return [2 /*return*/];
|
|
171
|
+
}
|
|
172
|
+
});
|
|
173
|
+
}); };
|
|
174
|
+
if (Object.keys(iconsToLoad).length > 0) {
|
|
175
|
+
loadIcons();
|
|
176
|
+
}
|
|
177
|
+
}, [final.facebookIcon, final.instagramIcon, final.twitterIcon, final.xIcon, final.youtubeIcon, final.linkedinIcon, final.githubIcon, final.emailIcon, final.phoneIcon, final.addressIcon, final.socialMedia]);
|
|
178
|
+
// Get icon - either from prop (ReactNode), dynamic loaded icon, or default
|
|
179
|
+
var getIcon = function (iconProp, iconKey, defaultIcon) {
|
|
180
|
+
if (isReactElement(iconProp)) {
|
|
181
|
+
return iconProp;
|
|
182
|
+
}
|
|
183
|
+
if (typeof iconProp === 'string' && loadedIcons[iconKey]) {
|
|
184
|
+
return loadedIcons[iconKey];
|
|
185
|
+
}
|
|
186
|
+
return defaultIcon;
|
|
187
|
+
};
|
|
188
|
+
// Build social links array
|
|
189
|
+
var socialLinks = react_1.default.useMemo(function () {
|
|
190
|
+
var links = [];
|
|
191
|
+
if (final.facebookUrl) {
|
|
192
|
+
links.push({
|
|
193
|
+
url: final.facebookUrl,
|
|
194
|
+
icon: getIcon(final.facebookIcon, 'facebook', react_1.default.createElement(pi_1.PiFacebookLogo, null)),
|
|
195
|
+
label: 'Facebook'
|
|
196
|
+
});
|
|
197
|
+
}
|
|
198
|
+
if (final.instagramUrl) {
|
|
199
|
+
links.push({
|
|
200
|
+
url: final.instagramUrl,
|
|
201
|
+
icon: getIcon(final.instagramIcon, 'instagram', react_1.default.createElement(pi_1.PiInstagramLogo, null)),
|
|
202
|
+
label: 'Instagram'
|
|
203
|
+
});
|
|
204
|
+
}
|
|
205
|
+
if (final.twitterUrl) {
|
|
206
|
+
links.push({
|
|
207
|
+
url: final.twitterUrl,
|
|
208
|
+
icon: getIcon(final.twitterIcon, 'twitter', react_1.default.createElement(pi_1.PiTwitterLogo, null)),
|
|
209
|
+
label: 'Twitter'
|
|
210
|
+
});
|
|
211
|
+
}
|
|
212
|
+
if (final.xUrl) {
|
|
213
|
+
links.push({
|
|
214
|
+
url: final.xUrl,
|
|
215
|
+
icon: getIcon(final.xIcon, 'x', react_1.default.createElement(pi_1.PiTwitterLogo, null)),
|
|
216
|
+
label: 'X'
|
|
217
|
+
});
|
|
218
|
+
}
|
|
219
|
+
if (final.youtubeUrl) {
|
|
220
|
+
links.push({
|
|
221
|
+
url: final.youtubeUrl,
|
|
222
|
+
icon: getIcon(final.youtubeIcon, 'youtube', react_1.default.createElement(pi_1.PiYoutubeLogo, null)),
|
|
223
|
+
label: 'YouTube'
|
|
224
|
+
});
|
|
225
|
+
}
|
|
226
|
+
if (final.linkedinUrl) {
|
|
227
|
+
links.push({
|
|
228
|
+
url: final.linkedinUrl,
|
|
229
|
+
icon: getIcon(final.linkedinIcon, 'linkedin', react_1.default.createElement(pi_1.PiLinkedinLogo, null)),
|
|
230
|
+
label: 'LinkedIn'
|
|
231
|
+
});
|
|
232
|
+
}
|
|
233
|
+
if (final.githubUrl) {
|
|
234
|
+
links.push({
|
|
235
|
+
url: final.githubUrl,
|
|
236
|
+
icon: getIcon(final.githubIcon, 'github', react_1.default.createElement(pi_1.PiGithubLogo, null)),
|
|
237
|
+
label: 'GitHub'
|
|
238
|
+
});
|
|
239
|
+
}
|
|
240
|
+
// Add socialMedia object links
|
|
241
|
+
if (final.socialMedia) {
|
|
242
|
+
Object.entries(final.socialMedia).forEach(function (_a) {
|
|
243
|
+
var key = _a[0], value = _a[1];
|
|
244
|
+
if (typeof value === 'string' && value.startsWith('http')) {
|
|
245
|
+
var iconKey = "socialMedia_".concat(key);
|
|
246
|
+
var icon = loadedIcons[iconKey] || react_1.default.createElement(pi_1.PiGithubLogo, null);
|
|
247
|
+
links.push({
|
|
248
|
+
url: value,
|
|
249
|
+
icon: icon,
|
|
250
|
+
label: key.charAt(0).toUpperCase() + key.slice(1)
|
|
251
|
+
});
|
|
252
|
+
}
|
|
253
|
+
});
|
|
254
|
+
}
|
|
255
|
+
return links;
|
|
256
|
+
}, [
|
|
257
|
+
final.facebookUrl, final.instagramUrl, final.twitterUrl, final.xUrl, final.youtubeUrl, final.linkedinUrl, final.githubUrl,
|
|
258
|
+
final.facebookIcon, final.instagramIcon, final.twitterIcon, final.xIcon, final.youtubeIcon, final.linkedinIcon, final.githubIcon,
|
|
259
|
+
final.socialMedia, loadedIcons
|
|
260
|
+
]);
|
|
261
|
+
var legalLinks = __spreadArray(__spreadArray(__spreadArray([], (final.privacyUrl ? [{ url: final.privacyUrl, text: final.privacyText }] : []), true), (final.termsUrl ? [{ url: final.termsUrl, text: final.termsText }] : []), true), (final.cookiesUrl ? [{ url: final.cookiesUrl, text: final.cookiesText }] : []), true);
|
|
262
|
+
var getCopyrightText = function () {
|
|
263
|
+
if (final.copyrightText)
|
|
264
|
+
return final.copyrightText;
|
|
265
|
+
var text = '';
|
|
266
|
+
if (final.showYear)
|
|
267
|
+
text += "\u00A9 ".concat(currentYear, " ");
|
|
268
|
+
text += final.companyName || 'Company';
|
|
269
|
+
if (final.showRightsReserved)
|
|
270
|
+
text += '. All rights reserved.';
|
|
271
|
+
return text;
|
|
272
|
+
};
|
|
273
|
+
// Get layout classes
|
|
274
|
+
var getLayoutClasses = function () {
|
|
275
|
+
var classes = ['funui-footer'];
|
|
276
|
+
if (final.layout)
|
|
277
|
+
classes.push("funui-footer--".concat(final.layout));
|
|
278
|
+
if (final.funcss)
|
|
279
|
+
classes.push(final.funcss);
|
|
280
|
+
return classes.join(' ');
|
|
281
|
+
};
|
|
282
|
+
return (react_1.default.createElement("footer", { className: getLayoutClasses(), style: {
|
|
283
|
+
backgroundColor: final.bg,
|
|
284
|
+
color: final.textColor,
|
|
285
|
+
padding: final.padding,
|
|
286
|
+
}, "data-testid": "footer" },
|
|
287
|
+
react_1.default.createElement("div", { className: "funui-footer__container ".concat(final.containerClass || ''), style: {
|
|
288
|
+
maxWidth: final.maxWidth,
|
|
289
|
+
'--link-hover-color': final.linkHoverColor,
|
|
290
|
+
} },
|
|
291
|
+
react_1.default.createElement("div", { className: "funui-footer__top ".concat(final.topSectionClass || ''), "data-testid": "footer-top" },
|
|
292
|
+
react_1.default.createElement("div", { className: "funui-footer__brand" },
|
|
293
|
+
(final.logo || final.logoUrl) && (react_1.default.createElement("a", { href: final.logoLinkUrl || '/', className: "funui-footer__logo-link ".concat(final.logoClass || ''), "aria-label": final.companyName || 'Home' }, final.logo ? (react_1.default.createElement("div", { className: "funui-footer__logo-custom" }, final.logo)) : final.logoUrl ? (react_1.default.createElement("img", { src: final.logoUrl, width: final.logoSize || 100, alt: "".concat(final.companyName || 'Company', " logo"), className: "funui-footer__logo-image", loading: "lazy" })) : null)),
|
|
294
|
+
final.description && (react_1.default.createElement("div", { className: "funui-footer__description ".concat(final.descriptionClass || ''), "data-testid": "footer-description" }, typeof final.description === 'string' ? (react_1.default.createElement("p", null, final.description)) : (final.description))),
|
|
295
|
+
final.showContactInfo && (final.email || final.phone || final.address) && (react_1.default.createElement("div", { className: "funui-footer__contact", "data-testid": "footer-contact" },
|
|
296
|
+
final.email && (react_1.default.createElement("div", { className: "funui-footer__contact-item" },
|
|
297
|
+
react_1.default.createElement("span", { className: "funui-footer__contact-icon" }, getIcon(final.emailIcon, 'email', react_1.default.createElement(pi_1.PiEnvelope, null))),
|
|
298
|
+
react_1.default.createElement("a", { href: "mailto:".concat(final.email), className: "funui-footer__contact-link" }, final.email))),
|
|
299
|
+
final.phone && (react_1.default.createElement("div", { className: "funui-footer__contact-item" },
|
|
300
|
+
react_1.default.createElement("span", { className: "funui-footer__contact-icon" }, getIcon(final.phoneIcon, 'phone', react_1.default.createElement(pi_1.PiPhone, null))),
|
|
301
|
+
react_1.default.createElement("a", { href: "tel:".concat(final.phone), className: "funui-footer__contact-link" }, final.phone))),
|
|
302
|
+
final.address && (react_1.default.createElement("div", { className: "funui-footer__contact-item" },
|
|
303
|
+
react_1.default.createElement("span", { className: "funui-footer__contact-icon" }, getIcon(final.addressIcon, 'address', react_1.default.createElement(pi_1.PiMapPin, null))),
|
|
304
|
+
react_1.default.createElement("span", { className: "funui-footer__contact-text" }, final.address))))),
|
|
305
|
+
socialLinks.length > 0 && (react_1.default.createElement("div", { className: "funui-footer__socials ".concat(final.socialContainerClass || ''), "data-testid": "footer-socials" }, socialLinks.map(function (social, index) { return (react_1.default.createElement("a", { key: index, href: social.url, target: "_blank", rel: "noopener noreferrer", "aria-label": social.label, className: "funui-footer__social-link" },
|
|
306
|
+
react_1.default.createElement("span", { className: "funui-footer__social-icon" }, react_1.default.isValidElement(social.icon)
|
|
307
|
+
? react_1.default.cloneElement(social.icon, {
|
|
308
|
+
size: final.socialIconSize || 20
|
|
309
|
+
})
|
|
310
|
+
: social.icon),
|
|
311
|
+
react_1.default.createElement("span", { className: "funui-footer__social-label sr-only" }, social.label))); })))),
|
|
312
|
+
sections.length > 0 && sections.map(function (section, sectionIndex) { return (react_1.default.createElement("div", { key: sectionIndex, className: "funui-footer__section", "data-testid": "footer-section-".concat(sectionIndex) },
|
|
313
|
+
react_1.default.createElement("div", { className: "funui-footer__section-title ".concat(final.sectionTitleClass || '') }, section.title),
|
|
314
|
+
react_1.default.createElement("ul", { className: "funui-footer__links" }, section.links.map(function (link, linkIndex) { return (react_1.default.createElement("li", { key: linkIndex, className: "funui-footer__link-item" },
|
|
315
|
+
react_1.default.createElement("a", { href: link.url, target: link.external ? '_blank' : undefined, rel: link.external ? 'noopener noreferrer' : undefined, className: "funui-footer__link ".concat(final.linkClass || '') },
|
|
316
|
+
link.icon && (react_1.default.createElement("span", { className: "funui-footer__link-icon" }, link.icon)),
|
|
317
|
+
react_1.default.createElement("span", { className: "funui-footer__link-text" }, link.label)))); })))); }),
|
|
318
|
+
final.children && (react_1.default.createElement("div", { className: "funui-footer__children" }, final.children))),
|
|
319
|
+
final.showDivider && (react_1.default.createElement("div", { className: "funui-footer__divider", "data-testid": "footer-divider" })),
|
|
320
|
+
react_1.default.createElement("div", { className: "funui-footer__bottom ".concat(final.bottomSectionClass || ''), "data-testid": "footer-bottom" },
|
|
321
|
+
react_1.default.createElement("div", { className: "funui-footer__copyright" }, getCopyrightText()),
|
|
322
|
+
legalLinks.length > 0 && (react_1.default.createElement("div", { className: "funui-footer__legal ".concat(final.legalLinksClass || ''), "data-testid": "footer-legal" }, legalLinks.map(function (link, index) { return (react_1.default.createElement("a", { key: index, href: link.url, className: "funui-footer__legal-link" }, link.text)); })))))));
|
|
323
|
+
};
|
|
324
|
+
exports.default = Footer;
|
|
@@ -18,12 +18,26 @@ export interface ComponentConfig {
|
|
|
18
18
|
availableVariants: string[];
|
|
19
19
|
metadata: ComponentMetadata;
|
|
20
20
|
}
|
|
21
|
+
export interface Asset {
|
|
22
|
+
name: string;
|
|
23
|
+
url: string;
|
|
24
|
+
}
|
|
21
25
|
export interface ProjectData {
|
|
22
26
|
components?: {
|
|
23
27
|
[componentName: string]: {
|
|
24
28
|
[variantName: string]: ComponentVariant;
|
|
25
29
|
};
|
|
26
30
|
};
|
|
31
|
+
variables?: Array<{
|
|
32
|
+
name: string;
|
|
33
|
+
value: string;
|
|
34
|
+
category?: string;
|
|
35
|
+
createdBy?: string;
|
|
36
|
+
createdAt?: number;
|
|
37
|
+
updatedBy?: string;
|
|
38
|
+
updatedAt?: number;
|
|
39
|
+
}>;
|
|
40
|
+
assets?: Asset[];
|
|
27
41
|
}
|
|
28
42
|
export interface MergedConfig {
|
|
29
43
|
props: ComponentProps;
|
|
@@ -37,34 +51,19 @@ export interface UseComponentConfigReturn extends ComponentConfig {
|
|
|
37
51
|
isDefaultVariant: boolean;
|
|
38
52
|
}
|
|
39
53
|
/**
|
|
40
|
-
* Universal component config getter
|
|
41
|
-
*
|
|
42
|
-
* @param projectData - The project configuration data
|
|
43
|
-
* @param componentName - Name of the component to get config for
|
|
44
|
-
* @param variantName - Name of the variant (defaults to 'default')
|
|
45
|
-
* @returns Component configuration with metadata
|
|
54
|
+
* Universal component config getter with interpolation
|
|
46
55
|
*/
|
|
47
56
|
export declare const getComponentConfig: (projectData: ProjectData | null | undefined, componentName: string, variantName?: string) => ComponentConfig;
|
|
48
57
|
/**
|
|
49
|
-
* Merge component config with local props
|
|
50
|
-
*
|
|
51
|
-
* @param config - Component configuration from getComponentConfig
|
|
52
|
-
* @param localProps - Props passed directly to the component (OVERRIDES CONFIG)
|
|
53
|
-
* @returns Merged configuration with metadata
|
|
58
|
+
* Merge component config with local props
|
|
54
59
|
*/
|
|
55
|
-
export declare const mergeComponentConfig: (config: ComponentConfig, localProps
|
|
60
|
+
export declare const mergeComponentConfig: (config: ComponentConfig, localProps: ComponentProps | undefined, projectData: ProjectData | null | undefined) => MergedConfig;
|
|
56
61
|
/**
|
|
57
|
-
* Hook for easy component config usage
|
|
58
|
-
* Uses useMemo to prevent unnecessary re-computation
|
|
59
|
-
*
|
|
60
|
-
* @param componentName - Name of the component
|
|
61
|
-
* @param variantName - Optional variant name
|
|
62
|
-
* @returns Configuration object with helper methods
|
|
62
|
+
* Hook for easy component config usage
|
|
63
63
|
*/
|
|
64
64
|
export declare const useComponentConfiguration: (componentName: string, variantName?: string) => UseComponentConfigReturn;
|
|
65
65
|
/**
|
|
66
66
|
* Hook that directly returns merged props with local override
|
|
67
|
-
* Perfect for direct use in components
|
|
68
67
|
*/
|
|
69
68
|
export declare const useComponentProps: (componentName: string, variantName?: string, localProps?: ComponentProps) => ComponentProps;
|
|
70
69
|
/**
|
|
@@ -75,3 +74,111 @@ export declare const hasComponentVariant: (projectData: ProjectData | null | und
|
|
|
75
74
|
* Get all available variants for a component
|
|
76
75
|
*/
|
|
77
76
|
export declare const getAvailableVariants: (projectData: ProjectData | null | undefined, componentName: string) => string[];
|
|
77
|
+
/**
|
|
78
|
+
* Get all variables from project
|
|
79
|
+
*/
|
|
80
|
+
export declare const getProjectVariables: (projectData: ProjectData | null | undefined) => Array<{
|
|
81
|
+
name: string;
|
|
82
|
+
value: string;
|
|
83
|
+
}>;
|
|
84
|
+
/**
|
|
85
|
+
* Get all assets from project
|
|
86
|
+
*/
|
|
87
|
+
export declare const getProjectAssets: (projectData: ProjectData | null | undefined) => Asset[];
|
|
88
|
+
/**
|
|
89
|
+
* Hook to get interpolated value for a specific variable or asset reference
|
|
90
|
+
*/
|
|
91
|
+
export declare const useValue: (value: string) => string;
|
|
92
|
+
/**
|
|
93
|
+
* Hook to get a specific variable value
|
|
94
|
+
*/
|
|
95
|
+
export declare const useVariable: (variableName: string) => string | null;
|
|
96
|
+
/**
|
|
97
|
+
* Hook to get a specific asset
|
|
98
|
+
*/
|
|
99
|
+
export declare const useAsset: (assetName: string) => Asset | null;
|
|
100
|
+
/**
|
|
101
|
+
* Hook to get a specific asset URL
|
|
102
|
+
*/
|
|
103
|
+
export declare const useAssetUrl: (assetName: string) => string | null;
|
|
104
|
+
/**
|
|
105
|
+
* Check if a value is a variable reference
|
|
106
|
+
*/
|
|
107
|
+
export declare const isVariableReference: (value: any) => boolean;
|
|
108
|
+
/**
|
|
109
|
+
* Check if a value is an asset reference
|
|
110
|
+
*/
|
|
111
|
+
export declare const isAssetReference: (value: any) => boolean;
|
|
112
|
+
/**
|
|
113
|
+
* Helper to convert variable/asset references for UI display
|
|
114
|
+
*/
|
|
115
|
+
export declare const formatReferenceForDisplay: (value: string) => {
|
|
116
|
+
type: "variable" | "asset" | "custom";
|
|
117
|
+
display: string;
|
|
118
|
+
};
|
|
119
|
+
/**
|
|
120
|
+
* Create a variable reference string
|
|
121
|
+
*/
|
|
122
|
+
export declare const createVariableReference: (variableName: string) => string;
|
|
123
|
+
/**
|
|
124
|
+
* Create an asset reference string
|
|
125
|
+
*/
|
|
126
|
+
export declare const createAssetReference: (assetName: string) => string;
|
|
127
|
+
/**
|
|
128
|
+
* Check if a prop value needs interpolation
|
|
129
|
+
*/
|
|
130
|
+
export declare const needsInterpolation: (value: any) => boolean;
|
|
131
|
+
/**
|
|
132
|
+
* Get all references (variables and assets) used in props
|
|
133
|
+
*/
|
|
134
|
+
export declare const getUsedReferences: (props: ComponentProps, projectData: ProjectData | null | undefined) => {
|
|
135
|
+
variables: string[];
|
|
136
|
+
assets: string[];
|
|
137
|
+
};
|
|
138
|
+
/**
|
|
139
|
+
* Get asset by name (exported version)
|
|
140
|
+
*/
|
|
141
|
+
export declare const getAssetByName: (assetName: string, projectData: ProjectData | null | undefined) => Asset | null;
|
|
142
|
+
/**
|
|
143
|
+
* Get variable by name (exported version)
|
|
144
|
+
*/
|
|
145
|
+
export declare const getVariableByName: (variableName: string, projectData: ProjectData | null | undefined) => {
|
|
146
|
+
name: string;
|
|
147
|
+
value: string;
|
|
148
|
+
} | null;
|
|
149
|
+
declare const _default: {
|
|
150
|
+
getComponentConfig: (projectData: ProjectData | null | undefined, componentName: string, variantName?: string) => ComponentConfig;
|
|
151
|
+
mergeComponentConfig: (config: ComponentConfig, localProps: ComponentProps | undefined, projectData: ProjectData | null | undefined) => MergedConfig;
|
|
152
|
+
useComponentConfiguration: (componentName: string, variantName?: string) => UseComponentConfigReturn;
|
|
153
|
+
useComponentProps: (componentName: string, variantName?: string, localProps?: ComponentProps) => ComponentProps;
|
|
154
|
+
hasComponentVariant: (projectData: ProjectData | null | undefined, componentName: string, variantName: string) => boolean;
|
|
155
|
+
getAvailableVariants: (projectData: ProjectData | null | undefined, componentName: string) => string[];
|
|
156
|
+
getProjectVariables: (projectData: ProjectData | null | undefined) => Array<{
|
|
157
|
+
name: string;
|
|
158
|
+
value: string;
|
|
159
|
+
}>;
|
|
160
|
+
getProjectAssets: (projectData: ProjectData | null | undefined) => Asset[];
|
|
161
|
+
useValue: (value: string) => string;
|
|
162
|
+
useVariable: (variableName: string) => string | null;
|
|
163
|
+
useAsset: (assetName: string) => Asset | null;
|
|
164
|
+
useAssetUrl: (assetName: string) => string | null;
|
|
165
|
+
isVariableReference: (value: any) => boolean;
|
|
166
|
+
isAssetReference: (value: any) => boolean;
|
|
167
|
+
formatReferenceForDisplay: (value: string) => {
|
|
168
|
+
type: "variable" | "asset" | "custom";
|
|
169
|
+
display: string;
|
|
170
|
+
};
|
|
171
|
+
createVariableReference: (variableName: string) => string;
|
|
172
|
+
createAssetReference: (assetName: string) => string;
|
|
173
|
+
needsInterpolation: (value: any) => boolean;
|
|
174
|
+
getUsedReferences: (props: ComponentProps, projectData: ProjectData | null | undefined) => {
|
|
175
|
+
variables: string[];
|
|
176
|
+
assets: string[];
|
|
177
|
+
};
|
|
178
|
+
getAssetByName: (assetName: string, projectData: ProjectData | null | undefined) => Asset | null;
|
|
179
|
+
getVariableByName: (variableName: string, projectData: ProjectData | null | undefined) => {
|
|
180
|
+
name: string;
|
|
181
|
+
value: string;
|
|
182
|
+
} | null;
|
|
183
|
+
};
|
|
184
|
+
export default _default;
|