react-social-login-buttons
Version:
Simple social login buttons for React
896 lines (868 loc) • 45.1 kB
JavaScript
"use strict";
var __create = Object.create;
var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp.call(b, prop))
__defNormalProp(a, prop, b[prop]);
if (__getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(b)) {
if (__propIsEnum.call(b, prop))
__defNormalProp(a, prop, b[prop]);
}
return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toESM = (mod, isNodeMode, target) => (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 = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/index.ts
var index_exports = {};
__export(index_exports, {
AmazonLoginButton: () => AmazonLoginButton,
AppleLoginButton: () => AppleLoginButton,
BufferLoginButton: () => BufferLoginButton,
DiscordLoginButton: () => DiscordLoginButton,
FacebookLoginButton: () => FacebookLoginButton,
GithubLoginButton: () => GithubLoginButton,
GitlabLoginButton: () => GitlabLoginButton,
GoogleLoginButton: () => GoogleLoginButton,
InstagramLoginButton: () => InstagramLoginButton,
LinkedInLoginButton: () => LinkedInLoginButton,
MetamaskLoginButton: () => MetamaskLoginButton,
MicrosoftLoginButton: () => MicrosoftLoginButton,
OktaLoginButton: () => OktaLoginButton,
SlackLoginButton: () => SlackLoginButton,
TelegramLoginButton: () => TelegramLoginButton,
TikTokLoginButton: () => TikTokLoginButton,
TwitterLoginButton: () => TwitterLoginButton,
XLoginButton: () => XLoginButton,
YahooLoginButton: () => YahooLoginButton,
ZaloLoginButton: () => ZaloLoginButton,
createButton: () => createButton
});
module.exports = __toCommonJS(index_exports);
// src/buttons/FacebookLoginButton.tsx
var import_react5 = __toESM(require("react"));
// src/buttons/SocialLoginButton.tsx
var import_react3 = __toESM(require("react"));
// src/buttons/icon.tsx
var import_react = __toESM(require("react"));
var Icon = ({ name, size, format }) => {
return /* @__PURE__ */ import_react.default.createElement("i", { className: format(name), style: { fontSize: size } });
};
var icon_default = Icon;
// src/buttons/DynamicIcon.tsx
var import_react2 = __toESM(require("react"));
var DynamicIcon = ({ type: Component, size, format, color = "#FFFFFF" }) => {
const renderIElement = typeof Component === "string";
return renderIElement ? /* @__PURE__ */ import_react2.default.createElement(icon_default, __spreadValues({}, { format, name: Component, size })) : /* @__PURE__ */ import_react2.default.createElement(Component, { size, color });
};
// src/buttons/SocialLoginButton.tsx
var DEFAULT_ICON_COLOR = "#FFFFFF";
var SocialLoginButton = (props) => {
const [focused, setFocused] = (0, import_react3.useState)(false);
const [hovered, setHovered] = (0, import_react3.useState)(false);
const handleMouseEnter = () => {
var _a;
setHovered(true);
(_a = props.onMouseEnter) == null ? void 0 : _a.call(props);
};
const handleMouseLeave = () => {
var _a;
setHovered(false);
(_a = props.onMouseLeave) == null ? void 0 : _a.call(props);
};
const handleFocus = () => setFocused(true);
const handleBlur = () => setFocused(false);
const handleClick = () => {
var _a;
return (_a = props.onClick) == null ? void 0 : _a.call(props);
};
const {
activeStyle,
align = "left",
text,
children = text,
className,
icon,
iconFormat = (name) => name,
iconSize = "26px",
iconColor = DEFAULT_ICON_COLOR,
preventActiveStyles = false,
size = "50px",
style: customStyle,
disabled,
type = "button"
} = props;
const buttonStyles = computeButtonStyles(styles.button, {
activeStyle: preventActiveStyles ? customStyle : activeStyle,
customStyle,
active: hovered || focused,
size
});
return /* @__PURE__ */ import_react3.default.createElement(
"button",
__spreadValues({
style: buttonStyles,
onClick: handleClick,
onMouseEnter: handleMouseEnter,
onMouseLeave: handleMouseLeave,
onFocus: handleFocus,
onBlur: handleBlur
}, { className, disabled, type }),
/* @__PURE__ */ import_react3.default.createElement("div", { style: styles.flex }, !isZeroPx(iconSize) && !!icon && /* @__PURE__ */ import_react3.default.createElement(
"div",
{
style: {
display: "flex",
justifyContent: "center",
minWidth: iconSize
}
},
/* @__PURE__ */ import_react3.default.createElement(DynamicIcon, { type: icon, size: iconSize, format: iconFormat, color: iconColor })
), !isZeroPx(iconSize) && /* @__PURE__ */ import_react3.default.createElement("div", { style: styles.divider }), /* @__PURE__ */ import_react3.default.createElement("div", { style: { textAlign: align, width: "100%" } }, children))
);
};
var isZeroPx = (size) => size === "0" || size === "0px" || size === 0;
var computeButtonStyles = (defaults, {
size,
customStyle,
active,
activeStyle
}) => __spreadValues(__spreadValues(__spreadProps(__spreadValues({}, defaults), {
height: size
}), customStyle), active && activeStyle);
var styles = {
button: {
display: "block",
border: 0,
borderRadius: 3,
boxShadow: "rgba(0, 0, 0, 0.5) 0 1px 2px",
color: "#ffffff",
cursor: "pointer",
fontSize: "19px",
margin: "5px",
width: "calc(100% - 10px)",
overflow: "hidden",
padding: "0 10px",
userSelect: "none"
},
divider: {
width: "10px"
},
flex: {
alignItems: "center",
display: "flex",
height: "100%"
}
};
// src/buttons/create-button.tsx
var import_react4 = __toESM(require("react"));
var createButton = (config21) => (props) => {
const finalProps = __spreadProps(__spreadValues(__spreadValues({
activeStyle: __spreadValues(__spreadValues({}, config21 == null ? void 0 : config21.activeStyle), props.activeStyle)
}, config21), props), {
style: __spreadValues(__spreadValues({}, config21 == null ? void 0 : config21.style), props.style)
});
return /* @__PURE__ */ import_react4.default.createElement(SocialLoginButton, __spreadValues({}, finalProps));
};
// src/buttons/FacebookLoginButton.tsx
var config = {
activeStyle: { background: "#293e69" },
icon: Icon2,
style: { background: "#3b5998" },
text: "Log in with Facebook"
};
var FacebookLoginButton = createButton(config);
function Icon2({ size, color }) {
return /* @__PURE__ */ import_react5.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 90 90" }, /* @__PURE__ */ import_react5.default.createElement("g", null, /* @__PURE__ */ import_react5.default.createElement(
"path",
{
d: "M90,15.001C90,7.119,82.884,0,75,0H15C7.116,0,0,7.119,0,15.001v59.998 C0,82.881,7.116,90,15.001,90H45V56H34V41h11v-5.844C45,25.077,52.568,16,61.875,16H74v15H61.875C60.548,31,59,32.611,59,35.024V41 h15v15H59v34h16c7.884,0,15-7.119,15-15.001V15.001z",
fill: color
}
)));
}
// src/buttons/GoogleLoginButton.tsx
var import_react6 = __toESM(require("react"));
var config2 = {
activeStyle: { background: "#EFF0EE" },
icon: Icon3,
style: { background: "white", color: "black" },
text: "Log in with Google"
};
var GoogleLoginButton = createButton(config2);
function Icon3({ size }) {
return /* @__PURE__ */ import_react6.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 64 64", width: size, height: size }, /* @__PURE__ */ import_react6.default.createElement(
"linearGradient",
{
id: "95yY7w43Oj6n2vH63j6HJb",
x1: "29.401",
x2: "29.401",
y1: "4.064",
y2: "106.734",
gradientTransform: "matrix(1 0 0 -1 0 66)",
gradientUnits: "userSpaceOnUse"
},
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: "0", stopColor: "#ff5840" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: ".007", stopColor: "#ff5840" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: ".989", stopColor: "#fa528c" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: "1", stopColor: "#fa528c" })
), /* @__PURE__ */ import_react6.default.createElement(
"path",
{
fill: "url(#95yY7w43Oj6n2vH63j6HJb)",
d: "M47.46,15.5l-1.37,1.48c-1.34,1.44-3.5,1.67-5.15,0.6c-2.71-1.75-6.43-3.13-11-2.37 c-4.94,0.83-9.17,3.85-11.64,\n 7.97l-8.03-6.08C14.99,9.82,23.2,5,32.5,5c5,0,9.94,1.56,14.27,4.46 C48.81,10.83,49.13,13.71,47.46,15.5z"
}
), /* @__PURE__ */ import_react6.default.createElement(
"linearGradient",
{
id: "95yY7w43Oj6n2vH63j6HJc",
x1: "12.148",
x2: "12.148",
y1: ".872",
y2: "47.812",
gradientTransform: "matrix(1 0 0 -1 0 66)",
gradientUnits: "userSpaceOnUse"
},
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: "0", stopColor: "#feaa53" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: ".612", stopColor: "#ffcd49" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: "1", stopColor: "#ffde44" })
), /* @__PURE__ */ import_react6.default.createElement(
"path",
{
fill: "url(#95yY7w43Oj6n2vH63j6HJc)",
d: "M16.01,30.91c-0.09,2.47,0.37,4.83,1.27,6.96l-8.21,6.05c-1.35-2.51-2.3-5.28-2.75-8.22 c-1.06-6.88,0.54-13.38,\n 3.95-18.6l8.03,6.08C16.93,25.47,16.1,28.11,16.01,30.91z"
}
), /* @__PURE__ */ import_react6.default.createElement(
"linearGradient",
{
id: "95yY7w43Oj6n2vH63j6HJd",
x1: "29.76",
x2: "29.76",
y1: "32.149",
y2: "-6.939",
gradientTransform: "matrix(1 0 0 -1 0 66)",
gradientUnits: "userSpaceOnUse"
},
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: "0", stopColor: "#42d778" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: ".428", stopColor: "#3dca76" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: "1", stopColor: "#34b171" })
), /* @__PURE__ */ import_react6.default.createElement(
"path",
{
fill: "url(#95yY7w43Oj6n2vH63j6HJd)",
d: "M50.45,51.28c-4.55,4.07-10.61,6.57-17.36,6.71C22.91,58.2,13.66,52.53,9.07,43.92l8.21-6.05 C19.78,43.81,\n 25.67,48,32.5,48c3.94,0,7.52-1.28,10.33-3.44L50.45,51.28z"
}
), /* @__PURE__ */ import_react6.default.createElement(
"linearGradient",
{
id: "95yY7w43Oj6n2vH63j6HJe",
x1: "46",
x2: "46",
y1: "3.638",
y2: "35.593",
gradientTransform: "matrix(1 0 0 -1 0 66)",
gradientUnits: "userSpaceOnUse"
},
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: "0", stopColor: "#155cde" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: ".278", stopColor: "#1f7fe5" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: ".569", stopColor: "#279ceb" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: ".82", stopColor: "#2cafef" }),
/* @__PURE__ */ import_react6.default.createElement("stop", { offset: "1", stopColor: "#2eb5f0" })
), /* @__PURE__ */ import_react6.default.createElement(
"path",
{
fill: "url(#95yY7w43Oj6n2vH63j6HJe)",
d: "M59,31.97c0.01,7.73-3.26,14.58-8.55,19.31l-7.62-6.72c2.1-1.61,3.77-3.71,4.84-6.15\n c0.29-0.66-0.2-1.41-0.92-1.41H37c-2.21,0-4-1.79-4-4v-2c0-2.21,1.79-4,4-4h17C56.75,27,59,29.22,59,31.97z"
}
));
}
// src/buttons/GithubLoginButton.tsx
var import_react7 = __toESM(require("react"));
var config3 = {
activeStyle: { background: "#555555" },
icon: Icon4,
style: { background: "#333333" },
text: "Log in with GitHub"
};
var GithubLoginButton = createButton(config3);
function Icon4({ size, color }) {
return /* @__PURE__ */ import_react7.default.createElement("svg", { fill: color, role: "img", viewBox: "0 0 24 24", width: size, height: size, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react7.default.createElement("path", { d: "M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" }));
}
// src/buttons/TwitterLoginButton.tsx
var import_react8 = __toESM(require("react"));
var config4 = {
activeStyle: { background: "#282e36" },
icon: Icon5,
style: { background: "#0f1419" },
text: "Log in with Twitter"
};
var TwitterLoginButton = createButton(config4);
function Icon5({ size, color }) {
return /* @__PURE__ */ import_react8.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24" }, /* @__PURE__ */ import_react8.default.createElement(
"path",
{
fill: color,
d: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"
}
));
}
// src/buttons/AmazonLoginButton.tsx
var import_react9 = __toESM(require("react"));
var config5 = {
activeStyle: { background: "#ff9f23" },
icon: Icon6,
style: { background: "#f9ae32" },
text: "Log in with Amazon"
};
var AmazonLoginButton = createButton(config5);
function Icon6({ size, color }) {
return /* @__PURE__ */ import_react9.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: color, width: size, height: size, viewBox: "0 0 24 24" }, /* @__PURE__ */ import_react9.default.createElement(
"path",
{
d: "M13.958 10.09c0 1.232.029 2.256-.591 3.351-.502.891-1.301 1.438-2.186 1.438-1.214 0-1.922-.924-1.922-2.292 0-2.692 2.415-3.182 4.7-3.182v.685zm3.186 7.705c-.209.189-.512.201-.745.074-1.052-.872-1.238-1.276-1.814-2.106-1.734 1.767-2.962 2.297-5.209 2.297-2.66 0-4.731-1.641-4.731-4.925 0-2.565 1.391-4.309 3.37-5.164 1.715-.754 4.11-.891 5.942-1.095v-.41c0-.753.06-1.642-.383-2.294-.385-.579-1.124-.82-1.775-.82-1.205 0-2.277.618-2.54 1.897-.054.285-.261.567-.549.582l-3.061-.333c-.259-.056-.548-.266-.472-.66.704-3.716 4.06-4.838 7.066-4.838 1.537 0 3.547.41 4.758 1.574 1.538 1.436 1.392 3.352 1.392 5.438v4.923c0 1.481.616 2.13 1.192 2.929.204.287.247.63-.01.839-.647.541-1.794 1.537-2.423 2.099l-.008-.007zm3.559 1.988c-2.748 1.472-5.735 2.181-8.453 2.181-4.027 0-7.927-1.393-11.081-3.706-.277-.202-.481.154-.251.416 2.925 3.326 6.786 5.326 11.076 5.326 3.061 0 6.614-1.214 9.066-3.494.406-.377.058-.945-.357-.723zm.67 2.216c-.091.227.104.32.31.147 1.339-1.12 1.685-3.466 1.411-3.804-.272-.336-2.612-.626-4.04.377-.22.154-.182.367.062.337.805-.096 2.595-.312 2.913.098.319.41-.355 2.094-.656 2.845z",
fillRule: "evenodd",
clipRule: "evenodd"
}
));
}
// src/buttons/InstagramLoginButton.tsx
var import_react10 = __toESM(require("react"));
var config6 = {
activeStyle: {
background: "linear-gradient(to right, rgb(214, 146, 60) 0%, rgb(160, 11, 143) 50%, rgb(56, 10, 115) 100%)"
},
icon: Icon7,
style: {
background: "linear-gradient(to right, rgb(236, 146, 35) 0%, rgb(177, 42, 160) 50%, rgb(105, 14, 224) 100%)"
},
text: "Log in with Instagram"
};
var InstagramLoginButton = createButton(config6);
function Icon7({ size, color }) {
return /* @__PURE__ */ import_react10.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 169.063 169.063" }, /* @__PURE__ */ import_react10.default.createElement("g", { fill: color }, /* @__PURE__ */ import_react10.default.createElement("path", { d: "M122.406,0H46.654C20.929,0,0,20.93,0,46.655v75.752c0,25.726,20.929,46.655,46.654,46.655h75.752 c25.727,0,46.656-20.93,46.656-46.655V46.655C169.063,20.93,148.133,0,122.406,0z M154.063,122.407 c0,17.455-14.201,31.655-31.656,31.655H46.654C29.2,154.063,15,139.862,15,122.407V46.655C15,29.201,29.2,15,46.654,15h75.752 c17.455,0,31.656,14.201,31.656,31.655V122.407z" }), /* @__PURE__ */ import_react10.default.createElement("path", { d: "M84.531,40.97c-24.021,0-43.563,19.542-43.563,43.563c0,24.02,19.542,43.561,43.563,43.561s43.563-19.541,43.563-43.561 C128.094,60.512,108.552,40.97,84.531,40.97z M84.531,113.093c-15.749,0-28.563-12.812-28.563-28.561 c0-15.75,12.813-28.563,28.563-28.563s28.563,12.813,28.563,28.563C113.094,100.281,100.28,113.093,84.531,113.093z" }), /* @__PURE__ */ import_react10.default.createElement("path", { d: "M129.921,28.251c-2.89,0-5.729,1.17-7.77,3.22c-2.051,2.04-3.23,4.88-3.23,7.78c0,2.891,1.18,5.73,3.23,7.78 c2.04,2.04,4.88,3.22,7.77,3.22c2.9,0,5.73-1.18,7.78-3.22c2.05-2.05,3.22-4.89,3.22-7.78c0-2.9-1.17-5.74-3.22-7.78 C135.661,29.421,132.821,28.251,129.921,28.251z" })));
}
// src/buttons/LinkedInLoginButton.tsx
var import_react11 = __toESM(require("react"));
var config7 = {
activeStyle: { background: "rgb(7, 112, 169)" },
icon: Icon8,
style: { background: "rgb(26, 129, 185)" },
text: "Log in with LinkedIn"
};
var LinkedInLoginButton = createButton(config7);
function Icon8({ size, color }) {
return /* @__PURE__ */ import_react11.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 430.117 430.117" }, /* @__PURE__ */ import_react11.default.createElement("g", null, /* @__PURE__ */ import_react11.default.createElement(
"path",
{
d: "M430.117,261.543V420.56h-92.188V272.193c0-37.271-13.334-62.707-46.703-62.707 c-25.473,0-40.632,17.142-47.301,33.724c-2.432,5.928-3.058,14.179-3.058,22.477V420.56h-92.219c0,0,1.242-251.285,0-277.32h92.21 v39.309c-0.187,0.294-0.43,0.611-0.606,0.896h0.606v-0.896c12.251-18.869,34.13-45.824,83.102-45.824 C384.633,136.724,430.117,176.361,430.117,261.543z M52.183,9.558C20.635,9.558,0,30.251,0,57.463 c0,26.619,20.038,47.94,50.959,47.94h0.616c32.159,0,52.159-21.317,52.159-47.94C103.128,30.251,83.734,9.558,52.183,9.558z M5.477,420.56h92.184v-277.32H5.477V420.56z",
fill: color
}
)));
}
// src/buttons/MicrosoftLoginButton.tsx
var import_react12 = __toESM(require("react"));
var config8 = {
activeStyle: { background: "#555555" },
icon: Icon9,
style: { background: "#333333" },
text: "Log in with Microsoft"
};
var MicrosoftLoginButton = createButton(config8);
function Icon9({ size, color }) {
return /* @__PURE__ */ import_react12.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, fill: color, x: "0px", y: "0px", viewBox: "0 0 48 48" }, /* @__PURE__ */ import_react12.default.createElement("path", { fill: "#ff5722", d: "M6 6H22V22H6z", transform: "rotate(-180 14 14)" }), /* @__PURE__ */ import_react12.default.createElement("path", { fill: "#4caf50", d: "M26 6H42V22H26z", transform: "rotate(-180 34 14)" }), /* @__PURE__ */ import_react12.default.createElement("path", { fill: "#ffc107", d: "M26 26H42V42H26z", transform: "rotate(-180 34 34)" }), /* @__PURE__ */ import_react12.default.createElement("path", { fill: "#03a9f4", d: "M6 26H22V42H6z", transform: "rotate(-180 14 34)" }));
}
// src/buttons/BufferLoginButton.tsx
var import_react13 = __toESM(require("react"));
var config9 = {
activeStyle: { background: "#1171BB" },
icon: Icon10,
style: { background: "#168EEA" },
text: "Log in with Buffer"
};
var BufferLoginButton = createButton(config9);
function Icon10({ size, color }) {
return /* @__PURE__ */ import_react13.default.createElement(
"svg",
{
"aria-labelledby": "simpleicons-buffer-icon",
role: "img",
viewBox: "0 0 24 24",
width: size,
height: size,
xmlns: "http://www.w3.org/2000/svg"
},
/* @__PURE__ */ import_react13.default.createElement(
"path",
{
d: "M23.784 18.24c.287.142.287.267 0 .374l-11.357 5.223c-.287.145-.57.145-.854 0L.213 18.614c-.284-.107-.284-.232 0-.375l2.722-1.23c.284-.14.57-.14.852 0l7.787 3.573c.285.14.57.14.854 0l7.787-3.574c.283-.14.568-.14.852 0l2.717 1.23zm0-6.454c.287.143.287.285 0 .426L12.427 17.44c-.287.104-.57.104-.854 0L.213 12.21c-.284-.143-.284-.284 0-.426l2.722-1.227c.284-.144.57-.144.852 0l7.787 3.57c.285.144.57.144.854 0l7.787-3.57c.283-.144.568-.144.852 0l2.717 1.226zM.214 5.76c-.285-.143-.285-.267 0-.375L11.574.16c.283-.14.57-.14.852 0l11.358 5.23c.287.107.287.232 0 .375l-11.357 5.223c-.287.143-.57.143-.854 0L.213 5.76z",
fill: color
}
)
);
}
// src/buttons/TelegramLoginButton.tsx
var import_react14 = __toESM(require("react"));
var config10 = {
activeStyle: {
background: "#0088cc"
},
icon: Icon11,
style: {
background: "#54a9eb"
},
text: "Log in with Telegram"
};
var TelegramLoginButton = createButton(config10);
function Icon11({ size }) {
return /* @__PURE__ */ import_react14.default.createElement(
"svg",
{
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 240 240",
width: size,
height: size,
style: { transform: "scale(1.5)" }
},
/* @__PURE__ */ import_react14.default.createElement("defs", null, /* @__PURE__ */ import_react14.default.createElement("linearGradient", { id: "b", x1: ".66", x2: ".851", y1: ".437", y2: ".802" }, /* @__PURE__ */ import_react14.default.createElement("stop", { offset: "0", stopColor: "#eff7fc" }), /* @__PURE__ */ import_react14.default.createElement("stop", { offset: "1", stopColor: "#fff" }))),
/* @__PURE__ */ import_react14.default.createElement("circle", { cx: "120", cy: "120", r: "120", fill: "url(#a)" }),
/* @__PURE__ */ import_react14.default.createElement("path", { fill: "#c8daea", d: "M98 175c-3.888 0-3.227-1.468-4.568-5.17L82 132.207 170 80" }),
/* @__PURE__ */ import_react14.default.createElement("path", { fill: "#a9c9dd", d: "M98 175c3 0 4.325-1.372 6-3l16-15.558-19.958-12.035" }),
/* @__PURE__ */ import_react14.default.createElement(
"path",
{
fill: "url(#b)",
d: "M100.04 144.41l48.36 35.729c5.519 3.045 9.501 1.468 10.876-5.123l19.685-92.763c2.015-8.08-3.08-11.746-8.36-9.349l-115.59 44.571c-7.89 3.165-7.843 7.567-1.438 9.528l29.663 9.259 68.673-43.325c3.242-1.966 6.218-.91 3.776 1.258"
}
)
);
}
// src/buttons/AppleLoginButton.tsx
var import_react15 = __toESM(require("react"));
var config11 = {
activeStyle: { background: "#EFF0EE" },
icon: Icon12,
style: { background: "#FFFFFF", color: "#000000" },
text: "Log in with Apple"
};
var AppleLoginButton = createButton(config11);
function Icon12({ size }) {
return /* @__PURE__ */ import_react15.default.createElement(
"svg",
{
width: size,
height: size,
viewBox: "0 0 56 56",
style: { transform: "scale(2.5)" },
version: "1.1",
xmlns: "http://www.w3.org/2000/svg"
},
/* @__PURE__ */ import_react15.default.createElement("g", { stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, /* @__PURE__ */ import_react15.default.createElement(
"path",
{
d: "M28.2226562,20.3846154 C29.0546875,20.3846154 30.0976562,19.8048315 30.71875,19.0317864 C31.28125,18.3312142 31.6914062,17.352829 31.6914062,16.3744437 C31.6914062,16.2415766 31.6796875,16.1087095 31.65625,16 C30.7304687,16.0362365 29.6171875,16.640178 28.9492187,17.4494596 C28.421875,18.06548 27.9414062,19.0317864 27.9414062,20.0222505 C27.9414062,20.1671964 27.9648438,20.3121424 27.9765625,20.3604577 C28.0351562,20.3725366 28.1289062,20.3846154 28.2226562,20.3846154 Z M25.2929688,35 C26.4296875,35 26.9335938,34.214876 28.3515625,34.214876 C29.7929688,34.214876 30.109375,34.9758423 31.375,34.9758423 C32.6171875,34.9758423 33.4492188,33.792117 34.234375,32.6325493 C35.1132812,31.3038779 35.4765625,29.9993643 35.5,29.9389701 C35.4179688,29.9148125 33.0390625,28.9122695 33.0390625,26.0979021 C33.0390625,23.6579784 34.9140625,22.5588048 35.0195312,22.474253 C33.7773438,20.6382708 31.890625,20.5899555 31.375,20.5899555 C29.9804688,20.5899555 28.84375,21.4596313 28.1289062,21.4596313 C27.3554688,21.4596313 26.3359375,20.6382708 25.1289062,20.6382708 C22.8320312,20.6382708 20.5,22.5950413 20.5,26.2911634 C20.5,28.5861411 21.3671875,31.013986 22.4335938,32.5842339 C23.3476562,33.9129053 24.1445312,35 25.2929688,35 Z",
fill: "#000000",
fillRule: "nonzero"
}
))
);
}
// src/buttons/DiscordLoginButton.tsx
var import_react16 = __toESM(require("react"));
var config12 = {
activeStyle: { background: "#697ec4" },
icon: Icon13,
style: { background: "#7289DA" },
text: "Log in with Discord"
};
var DiscordLoginButton = createButton(config12);
function Icon13({ size, color }) {
return /* @__PURE__ */ import_react16.default.createElement("svg", { role: "img", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", fill: color, width: size, height: size }, /* @__PURE__ */ import_react16.default.createElement("title", null, "Discord icon"), /* @__PURE__ */ import_react16.default.createElement("path", { d: "M20.222 0c1.406 0 2.54 1.137 2.607 2.475V24l-2.677-2.273-1.47-1.338-1.604-1.398.67 2.205H3.71c-1.402 0-2.54-1.065-2.54-2.476V2.48C1.17 1.142 2.31.003 3.715.003h16.5L20.222 0zm-6.118 5.683h-.03l-.202.2c2.073.6 3.076 1.537 3.076 1.537-1.336-.668-2.54-1.002-3.744-1.137-.87-.135-1.74-.064-2.475 0h-.2c-.47 0-1.47.2-2.81.735-.467.203-.735.336-.735.336s1.002-1.002 3.21-1.537l-.135-.135s-1.672-.064-3.477 1.27c0 0-1.805 3.144-1.805 7.02 0 0 1 1.74 3.743 1.806 0 0 .4-.533.805-1.002-1.54-.468-2.14-1.404-2.14-1.404s.134.066.335.2h.06c.03 0 .044.015.06.03v.006c.016.016.03.03.06.03.33.136.66.27.93.4.466.202 1.065.403 1.8.536.93.135 1.996.2 3.21 0 .6-.135 1.2-.267 1.8-.535.39-.2.87-.4 1.397-.737 0 0-.6.936-2.205 1.404.33.466.795 1 .795 1 2.744-.06 3.81-1.8 3.87-1.726 0-3.87-1.815-7.02-1.815-7.02-1.635-1.214-3.165-1.26-3.435-1.26l.056-.02zm.168 4.413c.703 0 1.27.6 1.27 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334.002-.74.573-1.338 1.27-1.338zm-4.543 0c.7 0 1.266.6 1.266 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334 0-.74.57-1.338 1.27-1.338z" }));
}
// src/buttons/OktaLoginButton.tsx
var import_react17 = __toESM(require("react"));
var config13 = {
activeStyle: { background: "#f5f5f5" },
icon: Icon14,
style: { background: "white", color: "black" },
text: "Log in with Okta"
};
var OktaLoginButton = createButton(config13);
function Icon14({ size }) {
return /* @__PURE__ */ import_react17.default.createElement(
"svg",
{
version: "1.1",
xmlns: "http://www.w3.org/2000/svg",
x: "0px",
y: "0px",
viewBox: "0 0 400 134.7",
width: size,
height: size
},
/* @__PURE__ */ import_react17.default.createElement("g", null, /* @__PURE__ */ import_react17.default.createElement("g", null, /* @__PURE__ */ import_react17.default.createElement(
"path",
{
fill: "#007DC1",
d: "M50.3,33.8C22.5,33.8,0,56.3,0,84.1s22.5,50.3,50.3,50.3s50.3-22.5,50.3-50.3S78.1,33.8,50.3,33.8z\n M50.3,109.3c-13.9,0-25.2-11.3-25.2-25.2s11.3-25.2,25.2-25.2s25.2,11.3,25.2,25.2S64.2,109.3,50.3,109.3z"
}
)), /* @__PURE__ */ import_react17.default.createElement(
"path",
{
fill: "#007DC1",
d: "M138.7,101c0-4,4.8-5.9,7.6-3.1c12.6,12.8,33.4,34.8,33.5,34.9c0.3,0.3,0.6,0.8,1.8,1.2\n c0.5,0.2,1.3,0.2,2.2,0.2l22.7,0c4.1,0,5.3-4.7,3.4-7.1l-37.6-38.5l-2-2c-4.3-5.1-3.8-7.1,1.1-12.3L201.2,41c1.9-2.4,0.7-7-3.5-7\n h-20.6c-0.8,0-1.4,0-2,0.2c-1.2,0.4-1.7,0.8-2,1.2c-0.1,0.1-16.6,17.9-26.8,28.8c-2.8,3-7.8,1-7.8-3.1l0-57.1c0-2.9-2.4-4-4.3-4\n h-16.8c-2.9,0-4.3,1.9-4.3,3.6v126.6c0,2.9,2.4,3.7,4.4,3.7h16.8c2.6,0,4.3-1.9,4.3-3.8v-1.3V101z"
}
), /* @__PURE__ */ import_react17.default.createElement(
"path",
{
fill: "#007DC1",
d: "M275.9,129.6l-1.8-16.8c-0.2-2.3-2.4-3.9-4.7-3.5c-1.3,0.2-2.6,0.3-3.9,0.3c-13.4,0-24.3-10.5-25.1-23.8\n c0-0.4,0-0.9,0-1.4V63.8c0-2.7,2-4.9,4.7-4.9l22.5,0c1.6,0,4-1.4,4-4.3V38.7c0-3.1-2-4.7-3.8-4.7h-22.7c-2.6,0-4.7-1.9-4.8-4.5\n l0-25.5c0-1.6-1.2-4-4.3-4h-16.7c-2.1,0-4.1,1.3-4.1,3.9c0,0,0,81.5,0,81.9c0.7,27.2,23,48.9,50.3,48.9c2.3,0,4.5-0.2,6.7-0.5\n C274.6,133.9,276.2,131.9,275.9,129.6z"
}
)),
/* @__PURE__ */ import_react17.default.createElement("g", null, /* @__PURE__ */ import_react17.default.createElement(
"path",
{
fill: "#007DC1",
d: "M397.1,108.5c-14.2,0-16.4-5.1-16.4-24.2c0-0.1,0-0.1,0-0.2l0-45.9c0-1.6-1.2-4.3-4.4-4.3h-16.8\n c-2.1,0-4.4,1.7-4.4,4.3l0,2.1c-7.3-4.2-15.8-6.6-24.8-6.6c-27.8,0-50.3,22.5-50.3,50.3c0,27.8,22.5,50.3,50.3,50.3\n c12.5,0,23.9-4.6,32.7-12.1c4.7,7.2,12.3,12,24.2,12.1c2,0,12.8,0.4,12.8-4.7v-17.9C400,110.2,398.8,108.5,397.1,108.5z\n M330.4,109.3c-13.9,0-25.2-11.3-25.2-25.2c0-13.9,11.3-25.2,25.2-25.2c13.9,0,25.2,11.3,25.2,25.2\n C355.5,98,344.2,109.3,330.4,109.3z"
}
))
);
}
// src/buttons/SlackLoginButton.tsx
var import_react18 = __toESM(require("react"));
var config14 = {
activeStyle: { background: "#f5f5f5" },
icon: Icon15,
style: { background: "white", color: "black" },
text: "Log in with Slack"
};
var SlackLoginButton = createButton(config14);
function Icon15({ size, color }) {
return /* @__PURE__ */ import_react18.default.createElement(
"svg",
{
enableBackground: "new 0 0 2447.6 2452.5",
viewBox: "0 0 2447.6 2452.5",
fill: color,
width: size,
height: size,
xmlns: "http://www.w3.org/2000/svg"
},
/* @__PURE__ */ import_react18.default.createElement("g", { clipRule: "evenodd", fillRule: "evenodd" }, /* @__PURE__ */ import_react18.default.createElement(
"path",
{
d: "m897.4 0c-135.3.1-244.8 109.9-244.7 245.2-.1 135.3 109.5 245.1 244.8 245.2h244.8v-245.1c.1-135.3-109.5-245.1-244.9-245.3.1 0 .1 0 0 0m0 654h-652.6c-135.3.1-244.9 109.9-244.8 245.2-.2 135.3 109.4 245.1 244.7 245.3h652.7c135.3-.1 244.9-109.9 244.8-245.2.1-135.4-109.5-245.2-244.8-245.3z",
fill: "#36c5f0"
}
), /* @__PURE__ */ import_react18.default.createElement(
"path",
{
d: "m2447.6 899.2c.1-135.3-109.5-245.1-244.8-245.2-135.3.1-244.9 109.9-244.8 245.2v245.3h244.8c135.3-.1 244.9-109.9 244.8-245.3zm-652.7 0v-654c.1-135.2-109.4-245-244.7-245.2-135.3.1-244.9 109.9-244.8 245.2v654c-.2 135.3 109.4 245.1 244.7 245.3 135.3-.1 244.9-109.9 244.8-245.3z",
fill: "#2eb67d"
}
), /* @__PURE__ */ import_react18.default.createElement(
"path",
{
d: "m1550.1 2452.5c135.3-.1 244.9-109.9 244.8-245.2.1-135.3-109.5-245.1-244.8-245.2h-244.8v245.2c-.1 135.2 109.5 245 244.8 245.2zm0-654.1h652.7c135.3-.1 244.9-109.9 244.8-245.2.2-135.3-109.4-245.1-244.7-245.3h-652.7c-135.3.1-244.9 109.9-244.8 245.2-.1 135.4 109.4 245.2 244.7 245.3z",
fill: "#ecb22e"
}
), /* @__PURE__ */ import_react18.default.createElement(
"path",
{
d: "m0 1553.2c-.1 135.3 109.5 245.1 244.8 245.2 135.3-.1 244.9-109.9 244.8-245.2v-245.2h-244.8c-135.3.1-244.9 109.9-244.8 245.2zm652.7 0v654c-.2 135.3 109.4 245.1 244.7 245.3 135.3-.1 244.9-109.9 244.8-245.2v-653.9c.2-135.3-109.4-245.1-244.7-245.3-135.4 0-244.9 109.8-244.8 245.1 0 0 0 .1 0 0",
fill: "#e01e5a"
}
))
);
}
// src/buttons/YahooLoginButton.tsx
var import_react19 = __toESM(require("react"));
var config15 = {
activeStyle: { background: "#ac3ade" },
icon: Icon16,
style: { background: "#720E9E" },
text: "Log in with Yahoo"
};
var YahooLoginButton = createButton(config15);
function Icon16({ size, color }) {
return /* @__PURE__ */ import_react19.default.createElement(
"svg",
{
version: "1.1",
xmlns: "http://www.w3.org/2000/svg",
x: "0px",
y: "0px",
viewBox: "0 0 291.319 291.319",
xmlSpace: "preserve",
fill: color,
width: size,
height: size
},
/* @__PURE__ */ import_react19.default.createElement("g", null, /* @__PURE__ */ import_react19.default.createElement(
"path",
{
fill: "transparent",
d: "M145.659,0c80.45,0,145.66,65.219,145.66,145.66c0,80.45-65.21,145.659-145.66,145.659\n S0,226.109,0,145.66C0,65.219,65.21,0,145.659,0z"
}
), /* @__PURE__ */ import_react19.default.createElement(
"path",
{
fill: "#FFFFFF",
d: "M212.353,114.98l0.155-0.027l4.825-5.371l-0.237-0.018l0.51-0.801h-67.595l2.604,9.249h18.444\n l-31.044,28.722c-6.336-9.24-21.184-30.479-31.544-46.411h19.254v-6.555l0.264-1.884l-0.264-0.036v-0.765H54.631v9.24H77.49\n c8.876,7.328,47.358,54.049,48.76,58.51c0.564,4.179,1.366,28.841-0.291,30.698c-1.994,2.868-22.814,1.32-26.483,1.593\n l-0.137,9.058c6.7,0.2,26.801-0.009,33.584-0.009c13.364,0,36.77-0.346,40.065-0.082l0.41-8.576l-26.901-0.401\n c-0.564-3.887-1.183-28.422-0.619-31.098c2.54-7.765,43.816-39.902,48.059-41.112l3.997-0.901h12.472\n C210.405,118.002,212.353,114.98,212.353,114.98z M202.266,179.079l11.689,0.892l13.628-49.979\n c-2.276-0.082-22.95-1.93-25.636-2.431L202.266,179.079z M200.245,187.091l0.064,12.208l5.917,0.492l6.391,0.446l1.875-11.944\n l-6.737-0.31C207.756,187.983,200.245,187.091,200.245,187.091z"
}
))
);
}
// src/buttons/ZaloLoginButton.tsx
var import_react20 = __toESM(require("react"));
var config16 = {
activeStyle: { background: "#008FF3" },
icon: Icon17,
style: { background: "#0573ff" },
text: "Log in with Zalo"
};
var ZaloLoginButton = createButton(config16);
function Icon17({ size, color }) {
return /* @__PURE__ */ import_react20.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24" }, /* @__PURE__ */ import_react20.default.createElement(
"path",
{
fill: color,
d: "M12.49 10.2722v-.4496h1.3467v6.3218h-.7704a.576.576 0 01-.5763-.5729l-.0006.0005a3.273 3.273 0 01-1.9372.6321c-1.8138 0-3.2844-1.4697-3.2844-3.2823 0-1.8125 1.4706-3.2822 3.2844-3.2822a3.273 3.273 0 011.9372.6321l.0006.0005zM6.9188 7.7896v.205c0 .3823-.051.6944-.2995 1.0605l-.03.0343c-.0542.0615-.1815.206-.2421.2843L2.024 14.8h4.8948v.7682a.5764.5764 0 01-.5767.5761H0v-.3622c0-.4436.1102-.6414.2495-.8476L4.8582 9.23H.1922V7.7896h6.7266zm8.5513 8.3548a.4805.4805 0 01-.4803-.4798v-7.875h1.4416v8.3548H15.47zM20.6934 9.6C22.52 9.6 24 11.0807 24 12.9044c0 1.8252-1.4801 3.306-3.3066 3.306-1.8264 0-3.3066-1.4808-3.3066-3.306 0-1.8237 1.4802-3.3044 3.3066-3.3044zm-10.1412 5.253c1.0675 0 1.9324-.8645 1.9324-1.9312 0-1.065-.865-1.9295-1.9324-1.9295s-1.9324.8644-1.9324 1.9295c0 1.0667.865 1.9312 1.9324 1.9312zm10.1412-.0033c1.0737 0 1.945-.8707 1.945-1.9453 0-1.073-.8713-1.9436-1.945-1.9436-1.0753 0-1.945.8706-1.945 1.9436 0 1.0746.8697 1.9453 1.945 1.9453z"
}
));
}
// src/buttons/TikTokLoginButton.tsx
var import_react21 = __toESM(require("react"));
var config17 = {
activeStyle: { background: "#333333" },
icon: Icon18,
style: { background: "#000000", color: "#FFFFFF" },
text: "Log in with TikTok"
};
var TikTokLoginButton = createButton(config17);
function Icon18({ size, color }) {
return /* @__PURE__ */ import_react21.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, fill: color, viewBox: "0 0 512 512" }, /* @__PURE__ */ import_react21.default.createElement("path", { d: "M412.19 118.66a109.27 109.27 0 01-9.45-5.5 132.87 132.87 0 01-24.27-20.62c-18.1-20.71-24.86-41.72-27.35-56.43h.1C349.14 23.9 350 16 350.13 16h-82.44v318.78c0 4.28 0 8.51-.18 12.69 0 .52-.05 1-.08 1.56 0 .23 0 .47-.05.71v.18a70 70 0 01-35.22 55.56 68.8 68.8 0 01-34.11 9c-38.41 0-69.54-31.32-69.54-70s31.13-70 69.54-70a68.9 68.9 0 0121.41 3.39l.1-83.94a153.14 153.14 0 00-118 34.52 161.79 161.79 0 00-35.3 43.53c-3.48 6-16.61 30.11-18.2 69.24-1 22.21 5.67 45.22 8.85 54.73v.2c2 5.6 9.75 24.71 22.38 40.82A167.53 167.53 0 00115 470.66v-.2l.2.2c39.91 27.12 84.16 25.34 84.16 25.34 7.66-.31 33.32 0 62.46-13.81 32.32-15.31 50.72-38.12 50.72-38.12a158.46 158.46 0 0027.64-45.93c7.46-19.61 9.95-43.13 9.95-52.53V176.49c1 .6 14.32 9.41 14.32 9.41s19.19 12.3 49.13 20.31c21.48 5.7 50.42 6.9 50.42 6.9v-81.84c-10.14 1.1-30.73-2.1-51.81-12.61z" }));
}
// src/buttons/MetamaskLoginButton.tsx
var import_react22 = __toESM(require("react"));
var config18 = {
activeStyle: { background: "#eeeeee" },
icon: Icon19,
style: { background: "#ffffff", color: "#333333" },
text: "Log in with Metamask"
};
var MetamaskLoginButton = createButton(config18);
function Icon19({ size }) {
return /* @__PURE__ */ import_react22.default.createElement(
"svg",
{
xmlns: "http://www.w3.org/2000/svg",
x: "0",
y: "0",
version: "1.1",
width: size,
height: size,
viewBox: "0 0 318.6 318.6",
xmlSpace: "preserve"
},
/* @__PURE__ */ import_react22.default.createElement(
"path",
{
fill: "#e2761b",
stroke: "#e2761b",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M274.1 35.5l-99.5 73.9L193 65.8z"
}
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
__spreadValues({
d: "M44.4 35.5l98.7 74.6-17.5-44.3zm193.9 171.3l-26.5 40.6 56.7 15.6 16.3-55.3zm-204.4.9L50.1 263l56.7-15.6-26.5-40.6z"
}, s1)
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
__spreadValues({
d: "M103.6 138.2l-15.8 23.9 56.3 2.5-2-60.5zm111.3 0l-39-34.8-1.3 61.2 56.2-2.5zM106.8 247.4l33.8-16.5-29.2-22.8zm71.1-16.5l33.9 16.5-4.7-39.3z"
}, s1)
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
{
fill: "#d7c1b3",
stroke: "#d7c1b3",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M211.8 247.4l-33.9-16.5 2.7 22.1-.3 9.3zm-105 0l31.5 14.9-.2-9.3 2.5-22.1z"
}
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
{
fill: "#233447",
stroke: "#233447",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M138.8 193.5l-28.2-8.3 19.9-9.1zm40.9 0l8.3-17.4 20 9.1z"
}
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
{
fill: "#cd6116",
stroke: "#cd6116",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M106.8 247.4l4.8-40.6-31.3.9zM207 206.8l4.8 40.6 26.5-39.7zm23.8-44.7l-56.2 2.5 5.2 28.9 8.3-17.4 20 9.1zm-120.2 23.1l20-9.1 8.2 17.4 5.3-28.9-56.3-2.5z"
}
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
{
fill: "#e4751f",
stroke: "#e4751f",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M87.8 162.1l23.6 46-.8-22.9zm120.3 23.1l-1 22.9 23.7-46zm-64-20.6l-5.3 28.9 6.6 34.1 1.5-44.9zm30.5 0l-2.7 18 1.2 45 6.7-34.1z"
}
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
__spreadValues({
d: "M179.8 193.5l-6.7 34.1 4.8 3.3 29.2-22.8 1-22.9zm-69.2-8.3l.8 22.9 29.2 22.8 4.8-3.3-6.6-34.1z"
}, s2)
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
{
fill: "#c0ad9e",
stroke: "#c0ad9e",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M180.3 262.3l.3-9.3-2.5-2.2h-37.7l-2.3 2.2.2 9.3-31.5-14.9 11 9 22.3 15.5h38.3l22.4-15.5 11-9z"
}
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
{
fill: "#161616",
stroke: "#161616",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M177.9 230.9l-4.8-3.3h-27.7l-4.8 3.3-2.5 22.1 2.3-2.2h37.7l2.5 2.2z"
}
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
{
fill: "#763d16",
stroke: "#763d16",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M278.3 114.2l8.5-40.8-12.7-37.9-96.2 71.4 37 31.3 52.3 15.3 11.6-13.5-5-3.6 8-7.3-6.2-4.8 8-6.1zM31.8 73.4l8.5 40.8-5.4 4 8 6.1-6.1 4.8 8 7.3-5 3.6 11.5 13.5 52.3-15.3 37-31.3-96.2-71.4z"
}
),
/* @__PURE__ */ import_react22.default.createElement(
"path",
__spreadValues({
d: "M267.2 153.5l-52.3-15.3 15.9 23.9-23.7 46 31.2-.4h46.5zm-163.6-15.3l-52.3 15.3-17.4 54.2h46.4l31.1.4-23.6-46zm71 26.4l3.3-57.7 15.2-41.1h-67.5l15 41.1 3.5 57.7 1.2 18.2.1 44.8h27.7l.2-44.8z"
}, s2)
)
);
}
var s1 = {
fill: "#e4761b",
stroke: "#e4761b",
strokeLinecap: "round",
strokeLinejoin: "round"
};
var s2 = {
fill: "#f6851b",
stroke: "#f6851b",
strokeLinecap: "round",
strokeLinejoin: "round"
};
// src/buttons/GitlabLoginButton.tsx
var import_react23 = __toESM(require("react"));
var config19 = {
icon: Icon20,
style: { background: "#fc6d26" },
activeStyle: { background: "#d55a1c" },
text: "Log in with Gitlab"
};
var GitlabLoginButton = createButton(config19);
function Icon20({ size, color }) {
return /* @__PURE__ */ import_react23.default.createElement("svg", { fill: color, role: "img", viewBox: "0 0 24 24", width: size, height: size, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react23.default.createElement("path", { d: "M21.94 13.11L20.89 9.89C20.89 9.86 20.88 9.83 20.87 9.8L18.76 3.32C18.65 3 18.33 2.75 17.96 2.75C17.6 2.75 17.28 3 17.17 3.33L15.17 9.5H8.84L6.83 3.33C6.72 3 6.4 2.75 6.04 2.75H6.04C5.67 2.75 5.35 3 5.24 3.33L3.13 9.82C3.13 9.82 3.13 9.83 3.13 9.83L2.06 13.11C1.9 13.61 2.07 14.15 2.5 14.45L11.72 21.16C11.89 21.28 12.11 21.28 12.28 21.15L21.5 14.45C21.93 14.15 22.1 13.61 21.94 13.11M8.15 10.45L10.72 18.36L4.55 10.45M13.28 18.37L15.75 10.78L15.85 10.45H19.46L13.87 17.61M17.97 3.94L19.78 9.5H16.16M14.86 10.45L13.07 15.96L12 19.24L9.14 10.45M6.03 3.94L7.84 9.5H4.23M3.05 13.69C2.96 13.62 2.92 13.5 2.96 13.4L3.75 10.97L9.57 18.42M20.95 13.69L14.44 18.42L14.46 18.39L20.25 10.97L21.04 13.4C21.08 13.5 21.04 13.62 20.95 13.69" }));
}
// src/buttons/XLoginButton.tsx
var import_react24 = __toESM(require("react"));
var config20 = {
activeStyle: { background: "#282e36" },
icon: Icon21,
style: { background: "#0f1419" },
text: "Log in with X"
};
var XLoginButton = createButton(config20);
function Icon21({ size, color }) {
return /* @__PURE__ */ import_react24.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24" }, /* @__PURE__ */ import_react24.default.createElement(
"path",
{
fill: color,
d: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"
}
));
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
AmazonLoginButton,
AppleLoginButton,
BufferLoginButton,
DiscordLoginButton,
FacebookLoginButton,
GithubLoginButton,
GitlabLoginButton,
GoogleLoginButton,
InstagramLoginButton,
LinkedInLoginButton,
MetamaskLoginButton,
MicrosoftLoginButton,
OktaLoginButton,
SlackLoginButton,
TelegramLoginButton,
TikTokLoginButton,
TwitterLoginButton,
XLoginButton,
YahooLoginButton,
ZaloLoginButton,
createButton
});