@nextworks/blocks-sections 0.1.0-alpha.8 → 0.2.0-alpha.2

package/dist/components/Team.js

@@ -1,107 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Link from "next/link";
-import { cn } from "@nextworks/blocks-core";
-const DefaultTeamData = [
-    {
-        name: "Alex Chen",
-        role: "CEO & Founder",
-        bio: "Full-stack developer with 8+ years.",
-        avatar: "👨‍💼",
-        socialLinks: [{ platform: "LinkedIn", url: "#", icon: "💼" }],
-    },
-    {
-        name: "Sarah Martinez",
-        role: "Lead Designer",
-        bio: "UI/UX expert.",
-        avatar: "👩‍🎨",
-        socialLinks: [{ platform: "Dribbble", url: "#", icon: "🎨" }],
-    },
-    {
-        name: "Jordan Patel",
-        role: "DevOps Engineer",
-        bio: "Automates cloud infra and CI/CD pipelines.",
-        avatar: "🛠️",
-        socialLinks: [{ platform: "GitHub", url: "#", icon: "🐙" }],
-    },
-    {
-        name: "Maya Thompson",
-        role: "Product Manager",
-        bio: "Drives roadmap and aligns cross‑functional teams.",
-        avatar: "🧭",
-        socialLinks: [{ platform: "Twitter", url: "#", icon: "🐦" }],
-    },
-];
-/**
- * Internal presentational card for a single team member.
- * Receives already-merged className strings from the parent.
- */
-function TeamCard({ member, card = { className: "" }, cardContent = { className: "" }, avatar = { className: "" }, name = { className: "" }, role = { className: "" }, bio = { className: "" }, socialLinks = { className: "" }, socialLink = { className: "" }, }) {
-    return (_jsx("div", { className: card.className, children: _jsxs("div", { className: cardContent.className, children: [_jsx("div", { className: avatar.className, children: member.avatar }), _jsx("h3", { className: name.className, children: member.name }), _jsx("p", { className: role.className, children: member.role }), _jsx("p", { className: bio.className, children: member.bio }), member.socialLinks && member.socialLinks.length > 0 && (_jsx("div", { className: socialLinks.className, children: member.socialLinks.map((social, index) => (_jsx(Link, { href: social.url, className: socialLink.className, title: social.platform, "aria-label": `${member.name}'s ${social.platform} profile`, children: social.icon }, index))) }))] }) }));
-}
-/**
- * Team section with heading, subheading, and a responsive member grid.
- *
- * @remarks
- * - Uses a slot-style API for className overrides merged via cn().
- * - Motion: enableMotion toggles hover lift on cards.
- * - Accessibility: semantic <section> with aria-label.
- *
- * @example
- * <Team teamMembers={[{ name: 'Alex', role: 'Engineer' }]} />
- */
-export function Team({ id, className, teamMembers = DefaultTeamData, teamHeadingText = "Meet Our Team", teamSubheadingText = "The talented people behind your success", section, container, header, heading, subheading, grid, card, cardContent, avatar, name, role, bio, socialLinks, socialLink, enableMotion = true, ariaLabel = "Team section", }) {
-    var _a, _b;
-    // Defaults for slots
-    const defaultSection = "py-16 px-6 bg-muted";
-    const defaultContainer = "max-w-7xl mx-auto";
-    const defaultHeader = "space-y-12 items-center";
-    const defaultHeadingClass = "text-3xl font-bold font-poppins text-foreground text-center text-[var(--heading-fg)]";
-    const defaultSubheadingClass = "text-lg font-inter text-muted-foreground opacity-80 leading-relaxed text-center max-w-2xl text-[var(--subheading-fg)]";
-    const defaultGrid = "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 w-full";
-    const defaultCardBase = "bg-card p-6 rounded-lg shadow-md text-center border border-border bg-[var(--card-bg)] text-[var(--card-fg)] border-[var(--card-border)] shadow-[var(--card-shadow)]";
-    const defaultCardContent = "flex flex-col items-center space-y-4";
-    const defaultAvatar = "text-4xl mb-2";
-    const defaultName = "text-xl font-bold font-poppins text-card-foreground text-[var(--card-fg)]";
-    const defaultRole = "text-md font-semibold font-poppins text-primary";
-    const defaultBio = "text-sm font-inter text-muted-foreground opacity-80 leading-relaxed text-[var(--card-muted-fg)]";
-    const defaultSocialLinks = "flex gap-3 mt-2";
-    const defaultSocialLink = "text-lg text-primary hover:text-accent-foreground transition-colors duration-200";
-    // Motion control for card
-    const motionCard = enableMotion
-        ? "transition-transform duration-200 hover:-translate-y-1"
-        : "transition-none hover:!translate-y-0";
-    // Merge slot classes using cn (defaults first, then overrides)
-    const finalSectionClass = cn(defaultSection, section === null || section === void 0 ? void 0 : section.className, className);
-    const finalContainerClass = cn(defaultContainer, container === null || container === void 0 ? void 0 : container.className);
-    const finalHeaderClass = cn(defaultHeader, header === null || header === void 0 ? void 0 : header.className);
-    const finalGridClass = cn(defaultGrid, grid === null || grid === void 0 ? void 0 : grid.className);
-    const finalCardClass = cn(defaultCardBase, motionCard, card === null || card === void 0 ? void 0 : card.className);
-    const finalCardContentClass = cn(defaultCardContent, cardContent === null || cardContent === void 0 ? void 0 : cardContent.className);
-    const finalAvatarClass = cn(defaultAvatar, avatar === null || avatar === void 0 ? void 0 : avatar.className);
-    const finalNameClass = cn(defaultName, name === null || name === void 0 ? void 0 : name.className);
-    const finalRoleClass = cn(defaultRole, role === null || role === void 0 ? void 0 : role.className);
-    const finalBioClass = cn(defaultBio, bio === null || bio === void 0 ? void 0 : bio.className);
-    const finalSocialLinksClass = cn(defaultSocialLinks, socialLinks === null || socialLinks === void 0 ? void 0 : socialLinks.className);
-    const finalSocialLinkClass = cn(defaultSocialLink, socialLink === null || socialLink === void 0 ? void 0 : socialLink.className);
-    // Normalize heading/subheading allowing string or object, plus slot class merges
-    const normalizedHeading = typeof teamHeadingText === "string"
-        ? {
-            text: teamHeadingText,
-            className: cn(defaultHeadingClass, heading === null || heading === void 0 ? void 0 : heading.className),
-        }
-        : {
-            text: (_a = teamHeadingText === null || teamHeadingText === void 0 ? void 0 : teamHeadingText.text) !== null && _a !== void 0 ? _a : "Meet Our Team",
-            className: cn(defaultHeadingClass, teamHeadingText === null || teamHeadingText === void 0 ? void 0 : teamHeadingText.className, heading === null || heading === void 0 ? void 0 : heading.className),
-        };
-    const normalizedSubheading = typeof teamSubheadingText === "string"
-        ? {
-            text: teamSubheadingText,
-            className: cn(defaultSubheadingClass, subheading === null || subheading === void 0 ? void 0 : subheading.className),
-        }
-        : {
-            text: (_b = teamSubheadingText === null || teamSubheadingText === void 0 ? void 0 : teamSubheadingText.text) !== null && _b !== void 0 ? _b : "The talented people behind your success",
-            className: cn(defaultSubheadingClass, teamSubheadingText === null || teamSubheadingText === void 0 ? void 0 : teamSubheadingText.className, subheading === null || subheading === void 0 ? void 0 : subheading.className),
-        };
-    return (_jsx("section", { id: id || "team", className: finalSectionClass, "aria-label": ariaLabel, children: _jsx("div", { className: finalContainerClass, children: _jsxs("div", { className: finalHeaderClass, children: [_jsxs("div", { className: "mx-auto flex max-w-2xl flex-col items-center space-y-4 text-center", children: [_jsx("h2", { className: normalizedHeading.className, children: normalizedHeading.text }), _jsx("p", { className: normalizedSubheading.className, children: normalizedSubheading.text })] }), _jsx("div", { className: finalGridClass, children: teamMembers.map((member, index) => (_jsx(TeamCard, { member: member, card: { className: finalCardClass }, cardContent: { className: finalCardContentClass }, avatar: { className: finalAvatarClass }, name: { className: finalNameClass }, role: { className: finalRoleClass }, bio: { className: finalBioClass }, socialLinks: { className: finalSocialLinksClass }, socialLink: { className: finalSocialLinkClass } }, index))) })] }) }) }));
-}

package/dist/components/Testimonials.js

@@ -1,46 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from "@nextworks/blocks-core";
-import { TestimonialCard } from "@nextworks/blocks-core";
-const defaultTestimonialData = [
-    {
-        testimonialText: "Lorem ipsum dolor sit amet! Consectetur adipiscing elit.",
-        testimonialAuthor: " - Cillum Dolore",
-        testimonialAuthorInitials: "CD",
-    },
-    {
-        testimonialText: "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi!",
-        testimonialAuthor: " - Voluptate Velit",
-        testimonialAuthorInitials: "VV",
-    },
-    {
-        testimonialText: "Cillum dolore eu fugiat nulla pariatur!",
-        testimonialAuthor: " - Laboris Nisi",
-        testimonialAuthorInitials: "LN",
-    },
-];
-/**
- * Testimonials section that renders a grid of TestimonialCard items.
- *
- * @remarks
- * - Slot-style overrides match TestimonialCard sub-slots (card, content, text, etc.).
- * - Motion can be disabled via enableMotion.
- *
- * @example
- * <Testimonials testimonials={[{ testimonialText: 'Great!', testimonialAuthor: ' - Jane', testimonialAuthorInitials: 'J' }]} />
- */
-export function Testimonials({ id, className, testimonials = defaultTestimonialData, testimonialSectionHeader = "What Our Customers Say", enableMotion = true, section = { className: "py-16 px-6 bg-muted" }, container = { className: "max-w-7xl mx-auto" }, header = { className: "text-center mb-12" }, heading = {
-    className: "text-3xl md:text-4xl font-bold font-poppins text-foreground",
-}, grid = { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8" }, card = {
-    className: "bg-card/90 backdrop-blur p-6 rounded-lg shadow-md transition-transform duration-200 hover:-translate-y-1 border border-border bg-[var(--card-bg)] text-[var(--card-fg)] border-[var(--card-border)] shadow-[var(--card-shadow)]",
-}, content = { className: "flex flex-col space-y-4" }, text = {
-    className: "text-card-foreground text-base leading-relaxed italic font-inter text-[var(--card-fg)]",
-}, author = {
-    className: "text-muted-foreground text-sm font-medium font-poppins text-[var(--card-muted-fg)]",
-}, avatar = {
-    className: "w-12 h-12 bg-primary text-primary-foreground rounded-full flex items-center justify-center text-lg font-bold bg-[var(--badge-bg)] text-[var(--badge-fg)] border-[var(--badge-border)]",
-}, avatarText = { className: "text-primary-foreground font-bold" }, ariaLabel = "Testimonials section", }) {
-    return (_jsx("section", { id: id || "testimonials", className: cn(section.className, className), "aria-label": ariaLabel, children: _jsxs("div", { className: container.className, children: [_jsx("div", { className: header.className, children: _jsx("h2", { className: heading.className, children: testimonialSectionHeader }) }), _jsx("div", { className: grid.className, children: testimonials.map((testimonial, index) => (_jsx(TestimonialCard, { testimonialText: testimonial.testimonialText, testimonialAuthor: testimonial.testimonialAuthor, testimonialAuthorInitials: testimonial.testimonialAuthorInitials, card: {
-                            className: cn(card.className, !enableMotion && "transition-none hover:!translate-y-0"),
-                        }, content: content, text: text, author: author, avatar: avatar, avatarText: avatarText }, index))) })] }) }));
-}

package/dist/components/TrustBadges.js

@@ -1,46 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from "@nextworks/blocks-core";
-const defaultTrustBadgeData = [
-    {
-        badgeText: "10,000+ businesses",
-        badgeDescription: "Trusted by",
-        badgeIcon: "📊",
-    },
-    {
-        badgeText: "SOC 2 Compliant",
-        badgeDescription: "Enterprise security",
-        badgeIcon: "🔒",
-    },
-    {
-        badgeText: "99.9% Uptime",
-        badgeDescription: "Reliable service",
-        badgeIcon: "⚡",
-    },
-];
-/**
- * Compact section to showcase trust signals like usage stats and compliance.
- *
- * @remarks
- * - Horizontal by default; switch to vertical with layout="vertical".
- * - Hover motion can be disabled via enableMotion.
- *
- * @example
- * <TrustBadges badges={[{ badgeText: 'SOC 2', badgeDescription: 'Security', badgeIcon: '🔒' }]} />
- */
-export function TrustBadges({ id, className, badges = defaultTrustBadgeData, trustBadgesSectionHeader, section = { className: "py-8 px-6 bg-muted" }, container = { className: "max-w-7xl mx-auto" }, header = { className: "text-center mb-6" }, heading = {
-    className: "text-xl font-semibold text-foreground text-[var(--heading-fg)]",
-}, badgesContainer = {
-    className: "flex flex-col md:flex-row justify-center items-center gap-8 flex-wrap",
-}, badge = {
-    className: "flex flex-col items-center text-center min-w-[200px] transition-all duration-300 ease-in-out hover:scale-[1.02]",
-}, badgeContent = { className: "flex flex-col items-center space-y-2" }, icon = { className: "text-2xl mb-2" }, description = {
-    className: "text-sm font-medium text-muted-foreground text-[var(--card-muted-fg)]",
-}, text = {
-    className: "text-lg font-bold text-foreground text-[var(--card-fg)]",
-}, layout = "horizontal", enableMotion = true, ariaLabel = "Trust badges section", }) {
-    const containerClasses = layout === "vertical"
-        ? "flex flex-col justify-center items-center gap-8"
-        : badgesContainer.className;
-    return (_jsx("section", { id: id || "trust-badges", className: cn(section.className, className), "aria-label": ariaLabel, children: _jsxs("div", { className: container.className, children: [trustBadgesSectionHeader && (_jsx("div", { className: header.className, children: _jsx("h2", { className: heading.className, children: trustBadgesSectionHeader }) })), _jsx("div", { className: containerClasses, children: badges.map((badgeData, index) => (_jsx("div", { className: cn(badge.className, !enableMotion && "transition-none hover:!scale-100"), children: _jsxs("div", { className: badgeContent.className, children: [badgeData.badgeIcon && (_jsx("div", { className: icon.className, children: badgeData.badgeIcon })), badgeData.badgeDescription && (_jsx("p", { className: description.className, children: badgeData.badgeDescription })), _jsx("p", { className: text.className, children: badgeData.badgeText })] }) }, index))) })] }) }));
-}