@smitch/fluid/lib/socialshare/SocialShare.js

A lightweight, Tailwind-powered React/Next.js UI component library.

"use client";
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
import { jsx as _jsx } from "react/jsx-runtime";
import { useMemo } from "react";
import { twMerge } from "tailwind-merge";
import dynamic from "next/dynamic";
var XButton = dynamic(function () { return import("./buttons/XButton"); }, { ssr: false });
var FacebookButton = dynamic(function () { return import("./buttons/FacebookButton"); }, { ssr: false });
var LinkedInButton = dynamic(function () { return import("./buttons/LinkedinButton"); }, { ssr: false });
var SlackButton = dynamic(function () { return import("./buttons/SlackButton"); }, { ssr: false });
var WhatsAppButton = dynamic(function () { return import("./buttons/WhatsappButton"); }, { ssr: false });
var RedditButton = dynamic(function () { return import("./buttons/RedditButton"); }, { ssr: false });
var PinterestButton = dynamic(function () { return import("./buttons/PinterestButton"); }, { ssr: false });
var TelegramButton = dynamic(function () { return import("./buttons/TelegramButton"); }, { ssr: false });
var EmailButton = dynamic(function () { return import("./buttons/EmailButton"); }, { ssr: false });
var BlueskyButton = dynamic(function () { return import("./buttons/BlueskyButton"); }, { ssr: false });
var buttonComponents = {
    X: XButton,
    Facebook: FacebookButton,
    LinkedIn: LinkedInButton,
    Slack: SlackButton,
    WhatsApp: WhatsAppButton,
    Reddit: RedditButton,
    Pinterest: PinterestButton,
    Telegram: TelegramButton,
    Email: EmailButton,
    Bluesky: BlueskyButton,
};
var gapSpacing = {
    none: "gap-0",
    sm: "gap-1",
    md: "gap-2",
    lg: "gap-3",
    xl: "gap-4",
};
var layouts = {
    horizontal: "flex-row",
    vertical: "flex-col",
};
var SocialShare = function (_a) {
    var text = _a.text, buttons = _a.buttons, _b = _a.btnShape, btnShape = _b === void 0 ? "rounded" : _b, _c = _a.size, size = _c === void 0 ? "md" : _c, _d = _a.gap, gap = _d === void 0 ? "none" : _d, _e = _a.layout, layout = _e === void 0 ? "horizontal" : _e, _f = _a.grayscale, grayscale = _f === void 0 ? false : _f, _g = _a.className, className = _g === void 0 ? "" : _g, style = _a.style;
    var gapClasses = useMemo(function () { return gapSpacing[gap]; }, [gap]);
    var layoutClasses = useMemo(function () { return layouts[layout]; }, [layout]);
    return (_jsx("div", { className: twMerge("social-share w-fit flex flex-wrap items-center ".concat(layoutClasses, " ").concat(gapClasses, " ").concat(grayscale ? "grayscale" : ""), className), style: style, children: buttons.map(function (btn) {
            var BtnComponent = buttonComponents[btn];
            if (!BtnComponent)
                return null;
            var needsText = !["Facebook", "LinkedIn"].includes(btn);
            var props = needsText ? { text: text } : {};
            return _jsx(BtnComponent, __assign({ btnShape: btnShape, size: size }, props), btn);
        }) }));
};
export default SocialShare;
//# sourceMappingURL=SocialShare.js.map