linkfolio
Version:
Minimalist web page that acts as a hub for all your online presence
469 lines • 22.5 kB
JavaScript
"use client";
;
function _array_like_to_array(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
return arr2;
}
function _array_with_holes(arr) {
if (Array.isArray(arr)) return arr;
}
function _iterable_to_array_limit(arr, i) {
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
if (_i == null) return;
var _arr = [];
var _n = true;
var _d = false;
var _s, _e;
try {
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
_arr.push(_s.value);
if (i && _arr.length === i) break;
}
} catch (err) {
_d = true;
_e = err;
} finally{
try {
if (!_n && _i["return"] != null) _i["return"]();
} finally{
if (_d) throw _e;
}
}
return _arr;
}
function _non_iterable_rest() {
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function _sliced_to_array(arr, i) {
return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
}
function _type_of(obj) {
"@swc/helpers - typeof";
return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
}
function _unsupported_iterable_to_array(o, minLen) {
if (!o) return;
if (typeof o === "string") return _array_like_to_array(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(n);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
}
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = function(target, all) {
for(var name in all)__defProp(target, name, {
get: all[name],
enumerable: true
});
};
var __copyProps = function(to, from, except, desc) {
if (from && (typeof from === "undefined" ? "undefined" : _type_of(from)) === "object" || typeof from === "function") {
var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
try {
var _loop = function() {
var key = _step.value;
if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
get: function() {
return from[key];
},
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
});
};
for(var _iterator = __getOwnPropNames(from)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true)_loop();
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally{
try {
if (!_iteratorNormalCompletion && _iterator.return != null) {
_iterator.return();
}
} finally{
if (_didIteratorError) {
throw _iteratorError;
}
}
}
}
return to;
};
var __toESM = function(mod, isNodeMode, target) {
return target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
value: mod,
enumerable: true
}) : target, mod);
};
var __toCommonJS = function(mod) {
return __copyProps(__defProp({}, "__esModule", {
value: true
}), mod);
};
// src/index.ts
var index_exports = {};
__export(index_exports, {
Analytics: function() {
return Analytics_default;
},
Footer: function() {
return Footer_default;
},
LinkFolio: function() {
return LinkFolio_default;
},
SocialLinks: function() {
return SocialLinks_default;
},
UserProfile: function() {
return UserProfile_default;
}
});
module.exports = __toCommonJS(index_exports);
// src/components/LinkFolio.tsx
var import_react = __toESM(require("react"));
// src/assets/img/linkfolio_logo.svg
var linkfolio_logo_default = 'data:image/svg+xml,<?xml version="1.0" encoding="utf-8"?>%0D%0A<!-- Generator: Adobe Illustrator 19.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->%0D%0A<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"%0D%0A%09 viewBox="0 0 333.6 323.9" style="enable-background:new 0 0 333.6 323.9;" xml:space="preserve">%0D%0A<style type="text/css">%0D%0A%09.st0{fill:%23336666;}%0D%0A</style>%0D%0A<path class="st0" d="M169.5,147.5c6.7-12.2,12.9-23.4,19-34.7c2.5-4.5,4.7-9.2,7.5-13.5c1.8-2.8,1.4-4.4-0.8-6.7%0D%0A%09C184.7,81.5,183,68.7,190.1,57c7.9-13.1,27.2-18.7,42.6-12.3c14.3,6,22.9,19.3,20.7,32.4c-2.4,14.4-14.1,24.5-29.3,25.2%0D%0A%09c-4.1,0.2-8.3-0.2-12.4-0.7c-3.1-0.4-4.9,0.3-6.5,3.1c-8.8,16.6-17.9,33.1-26.6,49.7c-1.2,2.4-2,6.2-1,8.4c6.2,13,13,25.7,20.5,39%0D%0A%09c7.6-23.1,26.6-34.8,45.4-46.3c-6.9-16.3-5.4-27.8,4.8-37.6c9.9-9.6,25.9-11,40.1-3.6c12.8,6.7,19.1,17.6,17.4,30.3%0D%0A%09c-2,15.4-15.9,26.3-33.2,25.1c-6.2-0.4-12.2-2.8-18.4-4.2c-1.5-0.3-3.4-0.9-4.6-0.3c-14.4,7.3-28.4,15.2-35.8,30.5%0D%0A%09c-3,6.1-5,12.7-6.9,19.2c-0.6,2.3,0,5.4,1.1,7.6c8.5,16.8,17.4,33.4,26.1,50.1c1.8,3.4,3.7,6.7,5.1,10.3c0.6,1.7,0.6,5.1-0.3,5.6%0D%0A%09c-1.9,1-4.7,1.3-6.8,0.6c-1.6-0.5-2.8-2.7-3.7-4.4c-8.1-14.8-16.4-29.4-23.9-44.4c-9-18-24.6-24-42.9-24.9%0D%0A%09c-13.9-0.7-26.2,5.4-38.3,11.5c-1.1,0.6-1.9,2.6-2.1,4c-2.2,13.6-9.6,22.9-22.5,27.5c-13.1,4.7-25.5,2.9-36.2-6%0D%0A%09c-16.5-13.8-12.6-40.5,7.2-51.3c16-8.8,34.7-4.9,47,10.3c3.2,3.9,5.7,4.5,10,2.3c15.5-7.5,31.7-11.3,48.9-7.1%0D%0A%09c4.3,1,8.5,2.6,13.8,4.2c-3.6-7.1-7.4-13.3-9.9-20c-6.6-17.6-20.3-25.5-37.7-28.7c-13.6-2.5-27.2-5-40.8-7.4%0D%0A%09c-7.5-1.3-7.6-1.2-10.9,5.7c-7,14.2-24.8,21.3-42.1,16.6c-15.4-4.2-24.9-17.7-23-32.8C26.7,129,42,116,57.6,115.9%0D%0A%09c16.9,0,31.3,9.8,35.5,24.7c0.4,1.5,3,3,4.7,3.3c13.7,2.6,27.6,4.8,41.3,7.5c7.5,1.5,14.8,3.7,22.6,5.6c-0.3-1-0.6-2-1-2.9%0D%0A%09c-9.6-18.1-19.4-36.1-28.9-54.2c-1.9-3.7-4.1-4.6-8.1-4.8c-6.1-0.4-12.4-1-18-3.2C92.4,86.8,85,73.4,87.2,60%0D%0A%09c2.1-13,15-24.3,29.2-25.3c12.4-0.9,23.1,2.9,31.3,12.4c10.4,12,9.1,27.9-3.7,39.1c-4.3,3.8-3.9,6.2-1.6,10.6%0D%0A%09c8.4,15.5,16.4,31.2,24.5,46.9C167.5,144.6,168.2,145.5,169.5,147.5z M84.8,250.6c13.9-0.1,24.7-10.1,24.8-22.8%0D%0A%09c0-11.5-10.3-20.4-23.3-20.3c-12.8,0.2-22.8,9.8-22.8,22.3C63.4,240.6,73.6,250.6,84.8,250.6z M81.7,147.2%0D%0A%09c-0.2-11.8-10.5-20.8-23.6-20.7c-12.3,0.1-22.4,10.1-22.1,21.7c0.3,11.1,10.6,20.3,22.6,20.2C71.6,168.3,81.9,158.8,81.7,147.2z%0D%0A%09 M220.2,92.5c10.5-0.1,18.3-5,21.5-13.3c2.8-7.5,0.6-15.3-6-21.1c-8.6-7.5-23.1-7.7-31.8-0.4c-6.6,5.5-8.6,12.8-5.7,20.6%0D%0A%09C201.3,86.7,210.5,92.6,220.2,92.5z M117.7,84.9c13.8,0.2,23.4-7.2,25.5-17.9c1.6-8.2-4.2-16.8-14.2-20.9%0D%0A%09c-8.5-3.5-19.8-1.1-25.9,5.4c-5.9,6.3-6.9,14.1-2.6,22.1C104.6,81.3,111.3,85,117.7,84.9z M271.3,120.1%0D%0A%09c-11.3-0.2-20.7,8.1-20.9,18.4c-0.2,11.5,9.5,21.3,21.6,21.8c13.2,0.5,22.5-7.7,22.7-19.8C294.8,129.4,284.4,120.4,271.3,120.1z"/>%0D%0A</svg>%0D%0A';
// src/assets/img/avatar.webp
var avatar_default = "./assets/img/avatar.webp";
// src/assets/img/bluesky.webp
var bluesky_default = "./assets/img/bluesky.webp";
// src/assets/img/facebook.webp
var facebook_default = "./assets/img/facebook.webp";
// src/assets/img/github.webp
var github_default = "./assets/img/github.webp";
// src/assets/img/instagram.webp
var instagram_default = "./assets/img/instagram.webp";
// src/assets/img/linkedin.webp
var linkedin_default = "./assets/img/linkedin.webp";
// src/assets/img/snapchat.webp
var snapchat_default = "./assets/img/snapchat.webp";
// src/assets/img/mastodon.webp
var mastodon_default = "./assets/img/mastodon.webp";
// src/assets/img/telegram.webp
var telegram_default = "./assets/img/telegram.webp";
// src/assets/img/threads.webp
var threads_default = "./assets/img/threads.webp";
// src/assets/img/whatsapp.webp
var whatsapp_default = "./assets/img/whatsapp.webp";
// src/assets/img/youtube.webp
var youtube_default = "./assets/img/youtube.webp";
// src/assets/img/x.webp
var x_default = "./assets/img/x.webp";
// src/default.config.ts
var defaultConfig = {
socialNetworks: [
{
url: "#",
iconSrc: x_default,
title: "Twitter / X",
description: "#DevLife #CodeNewbie \uD83D\uDC26"
},
{
url: "#",
iconSrc: github_default,
title: "GitHub",
description: "Versioning my projects \uD83D\uDCC1"
},
{
url: "#",
iconSrc: linkedin_default,
title: "LinkedIn",
description: "Building my professional network. Let's connect! \uD83C\uDF10"
},
{
url: "#",
iconSrc: facebook_default,
title: "Facebook",
description: "Sharing life's highlights \uD83C\uDF1F\uD83E\uDD1D"
},
{
url: "#",
iconSrc: instagram_default,
title: "Instagram",
description: "Capturing life's frames \uD83D\uDCF7"
},
{
url: "#",
iconSrc: snapchat_default,
title: "Snapchat",
description: "Capturing daily moments \uD83D\uDCF8"
},
{
url: "#",
iconSrc: whatsapp_default,
title: "WhatsApp",
description: "Simple, reliable messaging and calling \uD83D\uDFE2"
},
{
url: "#",
iconSrc: telegram_default,
title: "Telegram",
description: "Messaging focusing on speed and security \uD83D\uDE80"
},
{
url: "#",
iconSrc: youtube_default,
title: "YouTube",
description: "Discover, watch, and share your passion \uD83C\uDFA5"
},
{
url: "#",
iconSrc: mastodon_default,
title: "Mastodon",
description: "Sharing without the mainstream noise \uD83D\uDC18"
},
{
url: "#",
iconSrc: bluesky_default,
title: "BlueSky",
description: "Exploring open social web \uD83D\uDC99"
},
{
url: "#",
iconSrc: threads_default,
title: "Threads",
description: "Quick updates and stories! \uD83C\uDF00"
}
]
};
var default_config_default = defaultConfig;
// src/components/LinkFolio.tsx
var LinkFolio = function(param) {
var userConfig = param.userConfig, UserProfileComponent = param.UserProfileComponent, BeforeSocialLinksComponent = param.BeforeSocialLinksComponent, SocialLinksComponent = param.SocialLinksComponent, AfterSocialLinksComponent = param.AfterSocialLinksComponent, FooterComponent = param.FooterComponent;
var config = userConfig || default_config_default;
var UserProfileToRender = UserProfileComponent || UserProfile_default;
var SocialLinksToRender = SocialLinksComponent || SocialLinks_default;
var FooterToRender = FooterComponent || Footer_default;
return /* @__PURE__ */ import_react.default.createElement("div", {
className: "flex flex-col items-center justify-center min-h-screen bg-neutral-100 p-10 md:p-16 lg:px-15% lg:py-10 max-w-screen-lg lg:mx-auto font-roboto rounded-lg sm:m-4 m-2 shadow-lg"
}, /* @__PURE__ */ import_react.default.createElement(UserProfileToRender, {
userConfig: config
}), BeforeSocialLinksComponent && /* @__PURE__ */ import_react.default.createElement(BeforeSocialLinksComponent, null), /* @__PURE__ */ import_react.default.createElement(SocialLinksToRender, {
userConfig: config
}), AfterSocialLinksComponent && /* @__PURE__ */ import_react.default.createElement(AfterSocialLinksComponent, null), /* @__PURE__ */ import_react.default.createElement(FooterToRender, null));
};
var LinkFolio_default = LinkFolio;
// src/components/UserProfile.tsx
var import_react2 = __toESM(require("react"));
var import_image = __toESM(require("next/image"));
var UserProfile = function(param) {
var userConfig = param.userConfig;
var aliasText = userConfig.alias;
var _ref = _sliced_to_array((0, import_react2.useState)(false), 2), isMounted = _ref[0], setIsMounted = _ref[1];
var _ref1 = _sliced_to_array((0, import_react2.useState)(false), 2), typing = _ref1[0], setTyping = _ref1[1];
var _ref2 = _sliced_to_array((0, import_react2.useState)(""), 2), alias = _ref2[0], setAlias = _ref2[1];
var _ref3 = _sliced_to_array((0, import_react2.useState)(0), 2), index = _ref3[0], setIndex = _ref3[1];
(0, import_react2.useEffect)(function() {
setIsMounted(true);
}, []);
var typeAlias = (0, import_react2.useCallback)(function() {
if (!aliasText) return;
if (typing && index < aliasText.length) {
var timeoutId = setTimeout(function() {
setAlias(function(prev) {
return prev + aliasText[index];
});
setIndex(function(prev) {
return prev + 1;
});
}, 100);
return function() {
return clearTimeout(timeoutId);
};
}
}, [
aliasText,
typing,
index
]);
(0, import_react2.useEffect)(function() {
if (userConfig.enableTypingAlias) {
typeAlias();
}
}, [
userConfig.enableTypingAlias,
typeAlias
]);
(0, import_react2.useEffect)(function() {
if (userConfig.enableTypingAlias && isMounted) {
var timeoutId = setTimeout(function() {
return setTyping(true);
}, 300);
return function() {
return clearTimeout(timeoutId);
};
}
}, [
isMounted,
userConfig.enableTypingAlias
]);
var _userConfig_avatarSrc, _userConfig_avatarAlt, _userConfig_avatarSize, _userConfig_avatarSize1, _userConfig_fullName;
return /* @__PURE__ */ import_react2.default.createElement("header", {
className: "profile mt-2 mb-12 text-center"
}, /* @__PURE__ */ import_react2.default.createElement(import_image.default, {
src: (_userConfig_avatarSrc = userConfig.avatarSrc) !== null && _userConfig_avatarSrc !== void 0 ? _userConfig_avatarSrc : avatar_default,
alt: (_userConfig_avatarAlt = userConfig.avatarAlt) !== null && _userConfig_avatarAlt !== void 0 ? _userConfig_avatarAlt : "Avatar",
width: (_userConfig_avatarSize = userConfig.avatarSize) !== null && _userConfig_avatarSize !== void 0 ? _userConfig_avatarSize : 120,
height: (_userConfig_avatarSize1 = userConfig.avatarSize) !== null && _userConfig_avatarSize1 !== void 0 ? _userConfig_avatarSize1 : 120,
className: "avatar rounded-full mb-6 mx-auto shadow-lg transition-shadow duration-300 glitter-effect",
priority: true
}), /* @__PURE__ */ import_react2.default.createElement("h1", {
className: "fullname text-2xl font-semibold"
}, (_userConfig_fullName = userConfig.fullName) !== null && _userConfig_fullName !== void 0 ? _userConfig_fullName : "Your Name"), /* @__PURE__ */ import_react2.default.createElement("p", {
className: "alias mt-2 text-base text-neutral-600 font-semibold"
}, userConfig.enableTypingAlias ? /* @__PURE__ */ import_react2.default.createElement("span", {
className: "alias-typing"
}, alias) : aliasText));
};
var UserProfile_default = UserProfile;
// src/components/SocialLinks.tsx
var import_react4 = __toESM(require("react"));
// src/components/SocialNetwork.tsx
var import_react3 = __toESM(require("react"));
var import_image2 = __toESM(require("next/image"));
var import_link = __toESM(require("next/link"));
var SocialNetwork = function(param) {
var config = param.config, _param_delay = param.delay, delay = _param_delay === void 0 ? 0 : _param_delay;
var ref = (0, import_react3.useRef)(null);
var callback = (0, import_react3.useCallback)(function(entries) {
entries.forEach(function(entry) {
if (entry.isIntersecting) {
entry.target.classList.add("fade-in-up-bounce");
}
});
}, []);
(0, import_react3.useEffect)(function() {
var observer = new IntersectionObserver(callback, {
root: null,
rootMargin: "100px",
threshold: 0.05
});
var currentRef = ref.current;
if (currentRef) {
observer.observe(currentRef);
}
return function() {
if (currentRef) {
observer.unobserve(currentRef);
}
};
}, [
callback
]);
return /* @__PURE__ */ import_react3.default.createElement("div", {
ref: ref,
className: "network flex flex-col items-center p-2 w-full md:w-1/3 lg:w-1/4 rounded-lg hover:bg-neutral-300/20 transition duration-300 ease-in-out opacity-0",
style: {
animationDelay: "".concat(delay, "ms")
}
}, /* @__PURE__ */ import_react3.default.createElement(import_link.default, {
href: config.url,
target: "_blank",
rel: "noopener noreferrer",
className: "group w-full"
}, /* @__PURE__ */ import_react3.default.createElement("div", {
className: "group-hover:subtle-bounce flex justify-center"
}, /* @__PURE__ */ import_react3.default.createElement("div", {
className: "relative w-full h-24 overflow-hidden rounded-lg shadow-lg"
}, /* @__PURE__ */ import_react3.default.createElement(import_image2.default, {
src: config.iconSrc,
alt: config.title,
fill: true,
className: "object-cover",
sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",
quality: 100,
priority: true
}))), /* @__PURE__ */ import_react3.default.createElement("div", {
className: "data px-2 py-4 text-center"
}, /* @__PURE__ */ import_react3.default.createElement("h2", {
className: "text-xl font-bold mb-2"
}, config.title), /* @__PURE__ */ import_react3.default.createElement("p", {
className: "description text-neutral-600 text-sm truncate"
}, config.description))));
};
var SocialNetwork_default = SocialNetwork;
// src/components/SocialLinks.tsx
var SocialLinks = function(param) {
var userConfig = param.userConfig;
var filteredNetworks = (0, import_react4.useMemo)(function() {
var _userConfig_socialNetworks;
var _userConfig_socialNetworks_filter;
return (_userConfig_socialNetworks_filter = (_userConfig_socialNetworks = userConfig.socialNetworks) === null || _userConfig_socialNetworks === void 0 ? void 0 : _userConfig_socialNetworks.filter(function(config) {
return !config.hidden;
})) !== null && _userConfig_socialNetworks_filter !== void 0 ? _userConfig_socialNetworks_filter : [];
}, [
userConfig.socialNetworks
]);
if (filteredNetworks.length === 0) {
return null;
}
return /* @__PURE__ */ import_react4.default.createElement("main", {
className: "flex flex-wrap gap-y-4 gap-x-20 justify-center px-4 max-w-(--breakpoint-xl) mx-auto"
}, filteredNetworks.map(function(config, index) {
return /* @__PURE__ */ import_react4.default.createElement(SocialNetwork_default, {
key: config.url || index,
config: config,
delay: index * 100
});
}));
};
var SocialLinks_default = SocialLinks;
// src/components/Footer.tsx
var import_react5 = __toESM(require("react"));
var import_image3 = __toESM(require("next/image"));
var import_link2 = __toESM(require("next/link"));
var Footer = function(param) {
var children = param.children;
return /* @__PURE__ */ import_react5.default.createElement("footer", {
className: "w-48 mx-auto mt-8 bg-neutral-150 text-neutral-600 px-6 py-2 text-xs rounded-sm"
}, /* @__PURE__ */ import_react5.default.createElement(import_link2.default, {
className: "flex flex-col items-center justify-center",
href: "https://github.com/heristop/linkfolio",
target: "_blank",
rel: "noreferrer"
}, /* @__PURE__ */ import_react5.default.createElement("div", {
className: "relative w-10 h-10"
}, /* @__PURE__ */ import_react5.default.createElement(import_image3.default, {
src: linkfolio_logo_default,
alt: "Linkfolio Logo",
title: "Linkfolio Logo",
fill: true,
sizes: "40px",
className: "drop-shadow-lg object-contain"
})), /* @__PURE__ */ import_react5.default.createElement("div", {
className: "text-xs mt-2 drop-shadow-lg"
}, (children === null || children === void 0 ? void 0 : children.defaultContent) || "Made by heristop")));
};
var Footer_default = Footer;
// src/components/Analytics.tsx
var import_react6 = __toESM(require("react"));
var Analytics = function() {
var token = process.env.NEXT_BEAM_TOKEN;
if (!token) {
return null;
}
return /* @__PURE__ */ import_react6.default.createElement("script", {
src: "https://beamanalytics.b-cdn.net/beam.min.js",
"data-token": token,
async: true
});
};
var Analytics_default = Analytics;
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
Analytics: Analytics,
Footer: Footer,
LinkFolio: LinkFolio,
SocialLinks: SocialLinks,
UserProfile: UserProfile
});
//# sourceMappingURL=index.js.map