@tampadevs/react 0.1.0

package/dist/index7.js

@@ -0,0 +1,254 @@
+import { jsxs as d, Fragment as b, jsx as r } from "react/jsx-runtime";
+import { useState as u } from "react";
+import { clsx as l } from "./index28.js";
+import { Logo as f } from "./index6.js";
+function N({
+  links: i = [],
+  actions: n = [],
+  homeHref: s = "/",
+  sticky: h = !0,
+  logo: m,
+  className: c
+}) {
+  const [a, t] = u(!1), _ = () => {
+    t(!a);
+  }, o = (e, p = !1) => {
+    const g = p ? () => t(!1) : void 0;
+    return /* @__PURE__ */ d(
+      "a",
+      {
+        className: "td-header__link",
+        href: e.href,
+        target: e.external ? "_blank" : void 0,
+        rel: e.external ? "noopener noreferrer" : void 0,
+        onClick: g,
+        children: [
+          e.icon,
+          e.label
+        ]
+      },
+      e.href + e.label
+    );
+  };
+  return /* @__PURE__ */ d(b, { children: [
+    /* @__PURE__ */ r("header", { className: l("td-header", h && "td-header--sticky", c), children: /* @__PURE__ */ d("nav", { className: "td-header__nav", children: [
+      /* @__PURE__ */ d("div", { className: "td-header__inner", children: [
+        /* @__PURE__ */ d("div", { className: "td-header__left", children: [
+          /* @__PURE__ */ r("a", { className: "td-header__brand", href: s, children: m || /* @__PURE__ */ r(f, { variant: "full", size: "sm", textColor: "#1C2438" }) }),
+          /* @__PURE__ */ r("div", { className: "td-header__desktop-links", children: i.map((e) => o(e)) })
+        ] }),
+        /* @__PURE__ */ d("div", { className: "td-header__right", children: [
+          /* @__PURE__ */ r("div", { className: "td-header__actions", children: n.map((e) => o(e)) }),
+          /* @__PURE__ */ r(
+            "button",
+            {
+              className: "td-header__hamburger",
+              onClick: _,
+              "aria-label": "Toggle menu",
+              "aria-expanded": a,
+              children: a ? /* @__PURE__ */ r("svg", { fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) : /* @__PURE__ */ r("svg", { fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 6h16M4 12h16M4 18h16" }) })
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ r("div", { className: l("td-header__mobile-menu", a && "td-header__mobile-menu--open"), children: /* @__PURE__ */ d("div", { className: "td-header__mobile-inner", children: [
+        i.map((e) => o(e, !0)),
+        n.map((e) => o(e, !0))
+      ] }) })
+    ] }) }),
+    /* @__PURE__ */ r(k, {})
+  ] });
+}
+function k() {
+  return /* @__PURE__ */ r("style", { children: `
+      .td-header {
+        background: rgba(255, 255, 255, 0.7);
+        backdrop-filter: blur(24px);
+        -webkit-backdrop-filter: blur(24px);
+        border-bottom: 1px solid rgba(229, 231, 235, 0.5);
+        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05);
+      }
+
+      .td-header--sticky {
+        position: sticky;
+        top: 0;
+        z-index: 50;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-header {
+          background: rgba(3, 7, 18, 0.7);
+          border-bottom-color: rgba(31, 41, 55, 0.5);
+        }
+      }
+
+      .td-header__nav {
+        max-width: 80rem;
+        margin: 0 auto;
+        padding: 0 1rem;
+      }
+
+      @media (min-width: 640px) {
+        .td-header__nav {
+          padding: 0 1.5rem;
+        }
+      }
+
+      @media (min-width: 1024px) {
+        .td-header__nav {
+          padding: 0 2rem;
+        }
+      }
+
+      .td-header__inner {
+        display: flex;
+        justify-content: space-between;
+        height: 4rem;
+      }
+
+      .td-header__left {
+        display: flex;
+        align-items: center;
+        gap: 2rem;
+      }
+
+      .td-header__brand {
+        display: flex;
+        align-items: center;
+        text-decoration: none;
+      }
+
+      .td-header__desktop-links {
+        display: none;
+        align-items: center;
+        gap: 0.25rem;
+      }
+
+      @media (min-width: 768px) {
+        .td-header__desktop-links {
+          display: flex;
+        }
+      }
+
+      .td-header__link {
+        display: flex;
+        align-items: center;
+        gap: 0.5rem;
+        padding: 0.5rem 0.75rem;
+        border-radius: 0.5rem;
+        font-size: 0.875rem;
+        font-weight: 500;
+        color: #4B5563;
+        text-decoration: none;
+        transition: background-color 0.15s ease, color 0.15s ease;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-header__link {
+          color: #9CA3AF;
+        }
+      }
+
+      .td-header__link:hover {
+        background-color: rgba(243, 244, 246, 1);
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-header__link:hover {
+          background-color: rgba(31, 41, 55, 1);
+        }
+      }
+
+      .td-header__link svg {
+        width: 1.25rem;
+        height: 1.25rem;
+      }
+
+      .td-header__right {
+        display: flex;
+        align-items: center;
+        gap: 1rem;
+      }
+
+      .td-header__actions {
+        display: none;
+        align-items: center;
+        gap: 0.25rem;
+      }
+
+      @media (min-width: 768px) {
+        .td-header__actions {
+          display: flex;
+        }
+      }
+
+      .td-header__hamburger {
+        display: flex;
+        padding: 0.5rem;
+        border-radius: 0.5rem;
+        color: #4B5563;
+        background: none;
+        border: none;
+        cursor: pointer;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-header__hamburger {
+          color: #9CA3AF;
+        }
+      }
+
+      .td-header__hamburger:hover {
+        background-color: rgba(243, 244, 246, 1);
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-header__hamburger:hover {
+          background-color: rgba(31, 41, 55, 1);
+        }
+      }
+
+      @media (min-width: 768px) {
+        .td-header__hamburger {
+          display: none;
+        }
+      }
+
+      .td-header__hamburger svg {
+        width: 1.5rem;
+        height: 1.5rem;
+      }
+
+      .td-header__mobile-menu {
+        display: none;
+        padding: 1rem 0;
+        border-top: 1px solid rgba(229, 231, 235, 1);
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-header__mobile-menu {
+          border-top-color: rgba(31, 41, 55, 1);
+        }
+      }
+
+      .td-header__mobile-menu--open {
+        display: block;
+      }
+
+      @media (min-width: 768px) {
+        .td-header__mobile-menu {
+          display: none !important;
+        }
+      }
+
+      .td-header__mobile-inner {
+        display: flex;
+        flex-direction: column;
+        gap: 0.25rem;
+      }
+    ` });
+}
+export {
+  N as Header
+};
+//# sourceMappingURL=index7.js.map

package/dist/index7.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index7.js","sources":["../src/components/Header.tsx"],"sourcesContent":["'use client';\n\nimport { useState, ReactNode } from 'react';\nimport { clsx } from 'clsx';\nimport { Logo } from './Logo';\n\nexport interface NavLink {\n  label: string;\n  href: string;\n  external?: boolean;\n  icon?: ReactNode;\n}\n\nexport interface HeaderProps {\n  links?: NavLink[];\n  actions?: NavLink[];\n  homeHref?: string;\n  sticky?: boolean;\n  logo?: ReactNode;\n  className?: string;\n}\n\nexport function Header({\n  links = [],\n  actions = [],\n  homeHref = '/',\n  sticky = true,\n  logo,\n  className,\n}: HeaderProps) {\n  const [mobileMenuOpen, setMobileMenuOpen] = useState(false);\n\n  const toggleMobileMenu = () => {\n    setMobileMenuOpen(!mobileMenuOpen);\n  };\n\n  const renderLink = (link: NavLink, closeMobile = false) => {\n    const handleClick = closeMobile ? () => setMobileMenuOpen(false) : undefined;\n\n    return (\n      <a\n        key={link.href + link.label}\n        className=\"td-header__link\"\n        href={link.href}\n        target={link.external ? '_blank' : undefined}\n        rel={link.external ? 'noopener noreferrer' : undefined}\n        onClick={handleClick}\n      >\n        {link.icon}\n        {link.label}\n      </a>\n    );\n  };\n\n  return (\n    <>\n      <header className={clsx('td-header', sticky && 'td-header--sticky', className)}>\n        <nav className=\"td-header__nav\">\n          <div className=\"td-header__inner\">\n            <div className=\"td-header__left\">\n              <a className=\"td-header__brand\" href={homeHref}>\n                {logo || <Logo variant=\"full\" size=\"sm\" textColor=\"#1C2438\" />}\n              </a>\n\n              <div className=\"td-header__desktop-links\">\n                {links.map(link => renderLink(link))}\n              </div>\n            </div>\n\n            <div className=\"td-header__right\">\n              <div className=\"td-header__actions\">\n                {actions.map(link => renderLink(link))}\n              </div>\n\n              <button\n                className=\"td-header__hamburger\"\n                onClick={toggleMobileMenu}\n                aria-label=\"Toggle menu\"\n                aria-expanded={mobileMenuOpen}\n              >\n                {mobileMenuOpen ? (\n                  <svg fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M6 18L18 6M6 6l12 12\" />\n                  </svg>\n                ) : (\n                  <svg fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M4 6h16M4 12h16M4 18h16\" />\n                  </svg>\n                )}\n              </button>\n            </div>\n          </div>\n\n          <div className={clsx('td-header__mobile-menu', mobileMenuOpen && 'td-header__mobile-menu--open')}>\n            <div className=\"td-header__mobile-inner\">\n              {links.map(link => renderLink(link, true))}\n              {actions.map(link => renderLink(link, true))}\n            </div>\n          </div>\n        </nav>\n      </header>\n      <HeaderStyles />\n    </>\n  );\n}\n\nfunction HeaderStyles() {\n  return (\n    <style>{`\n      .td-header {\n        background: rgba(255, 255, 255, 0.7);\n        backdrop-filter: blur(24px);\n        -webkit-backdrop-filter: blur(24px);\n        border-bottom: 1px solid rgba(229, 231, 235, 0.5);\n        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05);\n      }\n\n      .td-header--sticky {\n        position: sticky;\n        top: 0;\n        z-index: 50;\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-header {\n          background: rgba(3, 7, 18, 0.7);\n          border-bottom-color: rgba(31, 41, 55, 0.5);\n        }\n      }\n\n      .td-header__nav {\n        max-width: 80rem;\n        margin: 0 auto;\n        padding: 0 1rem;\n      }\n\n      @media (min-width: 640px) {\n        .td-header__nav {\n          padding: 0 1.5rem;\n        }\n      }\n\n      @media (min-width: 1024px) {\n        .td-header__nav {\n          padding: 0 2rem;\n        }\n      }\n\n      .td-header__inner {\n        display: flex;\n        justify-content: space-between;\n        height: 4rem;\n      }\n\n      .td-header__left {\n        display: flex;\n        align-items: center;\n        gap: 2rem;\n      }\n\n      .td-header__brand {\n        display: flex;\n        align-items: center;\n        text-decoration: none;\n      }\n\n      .td-header__desktop-links {\n        display: none;\n        align-items: center;\n        gap: 0.25rem;\n      }\n\n      @media (min-width: 768px) {\n        .td-header__desktop-links {\n          display: flex;\n        }\n      }\n\n      .td-header__link {\n        display: flex;\n        align-items: center;\n        gap: 0.5rem;\n        padding: 0.5rem 0.75rem;\n        border-radius: 0.5rem;\n        font-size: 0.875rem;\n        font-weight: 500;\n        color: #4B5563;\n        text-decoration: none;\n        transition: background-color 0.15s ease, color 0.15s ease;\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-header__link {\n          color: #9CA3AF;\n        }\n      }\n\n      .td-header__link:hover {\n        background-color: rgba(243, 244, 246, 1);\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-header__link:hover {\n          background-color: rgba(31, 41, 55, 1);\n        }\n      }\n\n      .td-header__link svg {\n        width: 1.25rem;\n        height: 1.25rem;\n      }\n\n      .td-header__right {\n        display: flex;\n        align-items: center;\n        gap: 1rem;\n      }\n\n      .td-header__actions {\n        display: none;\n        align-items: center;\n        gap: 0.25rem;\n      }\n\n      @media (min-width: 768px) {\n        .td-header__actions {\n          display: flex;\n        }\n      }\n\n      .td-header__hamburger {\n        display: flex;\n        padding: 0.5rem;\n        border-radius: 0.5rem;\n        color: #4B5563;\n        background: none;\n        border: none;\n        cursor: pointer;\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-header__hamburger {\n          color: #9CA3AF;\n        }\n      }\n\n      .td-header__hamburger:hover {\n        background-color: rgba(243, 244, 246, 1);\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-header__hamburger:hover {\n          background-color: rgba(31, 41, 55, 1);\n        }\n      }\n\n      @media (min-width: 768px) {\n        .td-header__hamburger {\n          display: none;\n        }\n      }\n\n      .td-header__hamburger svg {\n        width: 1.5rem;\n        height: 1.5rem;\n      }\n\n      .td-header__mobile-menu {\n        display: none;\n        padding: 1rem 0;\n        border-top: 1px solid rgba(229, 231, 235, 1);\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-header__mobile-menu {\n          border-top-color: rgba(31, 41, 55, 1);\n        }\n      }\n\n      .td-header__mobile-menu--open {\n        display: block;\n      }\n\n      @media (min-width: 768px) {\n        .td-header__mobile-menu {\n          display: none !important;\n        }\n      }\n\n      .td-header__mobile-inner {\n        display: flex;\n        flex-direction: column;\n        gap: 0.25rem;\n      }\n    `}</style>\n  );\n}\n"],"names":["Header","links","actions","homeHref","sticky","logo","className","mobileMenuOpen","setMobileMenuOpen","useState","toggleMobileMenu","renderLink","link","closeMobile","handleClick","jsxs","Fragment","jsx","clsx","Logo","HeaderStyles"],"mappings":"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"}

package/dist/index8.js

@@ -0,0 +1,237 @@
+import { jsxs as o, Fragment as p, jsx as e } from "react/jsx-runtime";
+import { clsx as _ } from "./index28.js";
+import { Logo as h } from "./index6.js";
+import { Icon as g } from "./index3.js";
+function w({
+  description: d,
+  linkGroups: l = [],
+  socials: n = [],
+  copyright: a,
+  logo: c,
+  className: s
+}) {
+  const m = a || `© ${(/* @__PURE__ */ new Date()).getFullYear()} Tampa Devs. All rights reserved.`;
+  return /* @__PURE__ */ o(p, { children: [
+    /* @__PURE__ */ e("footer", { className: _("td-footer", s), children: /* @__PURE__ */ o("div", { className: "td-footer__container", children: [
+      /* @__PURE__ */ o("div", { className: "td-footer__grid", children: [
+        /* @__PURE__ */ o("div", { className: "td-footer__brand-section", children: [
+          /* @__PURE__ */ e("div", { className: "td-footer__brand", children: c || /* @__PURE__ */ e(h, { variant: "full", size: "sm", textColor: "#1C2438" }) }),
+          d && /* @__PURE__ */ e("p", { className: "td-footer__description", children: d })
+        ] }),
+        l.map((r, i) => /* @__PURE__ */ o("div", { className: "td-footer__link-group", children: [
+          /* @__PURE__ */ e("h3", { children: r.title }),
+          /* @__PURE__ */ e("ul", { children: r.links.map((t, f) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
+            "a",
+            {
+              href: t.href,
+              target: t.external ? "_blank" : void 0,
+              rel: t.external ? "noopener noreferrer" : void 0,
+              children: t.label
+            }
+          ) }, f)) })
+        ] }, i))
+      ] }),
+      /* @__PURE__ */ o("div", { className: "td-footer__bottom", children: [
+        /* @__PURE__ */ e("p", { className: "td-footer__copyright", children: m }),
+        n.length > 0 && /* @__PURE__ */ e("div", { className: "td-footer__socials", children: n.map((r, i) => /* @__PURE__ */ o(
+          "a",
+          {
+            className: "td-footer__social-link",
+            href: r.href,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            children: [
+              /* @__PURE__ */ e("span", { className: "sr-only", children: r.name }),
+              /* @__PURE__ */ e(g, { name: r.icon, size: "sm" })
+            ]
+          },
+          i
+        )) })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ e(x, {})
+  ] });
+}
+function x() {
+  return /* @__PURE__ */ e("style", { children: `
+      .td-footer {
+        background-color: #F9FAFB;
+        border-top: 1px solid #E5E7EB;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-footer {
+          background-color: #111827;
+          border-top-color: #1F2937;
+        }
+      }
+
+      .td-footer__container {
+        max-width: 80rem;
+        margin: 0 auto;
+        padding: 3rem 1rem;
+      }
+
+      @media (min-width: 640px) {
+        .td-footer__container {
+          padding: 3rem 1.5rem;
+        }
+      }
+
+      @media (min-width: 1024px) {
+        .td-footer__container {
+          padding: 3rem 2rem;
+        }
+      }
+
+      .td-footer__grid {
+        display: grid;
+        grid-template-columns: 1fr;
+        gap: 2rem;
+      }
+
+      @media (min-width: 768px) {
+        .td-footer__grid {
+          grid-template-columns: 2fr 1fr 1fr;
+        }
+      }
+
+      .td-footer__brand-section {
+        grid-column: span 1;
+      }
+
+      .td-footer__brand {
+        display: inline-block;
+      }
+
+      .td-footer__description {
+        margin-top: 0.5rem;
+        font-size: 0.875rem;
+        color: #4B5563;
+        max-width: 28rem;
+        line-height: 1.5;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-footer__description {
+          color: #9CA3AF;
+        }
+      }
+
+      .td-footer__link-group h3 {
+        font-size: 0.875rem;
+        font-weight: 600;
+        color: #111827;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+        margin: 0 0 1rem 0;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-footer__link-group h3 {
+          color: white;
+        }
+      }
+
+      .td-footer__link-group ul {
+        list-style: none;
+        padding: 0;
+        margin: 0;
+        display: flex;
+        flex-direction: column;
+        gap: 0.5rem;
+      }
+
+      .td-footer__link-group a {
+        font-size: 0.875rem;
+        color: #4B5563;
+        text-decoration: none;
+        transition: color 0.15s ease;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-footer__link-group a {
+          color: #9CA3AF;
+        }
+      }
+
+      .td-footer__link-group a:hover {
+        color: #1C2438;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-footer__link-group a:hover {
+          color: white;
+        }
+      }
+
+      .td-footer__bottom {
+        margin-top: 2rem;
+        padding-top: 2rem;
+        border-top: 1px solid #E5E7EB;
+        display: flex;
+        flex-direction: column;
+        gap: 1rem;
+        align-items: center;
+      }
+
+      @media (min-width: 640px) {
+        .td-footer__bottom {
+          flex-direction: row;
+          justify-content: space-between;
+        }
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-footer__bottom {
+          border-top-color: #1F2937;
+        }
+      }
+
+      .td-footer__copyright {
+        font-size: 0.875rem;
+        color: #6B7280;
+        margin: 0;
+      }
+
+      .td-footer__socials {
+        display: flex;
+        align-items: center;
+        gap: 1rem;
+      }
+
+      .td-footer__social-link {
+        color: #9CA3AF;
+        transition: color 0.15s ease;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+
+      .td-footer__social-link:hover {
+        color: #4B5563;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        .td-footer__social-link:hover {
+          color: #D1D5DB;
+        }
+      }
+
+      .sr-only {
+        position: absolute;
+        width: 1px;
+        height: 1px;
+        padding: 0;
+        margin: -1px;
+        overflow: hidden;
+        clip: rect(0, 0, 0, 0);
+        white-space: nowrap;
+        border: 0;
+      }
+    ` });
+}
+export {
+  w as Footer
+};
+//# sourceMappingURL=index8.js.map

package/dist/index8.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index8.js","sources":["../src/components/Footer.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport { clsx } from 'clsx';\nimport { Logo } from './Logo';\nimport { Icon } from './Icon';\n\nexport interface FooterLink {\n  label: string;\n  href: string;\n  external?: boolean;\n}\n\nexport interface FooterLinkGroup {\n  title: string;\n  links: FooterLink[];\n}\n\nexport interface FooterSocialLink {\n  name: string;\n  href: string;\n  icon: 'github' | 'twitter' | 'linkedin' | 'globe' | 'mail';\n}\n\nexport interface FooterProps {\n  description?: string;\n  linkGroups?: FooterLinkGroup[];\n  socials?: FooterSocialLink[];\n  copyright?: string;\n  logo?: ReactNode;\n  className?: string;\n}\n\nexport function Footer({\n  description,\n  linkGroups = [],\n  socials = [],\n  copyright,\n  logo,\n  className,\n}: FooterProps) {\n  const copyrightText = copyright || `© ${new Date().getFullYear()} Tampa Devs. All rights reserved.`;\n\n  return (\n    <>\n      <footer className={clsx('td-footer', className)}>\n        <div className=\"td-footer__container\">\n          <div className=\"td-footer__grid\">\n            <div className=\"td-footer__brand-section\">\n              <div className=\"td-footer__brand\">\n                {logo || <Logo variant=\"full\" size=\"sm\" textColor=\"#1C2438\" />}\n              </div>\n              {description && <p className=\"td-footer__description\">{description}</p>}\n            </div>\n\n            {linkGroups.map((group, i) => (\n              <div key={i} className=\"td-footer__link-group\">\n                <h3>{group.title}</h3>\n                <ul>\n                  {group.links.map((link, j) => (\n                    <li key={j}>\n                      <a\n                        href={link.href}\n                        target={link.external ? '_blank' : undefined}\n                        rel={link.external ? 'noopener noreferrer' : undefined}\n                      >\n                        {link.label}\n                      </a>\n                    </li>\n                  ))}\n                </ul>\n              </div>\n            ))}\n          </div>\n\n          <div className=\"td-footer__bottom\">\n            <p className=\"td-footer__copyright\">{copyrightText}</p>\n\n            {socials.length > 0 && (\n              <div className=\"td-footer__socials\">\n                {socials.map((social, i) => (\n                  <a\n                    key={i}\n                    className=\"td-footer__social-link\"\n                    href={social.href}\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                  >\n                    <span className=\"sr-only\">{social.name}</span>\n                    <Icon name={social.icon} size=\"sm\" />\n                  </a>\n                ))}\n              </div>\n            )}\n          </div>\n        </div>\n      </footer>\n      <FooterStyles />\n    </>\n  );\n}\n\nfunction FooterStyles() {\n  return (\n    <style>{`\n      .td-footer {\n        background-color: #F9FAFB;\n        border-top: 1px solid #E5E7EB;\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-footer {\n          background-color: #111827;\n          border-top-color: #1F2937;\n        }\n      }\n\n      .td-footer__container {\n        max-width: 80rem;\n        margin: 0 auto;\n        padding: 3rem 1rem;\n      }\n\n      @media (min-width: 640px) {\n        .td-footer__container {\n          padding: 3rem 1.5rem;\n        }\n      }\n\n      @media (min-width: 1024px) {\n        .td-footer__container {\n          padding: 3rem 2rem;\n        }\n      }\n\n      .td-footer__grid {\n        display: grid;\n        grid-template-columns: 1fr;\n        gap: 2rem;\n      }\n\n      @media (min-width: 768px) {\n        .td-footer__grid {\n          grid-template-columns: 2fr 1fr 1fr;\n        }\n      }\n\n      .td-footer__brand-section {\n        grid-column: span 1;\n      }\n\n      .td-footer__brand {\n        display: inline-block;\n      }\n\n      .td-footer__description {\n        margin-top: 0.5rem;\n        font-size: 0.875rem;\n        color: #4B5563;\n        max-width: 28rem;\n        line-height: 1.5;\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-footer__description {\n          color: #9CA3AF;\n        }\n      }\n\n      .td-footer__link-group h3 {\n        font-size: 0.875rem;\n        font-weight: 600;\n        color: #111827;\n        text-transform: uppercase;\n        letter-spacing: 0.05em;\n        margin: 0 0 1rem 0;\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-footer__link-group h3 {\n          color: white;\n        }\n      }\n\n      .td-footer__link-group ul {\n        list-style: none;\n        padding: 0;\n        margin: 0;\n        display: flex;\n        flex-direction: column;\n        gap: 0.5rem;\n      }\n\n      .td-footer__link-group a {\n        font-size: 0.875rem;\n        color: #4B5563;\n        text-decoration: none;\n        transition: color 0.15s ease;\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-footer__link-group a {\n          color: #9CA3AF;\n        }\n      }\n\n      .td-footer__link-group a:hover {\n        color: #1C2438;\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-footer__link-group a:hover {\n          color: white;\n        }\n      }\n\n      .td-footer__bottom {\n        margin-top: 2rem;\n        padding-top: 2rem;\n        border-top: 1px solid #E5E7EB;\n        display: flex;\n        flex-direction: column;\n        gap: 1rem;\n        align-items: center;\n      }\n\n      @media (min-width: 640px) {\n        .td-footer__bottom {\n          flex-direction: row;\n          justify-content: space-between;\n        }\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-footer__bottom {\n          border-top-color: #1F2937;\n        }\n      }\n\n      .td-footer__copyright {\n        font-size: 0.875rem;\n        color: #6B7280;\n        margin: 0;\n      }\n\n      .td-footer__socials {\n        display: flex;\n        align-items: center;\n        gap: 1rem;\n      }\n\n      .td-footer__social-link {\n        color: #9CA3AF;\n        transition: color 0.15s ease;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n      }\n\n      .td-footer__social-link:hover {\n        color: #4B5563;\n      }\n\n      @media (prefers-color-scheme: dark) {\n        .td-footer__social-link:hover {\n          color: #D1D5DB;\n        }\n      }\n\n      .sr-only {\n        position: absolute;\n        width: 1px;\n        height: 1px;\n        padding: 0;\n        margin: -1px;\n        overflow: hidden;\n        clip: rect(0, 0, 0, 0);\n        white-space: nowrap;\n        border: 0;\n      }\n    `}</style>\n  );\n}\n"],"names":["Footer","description","linkGroups","socials","copyright","logo","className","copyrightText","jsxs","Fragment","jsx","clsx","Logo","group","link","j","social","Icon","FooterStyles"],"mappings":"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"}

package/dist/index9.js

@@ -0,0 +1,142 @@
+import { jsxs as o, Fragment as _, jsx as r } from "react/jsx-runtime";
+import { useRef as p } from "react";
+import { clsx as h } from "./index28.js";
+function g({
+  title: t,
+  scrollAmount: a = 400,
+  hideControls: l = !1,
+  gap: s = "1.5rem",
+  children: c,
+  className: i
+}) {
+  const e = p(null), n = (d) => {
+    if (e.current) {
+      const u = d === "left" ? -a : a;
+      e.current.scrollBy({
+        left: u,
+        behavior: "smooth"
+      });
+    }
+  };
+  return /* @__PURE__ */ o(_, { children: [
+    /* @__PURE__ */ o("div", { className: h("td-carousel", i), children: [
+      t && /* @__PURE__ */ r("h2", { className: "td-carousel__title", children: t }),
+      /* @__PURE__ */ o("div", { className: "td-carousel__wrapper", children: [
+        !l && /* @__PURE__ */ r(
+          "button",
+          {
+            className: "td-carousel__nav td-carousel__nav--left",
+            onClick: () => n("left"),
+            "aria-label": "Scroll left",
+            children: /* @__PURE__ */ r("svg", { fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) })
+          }
+        ),
+        /* @__PURE__ */ r(
+          "div",
+          {
+            ref: e,
+            className: "td-carousel__track",
+            style: { gap: s },
+            children: c
+          }
+        ),
+        !l && /* @__PURE__ */ r(
+          "button",
+          {
+            className: "td-carousel__nav td-carousel__nav--right",
+            onClick: () => n("right"),
+            "aria-label": "Scroll right",
+            children: /* @__PURE__ */ r("svg", { fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ r(m, {})
+  ] });
+}
+function m() {
+  return /* @__PURE__ */ r("style", { children: `
+      .td-carousel {
+        position: relative;
+      }
+
+      .td-carousel__title {
+        font-size: 1.5rem;
+        font-weight: 700;
+        color: #111827;
+        margin-bottom: 1.5rem;
+      }
+
+      .td-carousel__wrapper {
+        position: relative;
+      }
+
+      .td-carousel__wrapper:hover .td-carousel__nav {
+        opacity: 1;
+      }
+
+      .td-carousel__track {
+        display: flex;
+        overflow-x: auto;
+        padding-bottom: 1rem;
+        scroll-snap-type: x mandatory;
+        scrollbar-width: none;
+        -ms-overflow-style: none;
+      }
+
+      .td-carousel__track::-webkit-scrollbar {
+        display: none;
+      }
+
+      .td-carousel__track > * {
+        flex-shrink: 0;
+        scroll-snap-align: start;
+      }
+
+      .td-carousel__nav {
+        position: absolute;
+        top: 50%;
+        transform: translateY(-50%);
+        z-index: 10;
+        background: white;
+        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
+        border-radius: 9999px;
+        padding: 0.5rem;
+        opacity: 0;
+        transition: opacity 0.15s ease;
+        border: none;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+
+      .td-carousel__nav:hover {
+        background: #F3F4F6;
+      }
+
+      .td-carousel__nav--left {
+        left: -1rem;
+      }
+
+      .td-carousel__nav--right {
+        right: -1rem;
+      }
+
+      .td-carousel__nav svg {
+        width: 1.5rem;
+        height: 1.5rem;
+        color: #6B7280;
+      }
+
+      @media (hover: none) {
+        .td-carousel__nav {
+          opacity: 1;
+        }
+      }
+    ` });
+}
+export {
+  g as Carousel
+};
+//# sourceMappingURL=index9.js.map