singularity-components 0.1.195 → 0.1.196

package/dist/components/pages/membership/membership-page.js

@@ -0,0 +1,131 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { motion } from "framer-motion";
+import {
+  Layout,
+  Heading,
+  Text,
+  TextSpan,
+  Button,
+  Icon,
+  Badge,
+  Separator,
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger
+} from "../../primitives/index.js";
+import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "../../blocks/cards/card.js";
+const plans = [
+  {
+    name: "Free",
+    price: "$0",
+    period: "forever",
+    description: "Everything you need to enjoy the blog.",
+    icon: "BookOpen",
+    featured: false,
+    features: [
+      "Access to all published articles",
+      "Weekly newsletter",
+      "Comment on posts",
+      "Dark mode"
+    ]
+  },
+  {
+    name: "Premium",
+    price: "$8",
+    period: "/month",
+    description: "For readers who want the full experience.",
+    icon: "Crown",
+    featured: true,
+    features: [
+      "Everything in Free",
+      "Early access to new posts",
+      "Exclusive essays & interviews",
+      "Ad-free reading experience"
+    ]
+  },
+  {
+    name: "Patron",
+    price: "$20",
+    period: "/month",
+    description: "Support independent storytelling at its best.",
+    icon: "Gem",
+    featured: false,
+    features: [
+      "Everything in Premium",
+      "Members-only community",
+      "Direct author Q&A sessions",
+      "Patron badge on comments"
+    ]
+  }
+];
+const faqs = [
+  {
+    q: "When will Premium launch?",
+    a: "We're building membership features now. Join our newsletter to be the first to know."
+  },
+  {
+    q: "Can I cancel anytime?",
+    a: "Absolutely. No contracts, no commitments. Cancel with one click whenever you want."
+  },
+  {
+    q: "Will free content go behind a paywall?",
+    a: "Never. All currently free content stays free. Premium adds new content on top."
+  }
+];
+function MembershipPage() {
+  return /* @__PURE__ */ jsxs(
+    motion.div,
+    {
+      initial: { opacity: 0, y: 20 },
+      animate: { opacity: 1, y: 0 },
+      transition: { duration: 0.3 },
+      children: [
+        /* @__PURE__ */ jsx("section", { className: "sg:bg-primary/5 sg:border-b sg:border-border", children: /* @__PURE__ */ jsxs("div", { className: "sg:container sg:py-20 sg:max-w-3xl sg:mx-auto sg:text-center", children: [
+          /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "sg:mb-4 sg:uppercase sg:tracking-wider", children: "Coming Soon" }),
+          /* @__PURE__ */ jsx(Heading, { variant: "h1", className: "sg:mb-4", children: "Membership" }),
+          /* @__PURE__ */ jsx(Text, { size: "lg", foreground: "muted-foreground", className: "sg:max-w-xl sg:mx-auto", children: "Support independent storytelling and unlock a richer reading experience." })
+        ] }) }),
+        /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-16", children: /* @__PURE__ */ jsx(Layout.Col1, { hideDiv: true, className: "sg:max-w-5xl", children: /* @__PURE__ */ jsx("div", { className: "sg:grid sg:gap-6 lg:sg:grid-cols-3", children: plans.map((plan) => /* @__PURE__ */ jsxs(
+          Card,
+          {
+            className: plan.featured ? "sg:border-primary sg:shadow-lg sg:ring-1 sg:ring-primary/20 sg:relative" : "",
+            children: [
+              plan.featured && /* @__PURE__ */ jsx("div", { className: "sg:absolute sg:-top-3 sg:left-1/2 sg:-translate-x-1/2", children: /* @__PURE__ */ jsx(Badge, { children: "Most Popular" }) }),
+              /* @__PURE__ */ jsxs(CardHeader, { className: "sg:text-center sg:pb-2", children: [
+                /* @__PURE__ */ jsx("div", { className: "sg:rounded-full sg:bg-primary/10 sg:p-3 sg:inline-flex sg:mx-auto sg:mb-2", children: /* @__PURE__ */ jsx(Icon, { icon: plan.icon, className: "sg:h-6 sg:w-6 sg:text-primary" }) }),
+                /* @__PURE__ */ jsx(CardTitle, { children: plan.name }),
+                /* @__PURE__ */ jsx(CardDescription, { children: plan.description })
+              ] }),
+              /* @__PURE__ */ jsxs(CardContent, { className: "sg:flex sg:flex-col sg:flex-1", children: [
+                /* @__PURE__ */ jsxs("div", { className: "sg:text-center sg:mb-6", children: [
+                  /* @__PURE__ */ jsx(Heading, { variant: "h2", className: "sg:inline", children: plan.price }),
+                  /* @__PURE__ */ jsx(TextSpan, { size: "sm", foreground: "muted-foreground", className: "sg:ml-1", children: plan.period })
+                ] }),
+                /* @__PURE__ */ jsx("ul", { className: "sg:space-y-3 sg:mb-8 sg:flex-1", children: plan.features.map((feature) => /* @__PURE__ */ jsxs("li", { className: "sg:flex sg:items-start sg:gap-2.5", children: [
+                  /* @__PURE__ */ jsx(Icon, { icon: "Check", className: "sg:h-4 sg:w-4 sg:text-primary sg:mt-0.5 sg:shrink-0" }),
+                  /* @__PURE__ */ jsx(Text, { size: "sm", children: feature })
+                ] }, feature)) }),
+                /* @__PURE__ */ jsx(Button, { variant: plan.featured ? "default" : "outline", disabled: true, children: "Coming Soon" })
+              ] })
+            ]
+          },
+          plan.name
+        )) }) }) }),
+        /* @__PURE__ */ jsx(Separator, { className: "sg:max-w-3xl sg:mx-auto" }),
+        /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-16", children: /* @__PURE__ */ jsxs(Layout.Col1, { hideDiv: true, className: "sg:max-w-2xl", children: [
+          /* @__PURE__ */ jsx(Heading, { variant: "h2", className: "sg:mb-6 sg:text-center", children: "FAQ" }),
+          /* @__PURE__ */ jsx(Accordion, { multiple: false, "aria-label": "Membership FAQ", children: faqs.map((faq, i) => /* @__PURE__ */ jsxs(AccordionItem, { value: `faq-${i}`, children: [
+            /* @__PURE__ */ jsx(AccordionTrigger, { children: faq.q }),
+            /* @__PURE__ */ jsx(AccordionContent, { children: faq.a })
+          ] }, faq.q)) })
+        ] }) })
+      ]
+    }
+  );
+}
+export {
+  MembershipPage
+};
+//# sourceMappingURL=membership-page.js.map

package/dist/components/pages/membership/membership-page.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/pages/membership/membership-page.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { motion } from \"framer-motion\";\r\nimport {\r\n\tLayout,\r\n\tHeading,\r\n\tText,\r\n\tTextSpan,\r\n\tButton,\r\n\tIcon,\r\n\tBadge,\r\n\tSeparator,\r\n\tAccordion,\r\n\tAccordionContent,\r\n\tAccordionItem,\r\n\tAccordionTrigger,\r\n} from \"../../primitives/index\";\r\nimport { Card, CardContent, CardHeader, CardTitle, CardDescription } from \"../../blocks/cards/card\";\r\n\r\nconst plans = [\r\n\t{\r\n\t\tname: \"Free\",\r\n\t\tprice: \"$0\",\r\n\t\tperiod: \"forever\",\r\n\t\tdescription: \"Everything you need to enjoy the blog.\",\r\n\t\ticon: \"BookOpen\" as const,\r\n\t\tfeatured: false,\r\n\t\tfeatures: [\r\n\t\t\t\"Access to all published articles\",\r\n\t\t\t\"Weekly newsletter\",\r\n\t\t\t\"Comment on posts\",\r\n\t\t\t\"Dark mode\",\r\n\t\t],\r\n\t},\r\n\t{\r\n\t\tname: \"Premium\",\r\n\t\tprice: \"$8\",\r\n\t\tperiod: \"/month\",\r\n\t\tdescription: \"For readers who want the full experience.\",\r\n\t\ticon: \"Crown\" as const,\r\n\t\tfeatured: true,\r\n\t\tfeatures: [\r\n\t\t\t\"Everything in Free\",\r\n\t\t\t\"Early access to new posts\",\r\n\t\t\t\"Exclusive essays & interviews\",\r\n\t\t\t\"Ad-free reading experience\",\r\n\t\t],\r\n\t},\r\n\t{\r\n\t\tname: \"Patron\",\r\n\t\tprice: \"$20\",\r\n\t\tperiod: \"/month\",\r\n\t\tdescription: \"Support independent storytelling at its best.\",\r\n\t\ticon: \"Gem\" as const,\r\n\t\tfeatured: false,\r\n\t\tfeatures: [\r\n\t\t\t\"Everything in Premium\",\r\n\t\t\t\"Members-only community\",\r\n\t\t\t\"Direct author Q&A sessions\",\r\n\t\t\t\"Patron badge on comments\",\r\n\t\t],\r\n\t},\r\n];\r\n\r\nconst faqs = [\r\n\t{\r\n\t\tq: \"When will Premium launch?\",\r\n\t\ta: \"We're building membership features now. Join our newsletter to be the first to know.\",\r\n\t},\r\n\t{\r\n\t\tq: \"Can I cancel anytime?\",\r\n\t\ta: \"Absolutely. No contracts, no commitments. Cancel with one click whenever you want.\",\r\n\t},\r\n\t{\r\n\t\tq: \"Will free content go behind a paywall?\",\r\n\t\ta: \"Never. All currently free content stays free. Premium adds new content on top.\",\r\n\t},\r\n];\r\n\r\nexport function MembershipPage() {\r\n\treturn (\r\n\t\t<motion.div\r\n\t\t\tinitial={{ opacity: 0, y: 20 }}\r\n\t\t\tanimate={{ opacity: 1, y: 0 }}\r\n\t\t\ttransition={{ duration: 0.3 }}\r\n\t\t>\r\n\t\t\t<section className=\"sg:bg-primary/5 sg:border-b sg:border-border\">\r\n\t\t\t\t<div className=\"sg:container sg:py-20 sg:max-w-3xl sg:mx-auto sg:text-center\">\r\n\t\t\t\t\t<Badge variant=\"secondary\" className=\"sg:mb-4 sg:uppercase sg:tracking-wider\">\r\n\t\t\t\t\t\tComing Soon\r\n\t\t\t\t\t</Badge>\r\n\t\t\t\t\t<Heading variant=\"h1\" className=\"sg:mb-4\">\r\n\t\t\t\t\t\tMembership\r\n\t\t\t\t\t</Heading>\r\n\t\t\t\t\t<Text size=\"lg\" foreground=\"muted-foreground\" className=\"sg:max-w-xl sg:mx-auto\">\r\n\t\t\t\t\t\tSupport independent storytelling and unlock a richer reading experience.\r\n\t\t\t\t\t</Text>\r\n\t\t\t\t</div>\r\n\t\t\t</section>\r\n\r\n\t\t\t<Layout type=\"col\" className=\"sg:py-16\">\r\n\t\t\t\t<Layout.Col1 hideDiv className=\"sg:max-w-5xl\">\r\n\t\t\t\t\t<div className=\"sg:grid sg:gap-6 lg:sg:grid-cols-3\">\r\n\t\t\t\t\t\t{plans.map((plan) => (\r\n\t\t\t\t\t\t\t<Card\r\n\t\t\t\t\t\t\t\tkey={plan.name}\r\n\t\t\t\t\t\t\t\tclassName={\r\n\t\t\t\t\t\t\t\t\tplan.featured\r\n\t\t\t\t\t\t\t\t\t\t? \"sg:border-primary sg:shadow-lg sg:ring-1 sg:ring-primary/20 sg:relative\"\r\n\t\t\t\t\t\t\t\t\t\t: \"\"\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t{plan.featured && (\r\n\t\t\t\t\t\t\t\t\t<div className=\"sg:absolute sg:-top-3 sg:left-1/2 sg:-translate-x-1/2\">\r\n\t\t\t\t\t\t\t\t\t\t<Badge>Most Popular</Badge>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t<CardHeader className=\"sg:text-center sg:pb-2\">\r\n\t\t\t\t\t\t\t\t\t<div className=\"sg:rounded-full sg:bg-primary/10 sg:p-3 sg:inline-flex sg:mx-auto sg:mb-2\">\r\n\t\t\t\t\t\t\t\t\t\t<Icon icon={plan.icon} className=\"sg:h-6 sg:w-6 sg:text-primary\" />\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t<CardTitle>{plan.name}</CardTitle>\r\n\t\t\t\t\t\t\t\t\t<CardDescription>{plan.description}</CardDescription>\r\n\t\t\t\t\t\t\t\t</CardHeader>\r\n\t\t\t\t\t\t\t\t<CardContent className=\"sg:flex sg:flex-col sg:flex-1\">\r\n\t\t\t\t\t\t\t\t\t<div className=\"sg:text-center sg:mb-6\">\r\n\t\t\t\t\t\t\t\t\t\t<Heading variant=\"h2\" className=\"sg:inline\">\r\n\t\t\t\t\t\t\t\t\t\t\t{plan.price}\r\n\t\t\t\t\t\t\t\t\t\t</Heading>\r\n\t\t\t\t\t\t\t\t\t\t<TextSpan size=\"sm\" foreground=\"muted-foreground\" className=\"sg:ml-1\">\r\n\t\t\t\t\t\t\t\t\t\t\t{plan.period}\r\n\t\t\t\t\t\t\t\t\t\t</TextSpan>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t<ul className=\"sg:space-y-3 sg:mb-8 sg:flex-1\">\r\n\t\t\t\t\t\t\t\t\t\t{plan.features.map((feature) => (\r\n\t\t\t\t\t\t\t\t\t\t\t<li key={feature} className=\"sg:flex sg:items-start sg:gap-2.5\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t<Icon icon=\"Check\" className=\"sg:h-4 sg:w-4 sg:text-primary sg:mt-0.5 sg:shrink-0\" />\r\n\t\t\t\t\t\t\t\t\t\t\t\t<Text size=\"sm\">{feature}</Text>\r\n\t\t\t\t\t\t\t\t\t\t\t</li>\r\n\t\t\t\t\t\t\t\t\t\t))}\r\n\t\t\t\t\t\t\t\t\t</ul>\r\n\t\t\t\t\t\t\t\t\t<Button variant={plan.featured ? \"default\" : \"outline\"} disabled>\r\n\t\t\t\t\t\t\t\t\t\tComing Soon\r\n\t\t\t\t\t\t\t\t\t</Button>\r\n\t\t\t\t\t\t\t\t</CardContent>\r\n\t\t\t\t\t\t\t</Card>\r\n\t\t\t\t\t\t))}\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</Layout.Col1>\r\n\t\t\t</Layout>\r\n\r\n\t\t\t<Separator className=\"sg:max-w-3xl sg:mx-auto\" />\r\n\r\n\t\t\t<Layout type=\"col\" className=\"sg:py-16\">\r\n\t\t\t\t<Layout.Col1 hideDiv className=\"sg:max-w-2xl\">\r\n\t\t\t\t\t<Heading variant=\"h2\" className=\"sg:mb-6 sg:text-center\">\r\n\t\t\t\t\t\tFAQ\r\n\t\t\t\t\t</Heading>\r\n\t\t\t\t\t<Accordion multiple={false} aria-label=\"Membership FAQ\">\r\n\t\t\t\t\t\t{faqs.map((faq, i) => (\r\n\t\t\t\t\t\t\t<AccordionItem key={faq.q} value={`faq-${i}`}>\r\n\t\t\t\t\t\t\t\t<AccordionTrigger>{faq.q}</AccordionTrigger>\r\n\t\t\t\t\t\t\t\t<AccordionContent>{faq.a}</AccordionContent>\r\n\t\t\t\t\t\t\t</AccordionItem>\r\n\t\t\t\t\t\t))}\r\n\t\t\t\t\t</Accordion>\r\n\t\t\t\t</Layout.Col1>\r\n\t\t\t</Layout>\r\n\t\t</motion.div>\r\n\t);\r\n}\r\n"],"mappings":"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","names":[]}

package/dist/components/pages/mosaic/mosaic-page.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+
+declare function MosaicPage(): React.JSX.Element;
+
+export { MosaicPage };

package/dist/components/pages/mosaic/mosaic-page.js

@@ -0,0 +1,81 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { motion } from "framer-motion";
+import { Layout, Heading, Text, UiImage, Link } from "../../primitives/index.js";
+import { posts } from "../../../data/posts.js";
+import {
+  Sheet,
+  SheetContent,
+  SheetTitle
+} from "../../primitives/sheet/sheet.js";
+function MosaicPage() {
+  const [lightbox, setLightbox] = useState(null);
+  const items = useMemo(() => {
+    return posts.flatMap((post) => {
+      const images = post.gallery?.length ? post.gallery : [{ src: post.primaryImage, alt: post.title }];
+      return images.map((img) => ({
+        src: img.src,
+        alt: img.alt || post.title,
+        postSlug: post.slug,
+        postTitle: post.title
+      }));
+    });
+  }, []);
+  return /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-16", children: /* @__PURE__ */ jsxs(Layout.Col1, { hideDiv: true, children: [
+    /* @__PURE__ */ jsxs(
+      motion.div,
+      {
+        initial: { opacity: 0, y: 20 },
+        animate: { opacity: 1, y: 0 },
+        transition: { duration: 0.3 },
+        children: [
+          /* @__PURE__ */ jsx(Heading, { variant: "h1", className: "sg:mb-2", children: "Mosaic" }),
+          /* @__PURE__ */ jsx(Text, { foreground: "muted-foreground", className: "sg:mb-10", children: "A visual mosaic of images from our blog posts." }),
+          /* @__PURE__ */ jsx("div", { className: "sg:columns-2 md:sg:columns-3 lg:sg:columns-4 sg:gap-3 sg:space-y-3", children: items.map((item, i) => /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "sg:block sg:w-full sg:mb-3 sg:break-inside-avoid sg:rounded-lg sg:overflow-hidden sg:border-0 sg:p-0 sg:bg-transparent sg:cursor-pointer sg:group",
+              onClick: () => setLightbox(item),
+              children: /* @__PURE__ */ jsx(
+                UiImage,
+                {
+                  src: item.src,
+                  alt: item.alt,
+                  className: "sg:w-full sg:object-cover sg:transition-transform sg:duration-300 sg:group-hover:scale-105",
+                  loading: "lazy"
+                }
+              )
+            },
+            `${item.postSlug}-${i}`
+          )) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(Sheet, { open: !!lightbox, onOpenChange: (open) => !open && setLightbox(null), children: /* @__PURE__ */ jsxs(SheetContent, { side: "bottom", className: "sg:max-h-[90vh] sg:p-4", children: [
+      /* @__PURE__ */ jsx(SheetTitle, { className: "sg:sr-only", children: "Image preview" }),
+      lightbox && /* @__PURE__ */ jsxs("div", { className: "sg:space-y-4 sg:mx-auto sg:max-w-4xl", children: [
+        /* @__PURE__ */ jsx(
+          UiImage,
+          {
+            src: lightbox.src,
+            alt: lightbox.alt,
+            className: "sg:w-full sg:max-h-[70vh] sg:object-contain sg:rounded-md"
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "sg:flex sg:items-center sg:justify-between sg:gap-4", children: [
+          /* @__PURE__ */ jsxs(Text, { size: "sm", foreground: "muted-foreground", children: [
+            "From: ",
+            lightbox.postTitle
+          ] }),
+          /* @__PURE__ */ jsx(Link, { to: `/posts/${lightbox.postSlug}`, children: "View post" })
+        ] })
+      ] })
+    ] }) })
+  ] }) });
+}
+export {
+  MosaicPage
+};
+//# sourceMappingURL=mosaic-page.js.map

package/dist/components/pages/mosaic/mosaic-page.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/pages/mosaic/mosaic-page.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { useMemo, useState } from \"react\";\r\nimport { motion } from \"framer-motion\";\r\nimport { Layout, Heading, Text, UiImage, Link } from \"../../primitives/index\";\r\nimport { posts } from \"../../../data/posts\";\r\nimport {\r\n\tSheet,\r\n\tSheetContent,\r\n\tSheetTitle,\r\n} from \"../../primitives/sheet/sheet\";\r\n\r\ntype MosaicItem = {\r\n\tsrc: string;\r\n\talt: string;\r\n\tpostSlug: string;\r\n\tpostTitle: string;\r\n};\r\n\r\nexport function MosaicPage() {\r\n\tconst [lightbox, setLightbox] = useState<MosaicItem | null>(null);\r\n\r\n\tconst items = useMemo<MosaicItem[]>(() => {\r\n\t\treturn posts.flatMap((post) => {\r\n\t\t\tconst images = post.gallery?.length\r\n\t\t\t\t? post.gallery\r\n\t\t\t\t: [{ src: post.primaryImage, alt: post.title }];\r\n\t\t\treturn images.map((img) => ({\r\n\t\t\t\tsrc: img.src,\r\n\t\t\t\talt: img.alt || post.title,\r\n\t\t\t\tpostSlug: post.slug,\r\n\t\t\t\tpostTitle: post.title,\r\n\t\t\t}));\r\n\t\t});\r\n\t}, []);\r\n\r\n\treturn (\r\n\t\t<Layout type=\"col\" className=\"sg:py-16\">\r\n\t\t\t<Layout.Col1 hideDiv>\r\n\t\t\t\t<motion.div\r\n\t\t\t\t\tinitial={{ opacity: 0, y: 20 }}\r\n\t\t\t\t\tanimate={{ opacity: 1, y: 0 }}\r\n\t\t\t\t\ttransition={{ duration: 0.3 }}\r\n\t\t\t\t>\r\n\t\t\t\t\t<Heading variant=\"h1\" className=\"sg:mb-2\">\r\n\t\t\t\t\t\tMosaic\r\n\t\t\t\t\t</Heading>\r\n\t\t\t\t\t<Text foreground=\"muted-foreground\" className=\"sg:mb-10\">\r\n\t\t\t\t\t\tA visual mosaic of images from our blog posts.\r\n\t\t\t\t\t</Text>\r\n\r\n\t\t\t\t\t<div className=\"sg:columns-2 md:sg:columns-3 lg:sg:columns-4 sg:gap-3 sg:space-y-3\">\r\n\t\t\t\t\t\t{items.map((item, i) => (\r\n\t\t\t\t\t\t\t<button\r\n\t\t\t\t\t\t\t\tkey={`${item.postSlug}-${i}`}\r\n\t\t\t\t\t\t\t\ttype=\"button\"\r\n\t\t\t\t\t\t\t\tclassName=\"sg:block sg:w-full sg:mb-3 sg:break-inside-avoid sg:rounded-lg sg:overflow-hidden sg:border-0 sg:p-0 sg:bg-transparent sg:cursor-pointer sg:group\"\r\n\t\t\t\t\t\t\t\tonClick={() => setLightbox(item)}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t<UiImage\r\n\t\t\t\t\t\t\t\t\tsrc={item.src}\r\n\t\t\t\t\t\t\t\t\talt={item.alt}\r\n\t\t\t\t\t\t\t\t\tclassName=\"sg:w-full sg:object-cover sg:transition-transform sg:duration-300 sg:group-hover:scale-105\"\r\n\t\t\t\t\t\t\t\t\tloading=\"lazy\"\r\n\t\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t</button>\r\n\t\t\t\t\t\t))}\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</motion.div>\r\n\r\n\t\t\t\t<Sheet open={!!lightbox} onOpenChange={(open) => !open && setLightbox(null)}>\r\n\t\t\t\t\t<SheetContent side=\"bottom\" className=\"sg:max-h-[90vh] sg:p-4\">\r\n\t\t\t\t\t\t<SheetTitle className=\"sg:sr-only\">Image preview</SheetTitle>\r\n\t\t\t\t\t\t{lightbox && (\r\n\t\t\t\t\t\t\t<div className=\"sg:space-y-4 sg:mx-auto sg:max-w-4xl\">\r\n\t\t\t\t\t\t\t\t<UiImage\r\n\t\t\t\t\t\t\t\t\tsrc={lightbox.src}\r\n\t\t\t\t\t\t\t\t\talt={lightbox.alt}\r\n\t\t\t\t\t\t\t\t\tclassName=\"sg:w-full sg:max-h-[70vh] sg:object-contain sg:rounded-md\"\r\n\t\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t\t<div className=\"sg:flex sg:items-center sg:justify-between sg:gap-4\">\r\n\t\t\t\t\t\t\t\t\t<Text size=\"sm\" foreground=\"muted-foreground\">\r\n\t\t\t\t\t\t\t\t\t\tFrom: {lightbox.postTitle}\r\n\t\t\t\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t\t\t\t\t<Link to={`/posts/${lightbox.postSlug}`}>View post</Link>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</SheetContent>\r\n\t\t\t\t</Sheet>\r\n\t\t\t</Layout.Col1>\r\n\t\t</Layout>\r\n\t);\r\n}\r\n"],"mappings":";AAuCI,SAKC,KALD;AArCJ,SAAS,SAAS,gBAAgB;AAClC,SAAS,cAAc;AACvB,SAAS,QAAQ,SAAS,MAAM,SAAS,YAAY;AACrD,SAAS,aAAa;AACtB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AASA,SAAS,aAAa;AAC5B,QAAM,CAAC,UAAU,WAAW,IAAI,SAA4B,IAAI;AAEhE,QAAM,QAAQ,QAAsB,MAAM;AACzC,WAAO,MAAM,QAAQ,CAAC,SAAS;AAC9B,YAAM,SAAS,KAAK,SAAS,SAC1B,KAAK,UACL,CAAC,EAAE,KAAK,KAAK,cAAc,KAAK,KAAK,MAAM,CAAC;AAC/C,aAAO,OAAO,IAAI,CAAC,SAAS;AAAA,QAC3B,KAAK,IAAI;AAAA,QACT,KAAK,IAAI,OAAO,KAAK;AAAA,QACrB,UAAU,KAAK;AAAA,QACf,WAAW,KAAK;AAAA,MACjB,EAAE;AAAA,IACH,CAAC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SACC,oBAAC,UAAO,MAAK,OAAM,WAAU,YAC5B,+BAAC,OAAO,MAAP,EAAY,SAAO,MACnB;AAAA;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACA,SAAS,EAAE,SAAS,GAAG,GAAG,GAAG;AAAA,QAC7B,SAAS,EAAE,SAAS,GAAG,GAAG,EAAE;AAAA,QAC5B,YAAY,EAAE,UAAU,IAAI;AAAA,QAE5B;AAAA,8BAAC,WAAQ,SAAQ,MAAK,WAAU,WAAU,oBAE1C;AAAA,UACA,oBAAC,QAAK,YAAW,oBAAmB,WAAU,YAAW,4DAEzD;AAAA,UAEA,oBAAC,SAAI,WAAU,sEACb,gBAAM,IAAI,CAAC,MAAM,MACjB;AAAA,YAAC;AAAA;AAAA,cAEA,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAAS,MAAM,YAAY,IAAI;AAAA,cAE/B;AAAA,gBAAC;AAAA;AAAA,kBACA,KAAK,KAAK;AAAA,kBACV,KAAK,KAAK;AAAA,kBACV,WAAU;AAAA,kBACV,SAAQ;AAAA;AAAA,cACT;AAAA;AAAA,YAVK,GAAG,KAAK,QAAQ,IAAI,CAAC;AAAA,UAW3B,CACA,GACF;AAAA;AAAA;AAAA,IACD;AAAA,IAEA,oBAAC,SAAM,MAAM,CAAC,CAAC,UAAU,cAAc,CAAC,SAAS,CAAC,QAAQ,YAAY,IAAI,GACzE,+BAAC,gBAAa,MAAK,UAAS,WAAU,0BACrC;AAAA,0BAAC,cAAW,WAAU,cAAa,2BAAa;AAAA,MAC/C,YACA,qBAAC,SAAI,WAAU,wCACd;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,KAAK,SAAS;AAAA,YACd,KAAK,SAAS;AAAA,YACd,WAAU;AAAA;AAAA,QACX;AAAA,QACA,qBAAC,SAAI,WAAU,uDACd;AAAA,+BAAC,QAAK,MAAK,MAAK,YAAW,oBAAmB;AAAA;AAAA,YACtC,SAAS;AAAA,aACjB;AAAA,UACA,oBAAC,QAAK,IAAI,UAAU,SAAS,QAAQ,IAAI,uBAAS;AAAA,WACnD;AAAA,SACD;AAAA,OAEF,GACD;AAAA,KACD,GACD;AAEF;","names":[]}

package/dist/components/pages/newsletter/newsletter-page.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+
+declare function NewsletterPage(): React.JSX.Element;
+
+export { NewsletterPage };

package/dist/components/pages/newsletter/newsletter-page.js

@@ -0,0 +1,148 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { motion } from "framer-motion";
+import {
+  Layout,
+  Heading,
+  Text,
+  Input,
+  Button,
+  Icon,
+  Separator
+} from "../../primitives/index.js";
+import { Label } from "../../primitives/label/label.js";
+import { Card, CardContent } from "../../blocks/cards/card.js";
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage
+} from "../../primitives/avatar/avatar.js";
+import { useToast } from "../../primitives/sonner/use-toast.js";
+import { authors } from "../../../data/authors.js";
+const benefits = [
+  {
+    icon: "BookOpen",
+    title: "Curated Stories",
+    description: "Handpicked articles on slow living, design, and culture \u2014 delivered weekly."
+  },
+  {
+    icon: "Sparkles",
+    title: "Exclusive Content",
+    description: "Subscriber-only essays, interviews, and behind-the-scenes looks."
+  },
+  {
+    icon: "Clock",
+    title: "Early Access",
+    description: "Be the first to read new posts before they go live."
+  }
+];
+function NewsletterPage() {
+  const { toast } = useToast();
+  const [email, setEmail] = useState("");
+  const [error, setError] = useState("");
+  const [submitting, setSubmitting] = useState(false);
+  const [subscribed, setSubscribed] = useState(false);
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    if (!email.trim() || !email.includes("@")) {
+      setError("Please enter a valid email address");
+      return;
+    }
+    setError("");
+    setSubmitting(true);
+    setTimeout(() => {
+      setSubmitting(false);
+      setSubscribed(true);
+      toast.message("You're subscribed!", {
+        description: "Check your inbox for a welcome email."
+      });
+    }, 1200);
+  };
+  return /* @__PURE__ */ jsxs(
+    motion.div,
+    {
+      initial: { opacity: 0, y: 20 },
+      animate: { opacity: 1, y: 0 },
+      transition: { duration: 0.3 },
+      children: [
+        /* @__PURE__ */ jsx("section", { className: "sg:bg-primary/5 sg:border-b sg:border-border", children: /* @__PURE__ */ jsxs("div", { className: "sg:container sg:py-20 sg:max-w-3xl sg:mx-auto sg:text-center", children: [
+          /* @__PURE__ */ jsx(Icon, { icon: "Mail", className: "sg:h-12 sg:w-12 sg:text-primary sg:mx-auto sg:mb-5" }),
+          /* @__PURE__ */ jsx(Heading, { variant: "h1", className: "sg:mb-4", children: "Stories Worth Reading, Delivered Weekly" }),
+          /* @__PURE__ */ jsx(
+            Text,
+            {
+              size: "lg",
+              foreground: "muted-foreground",
+              className: "sg:max-w-xl sg:mx-auto sg:leading-relaxed",
+              children: "Join a growing community of thoughtful readers. Curated essays on slow living, intentional design, and creative culture \u2014 every Sunday."
+            }
+          ),
+          !subscribed ? /* @__PURE__ */ jsxs(
+            "form",
+            {
+              onSubmit: handleSubmit,
+              className: "sg:mt-8 sg:flex sg:flex-col sm:sg:flex-row sg:gap-3 sg:max-w-md sg:mx-auto",
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "sg:flex-1", children: [
+                  /* @__PURE__ */ jsx(Label, { htmlFor: "newsletter-email", className: "sg:sr-only", children: "Email" }),
+                  /* @__PURE__ */ jsx(
+                    Input,
+                    {
+                      id: "newsletter-email",
+                      type: "email",
+                      placeholder: "you@example.com",
+                      value: email,
+                      onChange: (e) => {
+                        setEmail(e.target.value);
+                        if (error) setError("");
+                      },
+                      "aria-invalid": !!error
+                    }
+                  ),
+                  error && /* @__PURE__ */ jsx(Text, { size: "sm", className: "sg:text-destructive sg:text-left sg:mt-1", children: error })
+                ] }),
+                /* @__PURE__ */ jsx(Button, { type: "submit", loading: submitting, iconStart: "Mail", children: "Subscribe" })
+              ]
+            }
+          ) : /* @__PURE__ */ jsxs("div", { className: "sg:mt-8 sg:inline-flex sg:items-center sg:gap-2 sg:bg-primary/10 sg:text-primary sg:rounded-full sg:px-5 sg:py-2.5 sg:font-medium", children: [
+            /* @__PURE__ */ jsx(Icon, { icon: "CircleCheck", className: "sg:h-5 sg:w-5" }),
+            "You're subscribed \u2014 welcome aboard!"
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "sg:mt-6 sg:flex sg:items-center sg:justify-center sg:gap-2", children: [
+            /* @__PURE__ */ jsx("div", { className: "sg:flex sg:-space-x-2", children: authors.map((a) => /* @__PURE__ */ jsxs(
+              Avatar,
+              {
+                className: "sg:h-7 sg:w-7 sg:border-2 sg:border-background",
+                children: [
+                  /* @__PURE__ */ jsx(AvatarImage, { src: a.avatar, alt: a.name }),
+                  /* @__PURE__ */ jsx(AvatarFallback, { className: "sg:text-[10px]", children: a.name[0] })
+                ]
+              },
+              a.slug
+            )) }),
+            /* @__PURE__ */ jsxs(Text, { size: "sm", foreground: "muted-foreground", children: [
+              "Join ",
+              /* @__PURE__ */ jsx("span", { className: "sg:font-medium sg:text-foreground", children: "2,400+" }),
+              " readers"
+            ] })
+          ] })
+        ] }) }),
+        /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-16", children: /* @__PURE__ */ jsxs(Layout.Col1, { hideDiv: true, className: "sg:max-w-4xl", children: [
+          /* @__PURE__ */ jsx(Heading, { variant: "h2", className: "sg:text-center sg:mb-2", children: "What You'll Get" }),
+          /* @__PURE__ */ jsx(Text, { foreground: "muted-foreground", className: "sg:text-center sg:mb-10", children: "Every issue is crafted with the same care as our articles." }),
+          /* @__PURE__ */ jsx("div", { className: "sg:grid sg:gap-6 sm:sg:grid-cols-3", children: benefits.map((b) => /* @__PURE__ */ jsx(Card, { className: "sg:text-center", children: /* @__PURE__ */ jsxs(CardContent, { className: "sg:pt-6", children: [
+            /* @__PURE__ */ jsx("div", { className: "sg:rounded-full sg:bg-primary/10 sg:p-3 sg:inline-flex sg:mb-4", children: /* @__PURE__ */ jsx(Icon, { icon: b.icon, className: "sg:h-6 sg:w-6 sg:text-primary" }) }),
+            /* @__PURE__ */ jsx(Heading, { variant: "h5", className: "sg:mb-1", children: b.title }),
+            /* @__PURE__ */ jsx(Text, { size: "sm", foreground: "muted-foreground", className: "sg:leading-relaxed", children: b.description })
+          ] }) }, b.title)) })
+        ] }) }),
+        /* @__PURE__ */ jsx(Separator, { className: "sg:max-w-4xl sg:mx-auto" })
+      ]
+    }
+  );
+}
+export {
+  NewsletterPage
+};
+//# sourceMappingURL=newsletter-page.js.map

package/dist/components/pages/newsletter/newsletter-page.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/pages/newsletter/newsletter-page.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { useState } from \"react\";\r\nimport { motion } from \"framer-motion\";\r\nimport {\r\n\tLayout,\r\n\tHeading,\r\n\tText,\r\n\tInput,\r\n\tButton,\r\n\tIcon,\r\n\tSeparator,\r\n} from \"../../primitives/index\";\r\nimport { Label } from \"../../primitives/label/label\";\r\nimport { Card, CardContent } from \"../../blocks/cards/card\";\r\nimport {\r\n\tAvatar,\r\n\tAvatarFallback,\r\n\tAvatarImage,\r\n} from \"../../primitives/avatar/avatar\";\r\nimport { useToast } from \"../../primitives/sonner/use-toast\";\r\nimport { authors } from \"../../../data/authors\";\r\n\r\nconst benefits = [\r\n\t{\r\n\t\ticon: \"BookOpen\" as const,\r\n\t\ttitle: \"Curated Stories\",\r\n\t\tdescription:\r\n\t\t\t\"Handpicked articles on slow living, design, and culture — delivered weekly.\",\r\n\t},\r\n\t{\r\n\t\ticon: \"Sparkles\" as const,\r\n\t\ttitle: \"Exclusive Content\",\r\n\t\tdescription:\r\n\t\t\t\"Subscriber-only essays, interviews, and behind-the-scenes looks.\",\r\n\t},\r\n\t{\r\n\t\ticon: \"Clock\" as const,\r\n\t\ttitle: \"Early Access\",\r\n\t\tdescription: \"Be the first to read new posts before they go live.\",\r\n\t},\r\n];\r\n\r\nexport function NewsletterPage() {\r\n\tconst { toast } = useToast();\r\n\tconst [email, setEmail] = useState(\"\");\r\n\tconst [error, setError] = useState(\"\");\r\n\tconst [submitting, setSubmitting] = useState(false);\r\n\tconst [subscribed, setSubscribed] = useState(false);\r\n\r\n\tconst handleSubmit = (e: React.FormEvent) => {\r\n\t\te.preventDefault();\r\n\t\tif (!email.trim() || !email.includes(\"@\")) {\r\n\t\t\tsetError(\"Please enter a valid email address\");\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tsetError(\"\");\r\n\t\tsetSubmitting(true);\r\n\t\tsetTimeout(() => {\r\n\t\t\tsetSubmitting(false);\r\n\t\t\tsetSubscribed(true);\r\n\t\t\ttoast.message(\"You're subscribed!\", {\r\n\t\t\t\tdescription: \"Check your inbox for a welcome email.\",\r\n\t\t\t});\r\n\t\t}, 1200);\r\n\t};\r\n\r\n\treturn (\r\n\t\t<motion.div\r\n\t\t\tinitial={{ opacity: 0, y: 20 }}\r\n\t\t\tanimate={{ opacity: 1, y: 0 }}\r\n\t\t\ttransition={{ duration: 0.3 }}\r\n\t\t>\r\n\t\t\t<section className=\"sg:bg-primary/5 sg:border-b sg:border-border\">\r\n\t\t\t\t<div className=\"sg:container sg:py-20 sg:max-w-3xl sg:mx-auto sg:text-center\">\r\n\t\t\t\t\t<Icon icon=\"Mail\" className=\"sg:h-12 sg:w-12 sg:text-primary sg:mx-auto sg:mb-5\" />\r\n\t\t\t\t\t<Heading variant=\"h1\" className=\"sg:mb-4\">\r\n\t\t\t\t\t\tStories Worth Reading, Delivered Weekly\r\n\t\t\t\t\t</Heading>\r\n\t\t\t\t\t<Text\r\n\t\t\t\t\t\tsize=\"lg\"\r\n\t\t\t\t\t\tforeground=\"muted-foreground\"\r\n\t\t\t\t\t\tclassName=\"sg:max-w-xl sg:mx-auto sg:leading-relaxed\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\tJoin a growing community of thoughtful readers. Curated essays on slow\r\n\t\t\t\t\t\tliving, intentional design, and creative culture — every Sunday.\r\n\t\t\t\t\t</Text>\r\n\r\n\t\t\t\t\t{!subscribed ? (\r\n\t\t\t\t\t\t<form\r\n\t\t\t\t\t\t\tonSubmit={handleSubmit}\r\n\t\t\t\t\t\t\tclassName=\"sg:mt-8 sg:flex sg:flex-col sm:sg:flex-row sg:gap-3 sg:max-w-md sg:mx-auto\"\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t<div className=\"sg:flex-1\">\r\n\t\t\t\t\t\t\t\t<Label htmlFor=\"newsletter-email\" className=\"sg:sr-only\">\r\n\t\t\t\t\t\t\t\t\tEmail\r\n\t\t\t\t\t\t\t\t</Label>\r\n\t\t\t\t\t\t\t\t<Input\r\n\t\t\t\t\t\t\t\t\tid=\"newsletter-email\"\r\n\t\t\t\t\t\t\t\t\ttype=\"email\"\r\n\t\t\t\t\t\t\t\t\tplaceholder=\"you@example.com\"\r\n\t\t\t\t\t\t\t\t\tvalue={email}\r\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\r\n\t\t\t\t\t\t\t\t\t\tsetEmail(e.target.value);\r\n\t\t\t\t\t\t\t\t\t\tif (error) setError(\"\");\r\n\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t\taria-invalid={!!error}\r\n\t\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t\t{error && (\r\n\t\t\t\t\t\t\t\t\t<Text size=\"sm\" className=\"sg:text-destructive sg:text-left sg:mt-1\">\r\n\t\t\t\t\t\t\t\t\t\t{error}\r\n\t\t\t\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t<Button type=\"submit\" loading={submitting} iconStart=\"Mail\">\r\n\t\t\t\t\t\t\t\tSubscribe\r\n\t\t\t\t\t\t\t</Button>\r\n\t\t\t\t\t\t</form>\r\n\t\t\t\t\t) : (\r\n\t\t\t\t\t\t<div className=\"sg:mt-8 sg:inline-flex sg:items-center sg:gap-2 sg:bg-primary/10 sg:text-primary sg:rounded-full sg:px-5 sg:py-2.5 sg:font-medium\">\r\n\t\t\t\t\t\t\t<Icon icon=\"CircleCheck\" className=\"sg:h-5 sg:w-5\" />\r\n\t\t\t\t\t\t\tYou&apos;re subscribed — welcome aboard!\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t)}\r\n\r\n\t\t\t\t\t<div className=\"sg:mt-6 sg:flex sg:items-center sg:justify-center sg:gap-2\">\r\n\t\t\t\t\t\t<div className=\"sg:flex sg:-space-x-2\">\r\n\t\t\t\t\t\t\t{authors.map((a) => (\r\n\t\t\t\t\t\t\t\t<Avatar\r\n\t\t\t\t\t\t\t\t\tkey={a.slug}\r\n\t\t\t\t\t\t\t\t\tclassName=\"sg:h-7 sg:w-7 sg:border-2 sg:border-background\"\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<AvatarImage src={a.avatar} alt={a.name} />\r\n\t\t\t\t\t\t\t\t\t<AvatarFallback className=\"sg:text-[10px]\">\r\n\t\t\t\t\t\t\t\t\t\t{a.name[0]}\r\n\t\t\t\t\t\t\t\t\t</AvatarFallback>\r\n\t\t\t\t\t\t\t\t</Avatar>\r\n\t\t\t\t\t\t\t))}\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t<Text size=\"sm\" foreground=\"muted-foreground\">\r\n\t\t\t\t\t\t\tJoin <span className=\"sg:font-medium sg:text-foreground\">2,400+</span> readers\r\n\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</section>\r\n\r\n\t\t\t<Layout type=\"col\" className=\"sg:py-16\">\r\n\t\t\t\t<Layout.Col1 hideDiv className=\"sg:max-w-4xl\">\r\n\t\t\t\t\t<Heading variant=\"h2\" className=\"sg:text-center sg:mb-2\">\r\n\t\t\t\t\t\tWhat You&apos;ll Get\r\n\t\t\t\t\t</Heading>\r\n\t\t\t\t\t<Text foreground=\"muted-foreground\" className=\"sg:text-center sg:mb-10\">\r\n\t\t\t\t\t\tEvery issue is crafted with the same care as our articles.\r\n\t\t\t\t\t</Text>\r\n\t\t\t\t\t<div className=\"sg:grid sg:gap-6 sm:sg:grid-cols-3\">\r\n\t\t\t\t\t\t{benefits.map((b) => (\r\n\t\t\t\t\t\t\t<Card key={b.title} className=\"sg:text-center\">\r\n\t\t\t\t\t\t\t\t<CardContent className=\"sg:pt-6\">\r\n\t\t\t\t\t\t\t\t\t<div className=\"sg:rounded-full sg:bg-primary/10 sg:p-3 sg:inline-flex sg:mb-4\">\r\n\t\t\t\t\t\t\t\t\t\t<Icon icon={b.icon} className=\"sg:h-6 sg:w-6 sg:text-primary\" />\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t<Heading variant=\"h5\" className=\"sg:mb-1\">\r\n\t\t\t\t\t\t\t\t\t\t{b.title}\r\n\t\t\t\t\t\t\t\t\t</Heading>\r\n\t\t\t\t\t\t\t\t\t<Text size=\"sm\" foreground=\"muted-foreground\" className=\"sg:leading-relaxed\">\r\n\t\t\t\t\t\t\t\t\t\t{b.description}\r\n\t\t\t\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t\t\t\t</CardContent>\r\n\t\t\t\t\t\t\t</Card>\r\n\t\t\t\t\t\t))}\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</Layout.Col1>\r\n\t\t\t</Layout>\r\n\r\n\t\t\t<Separator className=\"sg:max-w-4xl sg:mx-auto\" />\r\n\t\t</motion.div>\r\n\t);\r\n}\r\n"],"mappings":"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","names":[]}

package/dist/components/pages/resources/resources-page.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+
+declare function ResourcesPage(): React.JSX.Element;
+
+export { ResourcesPage };

package/dist/components/pages/resources/resources-page.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { motion } from "framer-motion";
+import { Layout, Heading, Text } from "../../primitives/index.js";
+import { Card, CardContent } from "../../blocks/cards/card.js";
+function ResourcesPage() {
+  return /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-16", children: /* @__PURE__ */ jsx(Layout.Col1, { hideDiv: true, className: "sg:max-w-3xl", children: /* @__PURE__ */ jsxs(
+    motion.div,
+    {
+      initial: { opacity: 0, y: 20 },
+      animate: { opacity: 1, y: 0 },
+      transition: { duration: 0.3 },
+      children: [
+        /* @__PURE__ */ jsx(Heading, { variant: "h1", className: "sg:mb-2", children: "Resources" }),
+        /* @__PURE__ */ jsx(Text, { foreground: "muted-foreground", className: "sg:mb-10", children: "Curated links, tools, and references for creators." }),
+        /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(CardContent, { className: "sg:py-8 sg:text-center", children: /* @__PURE__ */ jsx(Text, { foreground: "muted-foreground", children: "This is a placeholder page. Content coming soon." }) }) })
+      ]
+    }
+  ) }) });
+}
+export {
+  ResourcesPage
+};
+//# sourceMappingURL=resources-page.js.map

package/dist/components/pages/resources/resources-page.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/pages/resources/resources-page.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { motion } from \"framer-motion\";\r\nimport { Layout, Heading, Text } from \"../../primitives/index\";\r\nimport { Card, CardContent } from \"../../blocks/cards/card\";\r\n\r\nexport function ResourcesPage() {\r\n\treturn (\r\n\t\t<Layout type=\"col\" className=\"sg:py-16\">\r\n\t\t\t<Layout.Col1 hideDiv className=\"sg:max-w-3xl\">\r\n\t\t\t\t<motion.div\r\n\t\t\t\t\tinitial={{ opacity: 0, y: 20 }}\r\n\t\t\t\t\tanimate={{ opacity: 1, y: 0 }}\r\n\t\t\t\t\ttransition={{ duration: 0.3 }}\r\n\t\t\t\t>\r\n\t\t\t\t\t<Heading variant=\"h1\" className=\"sg:mb-2\">\r\n\t\t\t\t\t\tResources\r\n\t\t\t\t\t</Heading>\r\n\t\t\t\t\t<Text foreground=\"muted-foreground\" className=\"sg:mb-10\">\r\n\t\t\t\t\t\tCurated links, tools, and references for creators.\r\n\t\t\t\t\t</Text>\r\n\t\t\t\t\t<Card>\r\n\t\t\t\t\t\t<CardContent className=\"sg:py-8 sg:text-center\">\r\n\t\t\t\t\t\t\t<Text foreground=\"muted-foreground\">\r\n\t\t\t\t\t\t\t\tThis is a placeholder page. Content coming soon.\r\n\t\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t\t</CardContent>\r\n\t\t\t\t\t</Card>\r\n\t\t\t\t</motion.div>\r\n\t\t\t</Layout.Col1>\r\n\t\t</Layout>\r\n\t);\r\n}\r\n"],"mappings":";AAUI,SAKC,KALD;AARJ,SAAS,cAAc;AACvB,SAAS,QAAQ,SAAS,YAAY;AACtC,SAAS,MAAM,mBAAmB;AAE3B,SAAS,gBAAgB;AAC/B,SACC,oBAAC,UAAO,MAAK,OAAM,WAAU,YAC5B,8BAAC,OAAO,MAAP,EAAY,SAAO,MAAC,WAAU,gBAC9B;AAAA,IAAC,OAAO;AAAA,IAAP;AAAA,MACA,SAAS,EAAE,SAAS,GAAG,GAAG,GAAG;AAAA,MAC7B,SAAS,EAAE,SAAS,GAAG,GAAG,EAAE;AAAA,MAC5B,YAAY,EAAE,UAAU,IAAI;AAAA,MAE5B;AAAA,4BAAC,WAAQ,SAAQ,MAAK,WAAU,WAAU,uBAE1C;AAAA,QACA,oBAAC,QAAK,YAAW,oBAAmB,WAAU,YAAW,gEAEzD;AAAA,QACA,oBAAC,QACA,8BAAC,eAAY,WAAU,0BACtB,8BAAC,QAAK,YAAW,oBAAmB,8DAEpC,GACD,GACD;AAAA;AAAA;AAAA,EACD,GACD,GACD;AAEF;","names":[]}

package/dist/components/pages/startpage/startpage.js

@@ -22,20 +22,22 @@ function StartPage() {
       /* @__PURE__ */ jsx(Layout, { as: "section", className: "sg:py-16", children: /* @__PURE__ */ jsxs(Layout.Col1, { hideDiv: true, children: [
         /* @__PURE__ */ jsxs("div", { className: "sg:flex sg:items-end sg:justify-between sg:flex-wrap sg:mb-10", children: [
           /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx(Heading, { variant: "h2", children: "Latest Stories" }),
-            /* @__PURE__ */ jsx(Text, { foreground: "muted-foreground", className: "sg:mt-2", children: "Exploring design, culture, and the quiet art of living." })
+            /* @__PURE__ */ jsx(Heading, { variant: "h2", children: "Featured" }),
+            /* @__PURE__ */ jsx(Text, { foreground: "muted-foreground", className: "sg:mt-2", children: "Hand-picked stories we love." })
           ] }),
           /* @__PURE__ */ jsx(Link, { to: "/posts", iconEnd: "ArrowRight", children: "View all" })
         ] }),
-        /* @__PURE__ */ jsx("div", { className: "sg:grid sg:grid-cols-[repeat(auto-fit,minmax(min(230px,100%),1fr))] sg:gap-8", children: posts.slice(0, 3).map((post) => /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx("div", { className: "sg:grid sg:grid-cols-[repeat(auto-fit,minmax(min(230px,100%),1fr))] sg:gap-8", children: posts.filter((p) => p.featured).map((post) => /* @__PURE__ */ jsx(
           BlogPostCard,
           {
             id: post.id,
+            slug: post.slug,
             image: post.primaryImage,
             categories: post.categories,
             date: post.date,
             title: post.title,
-            excerpt: post.excerpt
+            excerpt: post.excerpt,
+            clickableCategories: true
           },
           post.id
         )) })

package/dist/components/pages/startpage/startpage.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/pages/startpage/startpage.tsx"],"sourcesContent":["import { Container } from \"../../templates/container/container\";\nimport Hero from \"../../templates/hero/hero\";\nimport { Layout, Link, Heading, Text } from \"../../primitives/index\";\nimport BlogPostCard from \"../../blocks/cards/blogpost-card\";\nimport { posts } from \"../../../data/posts\";\nimport { Footer } from \"../../templates/footer/footer\";\n\nfunction StartPage() {\n  return (\n    <Container>\n      <Container.Header />\n      <Container.Content>\n        <Hero\n          title=\"Stories worth\"\n          titleAccent=\"savoring\"\n          description=\"A curated journal exploring design, culture, and the quiet art of living with intention.\"\n          primaryCTA={{ label: \"Browse all posts\", href: \"#\" }}\n          secondaryCTA={{ label: \"Our design system\", href: \"#\" }}\n        />\n        <Layout as=\"section\" className=\"sg:py-16\">\n          <Layout.Col1 hideDiv>\n            <div className=\"sg:flex sg:items-end sg:justify-between sg:flex-wrap sg:mb-10\">\n              <div>\n                <Heading variant=\"h2\">Latest Stories</Heading>\n                <Text foreground=\"muted-foreground\" className=\"sg:mt-2\">\n                  Exploring design, culture, and the quiet art of living.\n                </Text>\n              </div>\n              <Link to=\"/posts\" iconEnd=\"ArrowRight\">\n                View all\n              </Link>\n            </div>\n            <div className=\"sg:grid sg:grid-cols-[repeat(auto-fit,minmax(min(230px,100%),1fr))] sg:gap-8\">\n              {posts.slice(0, 3).map((post) => (\n                <BlogPostCard\n                  key={post.id}\n                  id={post.id}\n                  image={post.primaryImage}\n                  categories={post.categories}\n                  date={post.date}\n                  title={post.title}\n                  excerpt={post.excerpt}\n                />\n              ))}\n            </div>\n          </Layout.Col1>\n        </Layout>\n      </Container.Content>\n      <Container.Footer>\n        <Footer />\n      </Container.Footer>\n    </Container>\n  );\n}\n\nexport { StartPage };\n"],"mappings":"AAUM,cAYQ,YAZR;AAVN,SAAS,iBAAiB;AAC1B,OAAO,UAAU;AACjB,SAAS,QAAQ,MAAM,SAAS,YAAY;AAC5C,OAAO,kBAAkB;AACzB,SAAS,aAAa;AACtB,SAAS,cAAc;AAEvB,SAAS,YAAY;AACnB,SACE,qBAAC,aACC;AAAA,wBAAC,UAAU,QAAV,EAAiB;AAAA,IAClB,qBAAC,UAAU,SAAV,EACC;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,OAAM;AAAA,UACN,aAAY;AAAA,UACZ,aAAY;AAAA,UACZ,YAAY,EAAE,OAAO,oBAAoB,MAAM,IAAI;AAAA,UACnD,cAAc,EAAE,OAAO,qBAAqB,MAAM,IAAI;AAAA;AAAA,MACxD;AAAA,MACA,oBAAC,UAAO,IAAG,WAAU,WAAU,YAC7B,+BAAC,OAAO,MAAP,EAAY,SAAO,MAClB;AAAA,6BAAC,SAAI,WAAU,iEACb;AAAA,+BAAC,SACC;AAAA,gCAAC,WAAQ,SAAQ,MAAK,4BAAc;AAAA,YACpC,oBAAC,QAAK,YAAW,oBAAmB,WAAU,WAAU,qEAExD;AAAA,aACF;AAAA,UACA,oBAAC,QAAK,IAAG,UAAS,SAAQ,cAAa,sBAEvC;AAAA,WACF;AAAA,QACA,oBAAC,SAAI,WAAU,gFACZ,gBAAM,MAAM,GAAG,CAAC,EAAE,IAAI,CAAC,SACtB;AAAA,UAAC;AAAA;AAAA,YAEC,IAAI,KAAK;AAAA,YACT,OAAO,KAAK;AAAA,YACZ,YAAY,KAAK;AAAA,YACjB,MAAM,KAAK;AAAA,YACX,OAAO,KAAK;AAAA,YACZ,SAAS,KAAK;AAAA;AAAA,UANT,KAAK;AAAA,QAOZ,CACD,GACH;AAAA,SACF,GACF;AAAA,OACF;AAAA,IACA,oBAAC,UAAU,QAAV,EACC,8BAAC,UAAO,GACV;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../../src/components/pages/startpage/startpage.tsx"],"sourcesContent":["import { Container } from \"../../templates/container/container\";\nimport Hero from \"../../templates/hero/hero\";\nimport { Layout, Link, Heading, Text } from \"../../primitives/index\";\nimport BlogPostCard from \"../../blocks/cards/blogpost-card\";\nimport { posts } from \"../../../data/posts\";\nimport { Footer } from \"../../templates/footer/footer\";\n\nfunction StartPage() {\n  return (\n    <Container>\n      <Container.Header />\n      <Container.Content>\n        <Hero\n          title=\"Stories worth\"\n          titleAccent=\"savoring\"\n          description=\"A curated journal exploring design, culture, and the quiet art of living with intention.\"\n          primaryCTA={{ label: \"Browse all posts\", href: \"#\" }}\n          secondaryCTA={{ label: \"Our design system\", href: \"#\" }}\n        />\n        <Layout as=\"section\" className=\"sg:py-16\">\n          <Layout.Col1 hideDiv>\n            <div className=\"sg:flex sg:items-end sg:justify-between sg:flex-wrap sg:mb-10\">\n              <div>\n                <Heading variant=\"h2\">Featured</Heading>\n                <Text foreground=\"muted-foreground\" className=\"sg:mt-2\">\n                  Hand-picked stories we love.\n                </Text>\n              </div>\n              <Link to=\"/posts\" iconEnd=\"ArrowRight\">\n                View all\n              </Link>\n            </div>\n            <div className=\"sg:grid sg:grid-cols-[repeat(auto-fit,minmax(min(230px,100%),1fr))] sg:gap-8\">\n              {posts.filter((p) => p.featured).map((post) => (\n                <BlogPostCard\n                  key={post.id}\n                  id={post.id}\n                  slug={post.slug}\n                  image={post.primaryImage}\n                  categories={post.categories}\n                  date={post.date}\n                  title={post.title}\n                  excerpt={post.excerpt}\n                  clickableCategories\n                />\n              ))}\n            </div>\n          </Layout.Col1>\n        </Layout>\n      </Container.Content>\n      <Container.Footer>\n        <Footer />\n      </Container.Footer>\n    </Container>\n  );\n}\n\nexport { StartPage };\n"],"mappings":"AAUM,cAYQ,YAZR;AAVN,SAAS,iBAAiB;AAC1B,OAAO,UAAU;AACjB,SAAS,QAAQ,MAAM,SAAS,YAAY;AAC5C,OAAO,kBAAkB;AACzB,SAAS,aAAa;AACtB,SAAS,cAAc;AAEvB,SAAS,YAAY;AACnB,SACE,qBAAC,aACC;AAAA,wBAAC,UAAU,QAAV,EAAiB;AAAA,IAClB,qBAAC,UAAU,SAAV,EACC;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,OAAM;AAAA,UACN,aAAY;AAAA,UACZ,aAAY;AAAA,UACZ,YAAY,EAAE,OAAO,oBAAoB,MAAM,IAAI;AAAA,UACnD,cAAc,EAAE,OAAO,qBAAqB,MAAM,IAAI;AAAA;AAAA,MACxD;AAAA,MACA,oBAAC,UAAO,IAAG,WAAU,WAAU,YAC7B,+BAAC,OAAO,MAAP,EAAY,SAAO,MAClB;AAAA,6BAAC,SAAI,WAAU,iEACb;AAAA,+BAAC,SACC;AAAA,gCAAC,WAAQ,SAAQ,MAAK,sBAAQ;AAAA,YAC9B,oBAAC,QAAK,YAAW,oBAAmB,WAAU,WAAU,0CAExD;AAAA,aACF;AAAA,UACA,oBAAC,QAAK,IAAG,UAAS,SAAQ,cAAa,sBAEvC;AAAA,WACF;AAAA,QACA,oBAAC,SAAI,WAAU,gFACZ,gBAAM,OAAO,CAAC,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,SACpC;AAAA,UAAC;AAAA;AAAA,YAEC,IAAI,KAAK;AAAA,YACT,MAAM,KAAK;AAAA,YACX,OAAO,KAAK;AAAA,YACZ,YAAY,KAAK;AAAA,YACjB,MAAM,KAAK;AAAA,YACX,OAAO,KAAK;AAAA,YACZ,SAAS,KAAK;AAAA,YACd,qBAAmB;AAAA;AAAA,UARd,KAAK;AAAA,QASZ,CACD,GACH;AAAA,SACF,GACF;AAAA,OACF;AAAA,IACA,oBAAC,UAAU,QAAV,EACC,8BAAC,UAAO,GACV;AAAA,KACF;AAEJ;","names":[]}

package/dist/components/primitives/accordion/accordion.js

@@ -1,15 +1,15 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Accordion as AccordionPrimitive } from "@base-ui/react/accordion";
-import { ChevronDownIcon, ChevronUpIcon } from "lucide-react";
 import { cn } from "../../../utils/index.js";
+import { Icon } from "../icon/icon.js";
 function Accordion({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     AccordionPrimitive.Root,
     {
       "data-slot": "accordion",
       className: cn(
-        "sg:overflow-hidden sg:rounded-2xl sg:border sg:flex sg:w-full sg:flex-col",
+        "sg:flex sg:w-full sg:flex-col sg:rounded-lg sg:border sg:border-border sg:bg-card sg:text-card-foreground",
         className
       ),
       ...props
@@ -21,7 +21,10 @@ function AccordionItem({ className, ...props }) {
     AccordionPrimitive.Item,
     {
       "data-slot": "accordion-item",
-      className: cn("sg:data-open:bg-muted/50 sg:not-last:border-b", className),
+      className: cn(
+        "sg:not-last:border-b sg:not-last:border-border sg:data-open:bg-muted/40",
+        className
+      ),
       ...props
     }
   );
@@ -31,29 +34,24 @@ function AccordionTrigger({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "sg:flex", children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "sg:m-0 sg:flex sg:w-full", children: /* @__PURE__ */ jsxs(
     AccordionPrimitive.Trigger,
     {
       "data-slot": "accordion-trigger",
       className: cn(
-        "sg:**:data-[slot=accordion-trigger-icon]:text-muted-foreground sg:gap-6 sg:p-4 sg:text-start sg:text-sm sg:font-medium sg:hover:underline sg:**:data-[slot=accordion-trigger-icon]:ms-auto sg:**:data-[slot=accordion-trigger-icon]:size-4 sg:group/accordion-trigger sg:relative sg:flex sg:flex-1 sg:items-start sg:justify-between sg:border sg:border-transparent sg:transition-all sg:outline-none sg:disabled:pointer-events-none sg:disabled:opacity-50",
+        "sg:group sg:relative sg:flex sg:w-full sg:flex-1 sg:items-center sg:justify-between sg:gap-4 sg:rounded-sm sg:p-4 sg:text-start sg:text-sm sg:font-medium sg:select-none sg:transition-colors sg:hover:not-data-disabled:bg-accent/50 sg:focus-visible:z-10 sg:focus-visible:outline-none sg:focus-visible:ring-2 sg:focus-visible:ring-inset sg:focus-visible:ring-ring sg:focus-visible:ring-offset-0 sg:disabled:pointer-events-none sg:disabled:opacity-50",
         className
       ),
       ...props,
       children: [
         children,
         /* @__PURE__ */ jsx(
-          ChevronDownIcon,
-          {
-            "data-slot": "accordion-trigger-icon",
-            className: "sg:pointer-events-none sg:shrink-0 sg:group-aria-expanded/accordion-trigger:hidden"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          ChevronUpIcon,
+          Icon,
           {
+            icon: "ChevronDown",
+            size: "xs",
             "data-slot": "accordion-trigger-icon",
-            className: "sg:pointer-events-none sg:hidden sg:shrink-0 sg:group-aria-expanded/accordion-trigger:inline"
+            className: "sg:pointer-events-none sg:shrink-0 sg:text-muted-foreground sg:transition-transform sg:duration-200 sg:ease-out sg:group-data-panel-open:rotate-180"
           }
         )
       ]
@@ -69,13 +67,13 @@ function AccordionContent({
     AccordionPrimitive.Panel,
     {
       "data-slot": "accordion-content",
-      className: "sg:data-open:animate-accordion-down sg:data-closed:animate-accordion-up sg:px-4 sg:text-sm sg:overflow-hidden",
+      className: "sg:h-(--accordion-panel-height) sg:overflow-hidden sg:text-sm sg:transition-[height] sg:duration-150 sg:ease-out sg:data-ending-style:h-0 sg:data-starting-style:h-0",
       ...props,
       children: /* @__PURE__ */ jsx(
         "div",
         {
           className: cn(
-            "sg:pt-0 sg:pb-4 sg:[&_a]:hover:text-foreground sg:h-(--accordion-panel-height) sg:data-ending-style:h-0 sg:data-starting-style:h-0 sg:[&_a]:underline sg:[&_a]:underline-offset-3 sg:[&_p:not(:last-child)]:mb-4",
+            "sg:px-4 sg:pb-4 sg:text-muted-foreground sg:[&_a]:underline sg:[&_a]:underline-offset-3 sg:[&_a]:hover:text-foreground sg:[&_p:not(:last-child)]:mb-4",
             className
           ),
           children