singularity-components 0.1.195 → 0.1.196

package/dist/components/blocks/loading/loading-skeletons.js

@@ -0,0 +1,78 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Skeleton } from "../../primitives/skeleton/skeleton.js";
+function PostCardSkeleton() {
+  return /* @__PURE__ */ jsxs("div", { className: "sg:rounded-lg sg:border sg:bg-card sg:overflow-hidden", children: [
+    /* @__PURE__ */ jsx(Skeleton, { className: "sg:w-full sg:h-48" }),
+    /* @__PURE__ */ jsxs("div", { className: "sg:p-5 sg:space-y-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "sg:flex sg:gap-2", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-5 sg:w-16 sg:rounded-full" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-5 sg:w-20 sg:rounded-full" })
+      ] }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-6 sg:w-3/4" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-full" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-2/3" }),
+      /* @__PURE__ */ jsxs("div", { className: "sg:flex sg:items-center sg:gap-2 sg:pt-2", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-4 sg:rounded-full" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-24" })
+      ] })
+    ] })
+  ] });
+}
+function PostListSkeleton({ count = 6 }) {
+  return /* @__PURE__ */ jsx("div", { className: "sg:grid sg:grid-cols-1 sm:sg:grid-cols-2 lg:sg:grid-cols-3 sg:gap-6", children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */ jsx(PostCardSkeleton, {}, i)) });
+}
+function PostListRowSkeleton({ count = 4 }) {
+  return /* @__PURE__ */ jsx("div", { className: "sg:flex sg:flex-col sg:gap-4", children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "sg:flex sg:gap-4 sg:rounded-lg sg:border sg:bg-card sg:p-4",
+      children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "sg:w-24 sg:h-24 sg:rounded-md sg:shrink-0" }),
+        /* @__PURE__ */ jsxs("div", { className: "sg:flex-1 sg:space-y-2 sg:py-1", children: [
+          /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-5 sg:w-3/4" }),
+          /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-full" }),
+          /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-3 sg:w-1/3" })
+        ] })
+      ]
+    },
+    i
+  )) });
+}
+function CommentSkeleton({ count = 3 }) {
+  return /* @__PURE__ */ jsx("div", { className: "sg:space-y-4", children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */ jsxs("div", { className: "sg:rounded-lg sg:bg-accent sg:p-4 sg:space-y-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: "sg:flex sg:items-center sg:gap-2", children: [
+      /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-20" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-3 sg:w-16" })
+    ] }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-full" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-2/3" })
+  ] }, i)) });
+}
+function SinglePostSkeleton() {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(Skeleton, { className: "sg:w-full sg:h-64 md:sg:h-96" }),
+    /* @__PURE__ */ jsxs("div", { className: "sg:container sg:max-w-3xl sg:py-12 sg:space-y-4", children: [
+      /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-32" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-3 sg:w-48" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-10 sg:w-3/4" }),
+      /* @__PURE__ */ jsxs("div", { className: "sg:flex sg:gap-2", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-6 sg:w-20 sg:rounded-full" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-6 sg:w-24 sg:rounded-full" })
+      ] }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-5 sg:w-full" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-5 sg:w-5/6" }),
+      /* @__PURE__ */ jsxs("div", { className: "sg:space-y-3 sg:pt-8", children: [
+        Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-full" }, i)),
+        /* @__PURE__ */ jsx(Skeleton, { className: "sg:h-4 sg:w-2/3" })
+      ] })
+    ] })
+  ] });
+}
+export {
+  CommentSkeleton,
+  PostCardSkeleton,
+  PostListRowSkeleton,
+  PostListSkeleton,
+  SinglePostSkeleton
+};
+//# sourceMappingURL=loading-skeletons.js.map

package/dist/components/blocks/loading/loading-skeletons.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/blocks/loading/loading-skeletons.tsx"],"sourcesContent":["import { Skeleton } from \"../../primitives/skeleton/skeleton\";\r\n\r\nexport function PostCardSkeleton() {\r\n\treturn (\r\n\t\t<div className=\"sg:rounded-lg sg:border sg:bg-card sg:overflow-hidden\">\r\n\t\t\t<Skeleton className=\"sg:w-full sg:h-48\" />\r\n\t\t\t<div className=\"sg:p-5 sg:space-y-3\">\r\n\t\t\t\t<div className=\"sg:flex sg:gap-2\">\r\n\t\t\t\t\t<Skeleton className=\"sg:h-5 sg:w-16 sg:rounded-full\" />\r\n\t\t\t\t\t<Skeleton className=\"sg:h-5 sg:w-20 sg:rounded-full\" />\r\n\t\t\t\t</div>\r\n\t\t\t\t<Skeleton className=\"sg:h-6 sg:w-3/4\" />\r\n\t\t\t\t<Skeleton className=\"sg:h-4 sg:w-full\" />\r\n\t\t\t\t<Skeleton className=\"sg:h-4 sg:w-2/3\" />\r\n\t\t\t\t<div className=\"sg:flex sg:items-center sg:gap-2 sg:pt-2\">\r\n\t\t\t\t\t<Skeleton className=\"sg:h-4 sg:w-4 sg:rounded-full\" />\r\n\t\t\t\t\t<Skeleton className=\"sg:h-4 sg:w-24\" />\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n}\r\n\r\nexport function PostListSkeleton({ count = 6 }: { count?: number }) {\r\n\treturn (\r\n\t\t<div className=\"sg:grid sg:grid-cols-1 sm:sg:grid-cols-2 lg:sg:grid-cols-3 sg:gap-6\">\r\n\t\t\t{Array.from({ length: count }).map((_, i) => (\r\n\t\t\t\t<PostCardSkeleton key={i} />\r\n\t\t\t))}\r\n\t\t</div>\r\n\t);\r\n}\r\n\r\nexport function PostListRowSkeleton({ count = 4 }: { count?: number }) {\r\n\treturn (\r\n\t\t<div className=\"sg:flex sg:flex-col sg:gap-4\">\r\n\t\t\t{Array.from({ length: count }).map((_, i) => (\r\n\t\t\t\t<div\r\n\t\t\t\t\tkey={i}\r\n\t\t\t\t\tclassName=\"sg:flex sg:gap-4 sg:rounded-lg sg:border sg:bg-card sg:p-4\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<Skeleton className=\"sg:w-24 sg:h-24 sg:rounded-md sg:shrink-0\" />\r\n\t\t\t\t\t<div className=\"sg:flex-1 sg:space-y-2 sg:py-1\">\r\n\t\t\t\t\t\t<Skeleton className=\"sg:h-5 sg:w-3/4\" />\r\n\t\t\t\t\t\t<Skeleton className=\"sg:h-4 sg:w-full\" />\r\n\t\t\t\t\t\t<Skeleton className=\"sg:h-3 sg:w-1/3\" />\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t))}\r\n\t\t</div>\r\n\t);\r\n}\r\n\r\nexport function CommentSkeleton({ count = 3 }: { count?: number }) {\r\n\treturn (\r\n\t\t<div className=\"sg:space-y-4\">\r\n\t\t\t{Array.from({ length: count }).map((_, i) => (\r\n\t\t\t\t<div key={i} className=\"sg:rounded-lg sg:bg-accent sg:p-4 sg:space-y-2\">\r\n\t\t\t\t\t<div className=\"sg:flex sg:items-center sg:gap-2\">\r\n\t\t\t\t\t\t<Skeleton className=\"sg:h-4 sg:w-20\" />\r\n\t\t\t\t\t\t<Skeleton className=\"sg:h-3 sg:w-16\" />\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<Skeleton className=\"sg:h-4 sg:w-full\" />\r\n\t\t\t\t\t<Skeleton className=\"sg:h-4 sg:w-2/3\" />\r\n\t\t\t\t</div>\r\n\t\t\t))}\r\n\t\t</div>\r\n\t);\r\n}\r\n\r\nexport function SinglePostSkeleton() {\r\n\treturn (\r\n\t\t<div>\r\n\t\t\t<Skeleton className=\"sg:w-full sg:h-64 md:sg:h-96\" />\r\n\t\t\t<div className=\"sg:container sg:max-w-3xl sg:py-12 sg:space-y-4\">\r\n\t\t\t\t<Skeleton className=\"sg:h-4 sg:w-32\" />\r\n\t\t\t\t<Skeleton className=\"sg:h-3 sg:w-48\" />\r\n\t\t\t\t<Skeleton className=\"sg:h-10 sg:w-3/4\" />\r\n\t\t\t\t<div className=\"sg:flex sg:gap-2\">\r\n\t\t\t\t\t<Skeleton className=\"sg:h-6 sg:w-20 sg:rounded-full\" />\r\n\t\t\t\t\t<Skeleton className=\"sg:h-6 sg:w-24 sg:rounded-full\" />\r\n\t\t\t\t</div>\r\n\t\t\t\t<Skeleton className=\"sg:h-5 sg:w-full\" />\r\n\t\t\t\t<Skeleton className=\"sg:h-5 sg:w-5/6\" />\r\n\t\t\t\t<div className=\"sg:space-y-3 sg:pt-8\">\r\n\t\t\t\t\t{Array.from({ length: 6 }).map((_, i) => (\r\n\t\t\t\t\t\t<Skeleton key={i} className=\"sg:h-4 sg:w-full\" />\r\n\t\t\t\t\t))}\r\n\t\t\t\t\t<Skeleton className=\"sg:h-4 sg:w-2/3\" />\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n}\r\n"],"mappings":"AAKG,cAEC,YAFD;AALH,SAAS,gBAAgB;AAElB,SAAS,mBAAmB;AAClC,SACC,qBAAC,SAAI,WAAU,yDACd;AAAA,wBAAC,YAAS,WAAU,qBAAoB;AAAA,IACxC,qBAAC,SAAI,WAAU,uBACd;AAAA,2BAAC,SAAI,WAAU,oBACd;AAAA,4BAAC,YAAS,WAAU,kCAAiC;AAAA,QACrD,oBAAC,YAAS,WAAU,kCAAiC;AAAA,SACtD;AAAA,MACA,oBAAC,YAAS,WAAU,mBAAkB;AAAA,MACtC,oBAAC,YAAS,WAAU,oBAAmB;AAAA,MACvC,oBAAC,YAAS,WAAU,mBAAkB;AAAA,MACtC,qBAAC,SAAI,WAAU,4CACd;AAAA,4BAAC,YAAS,WAAU,iCAAgC;AAAA,QACpD,oBAAC,YAAS,WAAU,kBAAiB;AAAA,SACtC;AAAA,OACD;AAAA,KACD;AAEF;AAEO,SAAS,iBAAiB,EAAE,QAAQ,EAAE,GAAuB;AACnE,SACC,oBAAC,SAAI,WAAU,uEACb,gBAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,EAAE,IAAI,CAAC,GAAG,MACtC,oBAAC,sBAAsB,CAAG,CAC1B,GACF;AAEF;AAEO,SAAS,oBAAoB,EAAE,QAAQ,EAAE,GAAuB;AACtE,SACC,oBAAC,SAAI,WAAU,gCACb,gBAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,EAAE,IAAI,CAAC,GAAG,MACtC;AAAA,IAAC;AAAA;AAAA,MAEA,WAAU;AAAA,MAEV;AAAA,4BAAC,YAAS,WAAU,6CAA4C;AAAA,QAChE,qBAAC,SAAI,WAAU,kCACd;AAAA,8BAAC,YAAS,WAAU,mBAAkB;AAAA,UACtC,oBAAC,YAAS,WAAU,oBAAmB;AAAA,UACvC,oBAAC,YAAS,WAAU,mBAAkB;AAAA,WACvC;AAAA;AAAA;AAAA,IARK;AAAA,EASN,CACA,GACF;AAEF;AAEO,SAAS,gBAAgB,EAAE,QAAQ,EAAE,GAAuB;AAClE,SACC,oBAAC,SAAI,WAAU,gBACb,gBAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,EAAE,IAAI,CAAC,GAAG,MACtC,qBAAC,SAAY,WAAU,kDACtB;AAAA,yBAAC,SAAI,WAAU,oCACd;AAAA,0BAAC,YAAS,WAAU,kBAAiB;AAAA,MACrC,oBAAC,YAAS,WAAU,kBAAiB;AAAA,OACtC;AAAA,IACA,oBAAC,YAAS,WAAU,oBAAmB;AAAA,IACvC,oBAAC,YAAS,WAAU,mBAAkB;AAAA,OAN7B,CAOV,CACA,GACF;AAEF;AAEO,SAAS,qBAAqB;AACpC,SACC,qBAAC,SACA;AAAA,wBAAC,YAAS,WAAU,gCAA+B;AAAA,IACnD,qBAAC,SAAI,WAAU,mDACd;AAAA,0BAAC,YAAS,WAAU,kBAAiB;AAAA,MACrC,oBAAC,YAAS,WAAU,kBAAiB;AAAA,MACrC,oBAAC,YAAS,WAAU,oBAAmB;AAAA,MACvC,qBAAC,SAAI,WAAU,oBACd;AAAA,4BAAC,YAAS,WAAU,kCAAiC;AAAA,QACrD,oBAAC,YAAS,WAAU,kCAAiC;AAAA,SACtD;AAAA,MACA,oBAAC,YAAS,WAAU,oBAAmB;AAAA,MACvC,oBAAC,YAAS,WAAU,mBAAkB;AAAA,MACtC,qBAAC,SAAI,WAAU,wBACb;AAAA,cAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MAClC,oBAAC,YAAiB,WAAU,sBAAb,CAAgC,CAC/C;AAAA,QACD,oBAAC,YAAS,WAAU,mBAAkB;AAAA,SACvC;AAAA,OACD;AAAA,KACD;AAEF;","names":[]}

package/dist/components/blocks/marketing/page-hero.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { icons } from 'lucide-react';
+
+type Props = {
+    icon?: keyof typeof icons;
+    title: string;
+    description?: string;
+    className?: string;
+};
+/** Centered hero strip with icon, title, and optional description. */
+declare function PageHero({ icon, title, description, className }: Props): React.JSX.Element;
+
+export { PageHero };

package/dist/components/blocks/marketing/page-hero.js

@@ -0,0 +1,37 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Icon, Heading, Text } from "../../primitives/index.js";
+import { cn } from "../../../utils/index.js";
+function PageHero({ icon, title, description, className }) {
+  return /* @__PURE__ */ jsx(
+    "section",
+    {
+      className: cn(
+        "sg:bg-primary/5 sg:border-b sg:border-border",
+        className
+      ),
+      children: /* @__PURE__ */ jsxs("div", { className: "sg:container sg:py-16 md:sg:py-20 sg:max-w-3xl sg:mx-auto sg:text-center", children: [
+        icon && /* @__PURE__ */ jsx(
+          Icon,
+          {
+            icon,
+            className: "sg:h-10 sg:w-10 sg:text-primary sg:mx-auto sg:mb-4"
+          }
+        ),
+        /* @__PURE__ */ jsx(Heading, { variant: "h1", className: "sg:mb-3", children: title }),
+        description && /* @__PURE__ */ jsx(
+          Text,
+          {
+            size: "lg",
+            foreground: "muted-foreground",
+            className: "sg:max-w-xl sg:mx-auto sg:leading-relaxed",
+            children: description
+          }
+        )
+      ] })
+    }
+  );
+}
+export {
+  PageHero
+};
+//# sourceMappingURL=page-hero.js.map

package/dist/components/blocks/marketing/page-hero.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/blocks/marketing/page-hero.tsx"],"sourcesContent":["import type { icons } from \"lucide-react\";\r\nimport { Icon, Heading, Text } from \"../../primitives/index\";\r\nimport { cn } from \"../../../utils/index\";\r\n\r\ntype Props = {\r\n\ticon?: keyof typeof icons;\r\n\ttitle: string;\r\n\tdescription?: string;\r\n\tclassName?: string;\r\n};\r\n\r\n/** Centered hero strip with icon, title, and optional description. */\r\nexport function PageHero({ icon, title, description, className }: Props) {\r\n\treturn (\r\n\t\t<section\r\n\t\t\tclassName={cn(\r\n\t\t\t\t\"sg:bg-primary/5 sg:border-b sg:border-border\",\r\n\t\t\t\tclassName,\r\n\t\t\t)}\r\n\t\t>\r\n\t\t\t<div className=\"sg:container sg:py-16 md:sg:py-20 sg:max-w-3xl sg:mx-auto sg:text-center\">\r\n\t\t\t\t{icon && (\r\n\t\t\t\t\t<Icon\r\n\t\t\t\t\t\ticon={icon}\r\n\t\t\t\t\t\tclassName=\"sg:h-10 sg:w-10 sg:text-primary sg:mx-auto sg:mb-4\"\r\n\t\t\t\t\t/>\r\n\t\t\t\t)}\r\n\t\t\t\t<Heading variant=\"h1\" className=\"sg:mb-3\">\r\n\t\t\t\t\t{title}\r\n\t\t\t\t</Heading>\r\n\t\t\t\t{description && (\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\t{description}\r\n\t\t\t\t\t</Text>\r\n\t\t\t\t)}\r\n\t\t\t</div>\r\n\t\t</section>\r\n\t);\r\n}\r\n"],"mappings":"AAoBG,SAEE,KAFF;AAnBH,SAAS,MAAM,SAAS,YAAY;AACpC,SAAS,UAAU;AAUZ,SAAS,SAAS,EAAE,MAAM,OAAO,aAAa,UAAU,GAAU;AACxE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAW;AAAA,QACV;AAAA,QACA;AAAA,MACD;AAAA,MAEA,+BAAC,SAAI,WAAU,4EACb;AAAA,gBACA;AAAA,UAAC;AAAA;AAAA,YACA;AAAA,YACA,WAAU;AAAA;AAAA,QACX;AAAA,QAED,oBAAC,WAAQ,SAAQ,MAAK,WAAU,WAC9B,iBACF;AAAA,QACC,eACA;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,YAAW;AAAA,YACX,WAAU;AAAA,YAET;AAAA;AAAA,QACF;AAAA,SAEF;AAAA;AAAA,EACD;AAEF;","names":[]}

package/dist/components/blocks/marketing/stats-grid.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { icons } from 'lucide-react';
+
+type StatItem = {
+    label: string;
+    value: string;
+    icon?: keyof typeof icons;
+};
+type Props = {
+    items: StatItem[];
+    className?: string;
+};
+/** Grid of stat cards with icon, value, and label. */
+declare function StatsGrid({ items, className }: Props): React.JSX.Element;
+
+export { type StatItem, StatsGrid };

package/dist/components/blocks/marketing/stats-grid.js

@@ -0,0 +1,30 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Card, CardContent } from "../cards/card.js";
+import { Icon, Heading, Text } from "../../primitives/index.js";
+import { cn } from "../../../utils/index.js";
+function StatsGrid({ items, className }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "sg:grid sg:grid-cols-2 md:sg:grid-cols-4 sg:gap-4",
+        className
+      ),
+      children: items.map((stat) => /* @__PURE__ */ jsx(Card, { className: "sg:text-center", children: /* @__PURE__ */ jsxs(CardContent, { className: "sg:pt-6 sg:pb-4", children: [
+        stat.icon && /* @__PURE__ */ jsx(
+          Icon,
+          {
+            icon: stat.icon,
+            className: "sg:h-6 sg:w-6 sg:text-primary sg:mx-auto sg:mb-2"
+          }
+        ),
+        /* @__PURE__ */ jsx(Heading, { variant: "h3", className: "sg:text-3xl", children: stat.value }),
+        /* @__PURE__ */ jsx(Text, { size: "sm", foreground: "muted-foreground", className: "sg:mt-1", children: stat.label })
+      ] }) }, stat.label))
+    }
+  );
+}
+export {
+  StatsGrid
+};
+//# sourceMappingURL=stats-grid.js.map

package/dist/components/blocks/marketing/stats-grid.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/blocks/marketing/stats-grid.tsx"],"sourcesContent":["import type { icons } from \"lucide-react\";\r\nimport { Card, CardContent } from \"../cards/card\";\r\nimport { Icon, Heading, Text } from \"../../primitives/index\";\r\nimport { cn } from \"../../../utils/index\";\r\n\r\nexport type StatItem = {\r\n\tlabel: string;\r\n\tvalue: string;\r\n\ticon?: keyof typeof icons;\r\n};\r\n\r\ntype Props = {\r\n\titems: StatItem[];\r\n\tclassName?: string;\r\n};\r\n\r\n/** Grid of stat cards with icon, value, and label. */\r\nexport function StatsGrid({ items, className }: Props) {\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={cn(\r\n\t\t\t\t\"sg:grid sg:grid-cols-2 md:sg:grid-cols-4 sg:gap-4\",\r\n\t\t\t\tclassName,\r\n\t\t\t)}\r\n\t\t>\r\n\t\t\t{items.map((stat) => (\r\n\t\t\t\t<Card key={stat.label} className=\"sg:text-center\">\r\n\t\t\t\t\t<CardContent className=\"sg:pt-6 sg:pb-4\">\r\n\t\t\t\t\t\t{stat.icon && (\r\n\t\t\t\t\t\t\t<Icon\r\n\t\t\t\t\t\t\t\ticon={stat.icon}\r\n\t\t\t\t\t\t\t\tclassName=\"sg:h-6 sg:w-6 sg:text-primary sg:mx-auto sg:mb-2\"\r\n\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t<Heading variant=\"h3\" className=\"sg:text-3xl\">\r\n\t\t\t\t\t\t\t{stat.value}\r\n\t\t\t\t\t\t</Heading>\r\n\t\t\t\t\t\t<Text size=\"sm\" foreground=\"muted-foreground\" className=\"sg:mt-1\">\r\n\t\t\t\t\t\t\t{stat.label}\r\n\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t</CardContent>\r\n\t\t\t\t</Card>\r\n\t\t\t))}\r\n\t\t</div>\r\n\t);\r\n}\r\n"],"mappings":"AA2BK,SAEE,KAFF;AA1BL,SAAS,MAAM,mBAAmB;AAClC,SAAS,MAAM,SAAS,YAAY;AACpC,SAAS,UAAU;AAcZ,SAAS,UAAU,EAAE,OAAO,UAAU,GAAU;AACtD,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAW;AAAA,QACV;AAAA,QACA;AAAA,MACD;AAAA,MAEC,gBAAM,IAAI,CAAC,SACX,oBAAC,QAAsB,WAAU,kBAChC,+BAAC,eAAY,WAAU,mBACrB;AAAA,aAAK,QACL;AAAA,UAAC;AAAA;AAAA,YACA,MAAM,KAAK;AAAA,YACX,WAAU;AAAA;AAAA,QACX;AAAA,QAED,oBAAC,WAAQ,SAAQ,MAAK,WAAU,eAC9B,eAAK,OACP;AAAA,QACA,oBAAC,QAAK,MAAK,MAAK,YAAW,oBAAmB,WAAU,WACtD,eAAK,OACP;AAAA,SACD,KAdU,KAAK,KAehB,CACA;AAAA;AAAA,EACF;AAEF;","names":[]}

package/dist/components/blocks/marketing/timeline.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+
+type TimelineItem = {
+    year: string;
+    title: string;
+    description: string;
+};
+type Props = {
+    items: TimelineItem[];
+    title?: string;
+    description?: string;
+    className?: string;
+};
+/** Vertical timeline with year, title, and description entries. */
+declare function Timeline({ items, title, description, className, }: Props): React.JSX.Element;
+
+export { Timeline, type TimelineItem };

package/dist/components/blocks/marketing/timeline.js

@@ -0,0 +1,45 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Heading, Text } from "../../primitives/index.js";
+function Timeline({
+  items,
+  title = "Our Journey",
+  description,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("div", { className, children: [
+    /* @__PURE__ */ jsx(Heading, { variant: "h2", className: "sg:mb-2", children: title }),
+    description && /* @__PURE__ */ jsx(Text, { foreground: "muted-foreground", className: "sg:mb-10", children: description }),
+    /* @__PURE__ */ jsxs("div", { className: "sg:relative", children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "sg:absolute sg:left-4 md:sg:left-6 sg:top-0 sg:bottom-0 sg:w-px sg:bg-border",
+          "aria-hidden": "true"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "sg:space-y-10", children: items.map((item, i) => /* @__PURE__ */ jsxs("div", { className: "sg:relative sg:pl-12 md:sg:pl-16", children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "sg:absolute sg:left-2.5 md:sg:left-4.5 sg:top-1 sg:h-3 sg:w-3 sg:rounded-full sg:bg-primary sg:ring-4 sg:ring-background",
+            "aria-hidden": "true"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            size: "xs",
+            className: "sg:font-mono sg:text-primary/70 sg:uppercase sg:tracking-wider",
+            children: item.year
+          }
+        ),
+        /* @__PURE__ */ jsx(Heading, { variant: "h4", className: "sg:mt-0.5", children: item.title }),
+        /* @__PURE__ */ jsx(Text, { size: "sm", foreground: "muted-foreground", className: "sg:mt-1", children: item.description })
+      ] }, i)) })
+    ] })
+  ] });
+}
+export {
+  Timeline
+};
+//# sourceMappingURL=timeline.js.map

package/dist/components/blocks/marketing/timeline.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/blocks/marketing/timeline.tsx"],"sourcesContent":["import { Heading, Text } from \"../../primitives/index\";\r\n\r\nexport type TimelineItem = {\r\n\tyear: string;\r\n\ttitle: string;\r\n\tdescription: string;\r\n};\r\n\r\ntype Props = {\r\n\titems: TimelineItem[];\r\n\ttitle?: string;\r\n\tdescription?: string;\r\n\tclassName?: string;\r\n};\r\n\r\n/** Vertical timeline with year, title, and description entries. */\r\nexport function Timeline({\r\n\titems,\r\n\ttitle = \"Our Journey\",\r\n\tdescription,\r\n\tclassName,\r\n}: Props) {\r\n\treturn (\r\n\t\t<div className={className}>\r\n\t\t\t<Heading variant=\"h2\" className=\"sg:mb-2\">\r\n\t\t\t\t{title}\r\n\t\t\t</Heading>\r\n\t\t\t{description && (\r\n\t\t\t\t<Text foreground=\"muted-foreground\" className=\"sg:mb-10\">\r\n\t\t\t\t\t{description}\r\n\t\t\t\t</Text>\r\n\t\t\t)}\r\n\t\t\t<div className=\"sg:relative\">\r\n\t\t\t\t<div\r\n\t\t\t\t\tclassName=\"sg:absolute sg:left-4 md:sg:left-6 sg:top-0 sg:bottom-0 sg:w-px sg:bg-border\"\r\n\t\t\t\t\taria-hidden=\"true\"\r\n\t\t\t\t/>\r\n\t\t\t\t<div className=\"sg:space-y-10\">\r\n\t\t\t\t\t{items.map((item, i) => (\r\n\t\t\t\t\t\t<div key={i} className=\"sg:relative sg:pl-12 md:sg:pl-16\">\r\n\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\tclassName=\"sg:absolute sg:left-2.5 md:sg:left-4.5 sg:top-1 sg:h-3 sg:w-3 sg:rounded-full sg:bg-primary sg:ring-4 sg:ring-background\"\r\n\t\t\t\t\t\t\t\taria-hidden=\"true\"\r\n\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t<Text\r\n\t\t\t\t\t\t\t\tsize=\"xs\"\r\n\t\t\t\t\t\t\t\tclassName=\"sg:font-mono sg:text-primary/70 sg:uppercase sg:tracking-wider\"\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t{item.year}\r\n\t\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t\t\t<Heading variant=\"h4\" className=\"sg:mt-0.5\">\r\n\t\t\t\t\t\t\t\t{item.title}\r\n\t\t\t\t\t\t\t</Heading>\r\n\t\t\t\t\t\t\t<Text size=\"sm\" foreground=\"muted-foreground\" className=\"sg:mt-1\">\r\n\t\t\t\t\t\t\t\t{item.description}\r\n\t\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t))}\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n}\r\n"],"mappings":"AAwBG,cAeG,YAfH;AAxBH,SAAS,SAAS,YAAY;AAgBvB,SAAS,SAAS;AAAA,EACxB;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA;AACD,GAAU;AACT,SACC,qBAAC,SAAI,WACJ;AAAA,wBAAC,WAAQ,SAAQ,MAAK,WAAU,WAC9B,iBACF;AAAA,IACC,eACA,oBAAC,QAAK,YAAW,oBAAmB,WAAU,YAC5C,uBACF;AAAA,IAED,qBAAC,SAAI,WAAU,eACd;AAAA;AAAA,QAAC;AAAA;AAAA,UACA,WAAU;AAAA,UACV,eAAY;AAAA;AAAA,MACb;AAAA,MACA,oBAAC,SAAI,WAAU,iBACb,gBAAM,IAAI,CAAC,MAAM,MACjB,qBAAC,SAAY,WAAU,oCACtB;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,WAAU;AAAA,YACV,eAAY;AAAA;AAAA,QACb;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,WAAU;AAAA,YAET,eAAK;AAAA;AAAA,QACP;AAAA,QACA,oBAAC,WAAQ,SAAQ,MAAK,WAAU,aAC9B,eAAK,OACP;AAAA,QACA,oBAAC,QAAK,MAAK,MAAK,YAAW,oBAAmB,WAAU,WACtD,eAAK,aACP;AAAA,WAhBS,CAiBV,CACA,GACF;AAAA,OACD;AAAA,KACD;AAEF;","names":[]}

package/dist/components/blocks/marketing/values-grid.d.ts

@@ -0,0 +1,16 @@
+import * as React$1 from 'react';
+
+type ValueItem = {
+    title: string;
+    description: string;
+};
+type Props = {
+    items: ValueItem[];
+    title?: string;
+    icon?: React.ReactNode;
+    className?: string;
+};
+/** Grid of value cards with title and description. */
+declare function ValuesGrid({ items, title, icon, className, }: Props): React$1.JSX.Element;
+
+export { type ValueItem, ValuesGrid };

package/dist/components/blocks/marketing/values-grid.js

@@ -0,0 +1,29 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Heading, Text } from "../../primitives/index.js";
+import { cn } from "../../../utils/index.js";
+function ValuesGrid({
+  items,
+  title = "What We Value",
+  icon,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("sg:text-center", className), children: [
+    icon,
+    /* @__PURE__ */ jsx(Heading, { variant: "h2", className: "sg:mb-4", children: title }),
+    /* @__PURE__ */ jsx("div", { className: "sg:grid sg:gap-4 sm:sg:grid-cols-3 sg:text-left sg:mt-8", children: items.map((value) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "sg:p-4 sg:rounded-lg sg:bg-background sg:border sg:border-border",
+        children: [
+          /* @__PURE__ */ jsx(Heading, { variant: "h6", className: "sg:mb-1", children: value.title }),
+          /* @__PURE__ */ jsx(Text, { size: "sm", foreground: "muted-foreground", children: value.description })
+        ]
+      },
+      value.title
+    )) })
+  ] });
+}
+export {
+  ValuesGrid
+};
+//# sourceMappingURL=values-grid.js.map

package/dist/components/blocks/marketing/values-grid.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/blocks/marketing/values-grid.tsx"],"sourcesContent":["import { Heading, Text } from \"../../primitives/index\";\r\nimport { cn } from \"../../../utils/index\";\r\n\r\nexport type ValueItem = {\r\n\ttitle: string;\r\n\tdescription: string;\r\n};\r\n\r\ntype Props = {\r\n\titems: ValueItem[];\r\n\ttitle?: string;\r\n\ticon?: React.ReactNode;\r\n\tclassName?: string;\r\n};\r\n\r\n/** Grid of value cards with title and description. */\r\nexport function ValuesGrid({\r\n\titems,\r\n\ttitle = \"What We Value\",\r\n\ticon,\r\n\tclassName,\r\n}: Props) {\r\n\treturn (\r\n\t\t<div className={cn(\"sg:text-center\", className)}>\r\n\t\t\t{icon}\r\n\t\t\t<Heading variant=\"h2\" className=\"sg:mb-4\">\r\n\t\t\t\t{title}\r\n\t\t\t</Heading>\r\n\t\t\t<div className=\"sg:grid sg:gap-4 sm:sg:grid-cols-3 sg:text-left sg:mt-8\">\r\n\t\t\t\t{items.map((value) => (\r\n\t\t\t\t\t<div\r\n\t\t\t\t\t\tkey={value.title}\r\n\t\t\t\t\t\tclassName=\"sg:p-4 sg:rounded-lg sg:bg-background sg:border sg:border-border\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t<Heading variant=\"h6\" className=\"sg:mb-1\">\r\n\t\t\t\t\t\t\t{value.title}\r\n\t\t\t\t\t\t</Heading>\r\n\t\t\t\t\t\t<Text size=\"sm\" foreground=\"muted-foreground\">\r\n\t\t\t\t\t\t\t{value.description}\r\n\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t))}\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n}\r\n"],"mappings":"AAyBG,cAKE,YALF;AAzBH,SAAS,SAAS,YAAY;AAC9B,SAAS,UAAU;AAeZ,SAAS,WAAW;AAAA,EAC1B;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA;AACD,GAAU;AACT,SACC,qBAAC,SAAI,WAAW,GAAG,kBAAkB,SAAS,GAC5C;AAAA;AAAA,IACD,oBAAC,WAAQ,SAAQ,MAAK,WAAU,WAC9B,iBACF;AAAA,IACA,oBAAC,SAAI,WAAU,2DACb,gBAAM,IAAI,CAAC,UACX;AAAA,MAAC;AAAA;AAAA,QAEA,WAAU;AAAA,QAEV;AAAA,8BAAC,WAAQ,SAAQ,MAAK,WAAU,WAC9B,gBAAM,OACR;AAAA,UACA,oBAAC,QAAK,MAAK,MAAK,YAAW,oBACzB,gBAAM,aACR;AAAA;AAAA;AAAA,MARK,MAAM;AAAA,IASZ,CACA,GACF;AAAA,KACD;AAEF;","names":[]}

package/dist/components/index.d.ts

@@ -1,13 +1,34 @@
 export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './blocks/cards/card.js';
+export { AuthorCard } from './blocks/directory/author-card.js';
+export { CategoryCard } from './blocks/directory/category-card.js';
+export { ExtrasHubCard, ExtrasHubItem } from './blocks/extras/extras-hub-card.js';
+export { GalleryImage } from './blocks/gallery/image-gallery.js';
+export { CommentSkeleton, PostCardSkeleton, PostListRowSkeleton, PostListSkeleton, SinglePostSkeleton } from './blocks/loading/loading-skeletons.js';
 export { Login, LoginCredentials, LoginProps } from './blocks/login/login.js';
+export { PageHero } from './blocks/marketing/page-hero.js';
+export { StatItem, StatsGrid } from './blocks/marketing/stats-grid.js';
+export { Timeline, TimelineItem } from './blocks/marketing/timeline.js';
+export { ValueItem, ValuesGrid } from './blocks/marketing/values-grid.js';
 export { PostListWithFilters } from './blocks/post-list/post-list-with-filters.js';
+export { AboutPage } from './pages/about/about-page.js';
 export { AdminPage, AdminPageProps } from './pages/admin/admin-page.js';
+export { AuthorPage } from './pages/author/author-page.js';
+export { AuthorsPage } from './pages/authors/authors-page.js';
 export { BlogPost } from './pages/blogpost/blogpost.js';
+export { CategoriesPage } from './pages/categories/categories-page.js';
 export { CategoryPage } from './pages/category/category-page.js';
+export { ChatPage } from './pages/chat/chat-page.js';
+export { ContactPage } from './pages/contact/contact-page.js';
+export { ContentBlocksPage } from './pages/content-blocks/content-blocks-page.js';
+export { ExtrasHubPage } from './pages/extras/extras-hub-page.js';
 export { LoginPage } from './pages/login/login-page.js';
 export { MaintenancePage } from './pages/maintenance/maintenance-page.js';
+export { MembershipPage } from './pages/membership/membership-page.js';
+export { MosaicPage } from './pages/mosaic/mosaic-page.js';
+export { NewsletterPage } from './pages/newsletter/newsletter-page.js';
 export { NotFound } from './pages/not-found/not-found.js';
 export { PrivacyPage } from './pages/privacy/privacy-page.js';
+export { ResourcesPage } from './pages/resources/resources-page.js';
 export { SearchPage } from './pages/search/search-page.js';
 export { StartPage } from './pages/startpage/startpage.js';
 export { TermsPage } from './pages/terms/terms-page.js';
@@ -21,6 +42,9 @@ export { LinkButton } from './primitives/buttons/link-button.js';
 export { Collapsible, CollapsibleContent, CollapsibleTrigger } from './primitives/collapsible/collapsible.js';
 export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from './primitives/dropdown-menu/dropdown-menu.js';
 export { Checkbox } from './primitives/forms/checkbox.js';
+export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle } from './primitives/forms/field.js';
+export { Form, FormActions } from './primitives/forms/form.js';
+export { FormControl } from './primitives/forms/form-control.js';
 export { Input } from './primitives/forms/input.js';
 export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue } from './primitives/forms/select.js';
 export { Textarea } from './primitives/forms/textarea.js';
@@ -49,19 +73,22 @@ export { AuthProvider, useAuth } from './providers/auth-provider.js';
 export { Theme, ThemeProvider, ThemeProviderProps, ThemeProviderState, useTheme } from './providers/theme-provider.js';
 export { Container } from './templates/container/container.js';
 export { Footer } from './templates/footer/footer.js';
+export { LoadingScreen } from './templates/loading-screen/loading-screen.js';
 export { Header, HeaderProps, NavLink } from './templates/navigation/header.js';
 export { toast } from 'sonner';
 import 'react';
+import '../data/authors.js';
+import 'lucide-react';
 import '../data/posts.js';
 import '@base-ui/react/accordion';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
 import '@base-ui/react/use-render';
 import '@base-ui/react/button';
-import 'lucide-react';
 import '@radix-ui/react-collapsible';
 import '@radix-ui/react-dropdown-menu';
 import '@base-ui/react';
+import '../lib/forms/field-props.js';
 import '@base-ui/react/separator';
 import '@radix-ui/react-dialog';
 import './primitives/text/internal/text-element.js';

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

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

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

@@ -0,0 +1,161 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { motion } from "framer-motion";
+import { Layout, Heading, Text, Icon, Separator } from "../../primitives/index.js";
+import { PageHero } from "../../blocks/marketing/page-hero.js";
+import { StatsGrid } from "../../blocks/marketing/stats-grid.js";
+import { Timeline } from "../../blocks/marketing/timeline.js";
+import { ValuesGrid } from "../../blocks/marketing/values-grid.js";
+import { Card, CardContent } from "../../blocks/cards/card.js";
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage
+} from "../../primitives/avatar/avatar.js";
+import { Link } from "../../primitives/link/link.js";
+import { authors } from "../../../data/authors.js";
+import { posts } from "../../../data/posts.js";
+const stats = [
+  {
+    label: "Articles Published",
+    value: posts.length.toString(),
+    icon: "BookOpen"
+  },
+  {
+    label: "Contributing Writers",
+    value: authors.length.toString(),
+    icon: "Users"
+  },
+  {
+    label: "Categories Covered",
+    value: [...new Set(posts.flatMap((p) => p.categories))].length.toString(),
+    icon: "TrendingUp"
+  },
+  { label: "Years Running", value: "3", icon: "Calendar" }
+];
+const timeline = [
+  {
+    year: "2023",
+    title: "The Beginning",
+    description: "Launched as a personal blog about slow living and intentional design."
+  },
+  {
+    year: "2023",
+    title: "Growing the Team",
+    description: "New contributing writers expanded coverage into culture and design."
+  },
+  {
+    year: "2024",
+    title: "Community & Resources",
+    description: "Introduced the Resources hub and Mosaic gallery. Readership doubled."
+  },
+  {
+    year: "2025",
+    title: "New Horizons",
+    description: "Expanded categories, launched chat, and hit a milestone of regular readers."
+  }
+];
+const values = [
+  {
+    title: "Depth over speed",
+    description: "We take time to research, write, and edit. Every piece earns its place."
+  },
+  {
+    title: "Beauty in simplicity",
+    description: "Clean design, honest words, and images that breathe."
+  },
+  {
+    title: "Community first",
+    description: "We write for curious minds who value connection and craft."
+  }
+];
+function AboutPage() {
+  return /* @__PURE__ */ jsxs(
+    motion.div,
+    {
+      initial: { opacity: 0, y: 20 },
+      animate: { opacity: 1, y: 0 },
+      transition: { duration: 0.3 },
+      children: [
+        /* @__PURE__ */ jsx(
+          PageHero,
+          {
+            icon: "Heart",
+            title: "About filion",
+            description: "We believe in the power of slow, intentional storytelling \u2014 depth over speed, beauty over noise, and presence over productivity."
+          }
+        ),
+        /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-16", children: /* @__PURE__ */ jsx(Layout.Col1, { hideDiv: true, className: "sg:max-w-4xl", children: /* @__PURE__ */ jsx(StatsGrid, { items: stats }) }) }),
+        /* @__PURE__ */ jsx("section", { className: "sg:bg-muted/40 sg:border-y sg:border-border", children: /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-16", children: /* @__PURE__ */ jsxs(Layout.Col1, { hideDiv: true, className: "sg:max-w-3xl", children: [
+          /* @__PURE__ */ jsx(Heading, { variant: "h2", className: "sg:mb-6", children: "Our Story" }),
+          /* @__PURE__ */ jsxs("div", { className: "sg:space-y-4", children: [
+            /* @__PURE__ */ jsx(Text, { foreground: "muted-foreground", className: "sg:leading-relaxed", children: "What began as one writer's reflections on slow mornings and handwritten letters grew into a collective of voices united by curiosity and care." }),
+            /* @__PURE__ */ jsx(Text, { foreground: "muted-foreground", className: "sg:leading-relaxed", children: "Today, our team explores everything from minimalist design to global traditions, always with the same ethos: take your time, pay attention, and tell the story honestly." })
+          ] })
+        ] }) }) }),
+        /* @__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:mb-2", children: "The Team" }),
+          /* @__PURE__ */ jsx(Text, { foreground: "muted-foreground", className: "sg:mb-8", children: "The writers behind the words." }),
+          /* @__PURE__ */ jsx("div", { className: "sg:grid sg:gap-6 sm:sg:grid-cols-3", children: authors.map((author) => /* @__PURE__ */ jsx(
+            Link,
+            {
+              to: `/extras/authors/${author.slug}`,
+              variant: "no-decoration",
+              className: "sg:group",
+              children: /* @__PURE__ */ jsx(Card, { className: "sg:h-full sg:transition-shadow sg:hover:shadow-lg sg:hover:border-primary/40", children: /* @__PURE__ */ jsxs(CardContent, { className: "sg:pt-6 sg:text-center", children: [
+                /* @__PURE__ */ jsxs(Avatar, { className: "sg:h-20 sg:w-20 sg:mx-auto sg:mb-3", children: [
+                  /* @__PURE__ */ jsx(AvatarImage, { src: author.avatar, alt: author.name }),
+                  /* @__PURE__ */ jsx(AvatarFallback, { children: author.name[0] })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Heading,
+                  {
+                    variant: "h5",
+                    className: "sg:group-hover:text-primary sg:transition-colors",
+                    children: author.name
+                  }
+                ),
+                /* @__PURE__ */ jsx(Text, { size: "sm", className: "sg:text-primary/80 sg:mb-2", children: author.role }),
+                /* @__PURE__ */ jsx(
+                  Text,
+                  {
+                    size: "sm",
+                    foreground: "muted-foreground",
+                    className: "sg:line-clamp-3 sg:leading-relaxed",
+                    children: author.bio
+                  }
+                )
+              ] }) })
+            },
+            author.slug
+          )) })
+        ] }) }),
+        /* @__PURE__ */ jsx(Separator, { className: "sg:max-w-3xl sg:mx-auto" }),
+        /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-16", children: /* @__PURE__ */ jsx(Layout.Col1, { hideDiv: true, className: "sg:max-w-3xl", children: /* @__PURE__ */ jsx(
+          Timeline,
+          {
+            items: timeline,
+            description: "Key moments that shaped our journey."
+          }
+        ) }) }),
+        /* @__PURE__ */ jsx("section", { className: "sg:bg-primary/5 sg:border-t sg:border-border", children: /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-16", children: /* @__PURE__ */ jsx(Layout.Col1, { hideDiv: true, className: "sg:max-w-3xl", children: /* @__PURE__ */ jsx(
+          ValuesGrid,
+          {
+            items: values,
+            icon: /* @__PURE__ */ jsx(
+              Icon,
+              {
+                icon: "Award",
+                className: "sg:h-8 sg:w-8 sg:text-primary sg:mx-auto sg:mb-4"
+              }
+            )
+          }
+        ) }) }) })
+      ]
+    }
+  );
+}
+export {
+  AboutPage
+};
+//# sourceMappingURL=about-page.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/pages/about/about-page.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { motion } from \"framer-motion\";\r\nimport { Layout, Heading, Text, Icon, Separator } from \"../../primitives/index\";\r\nimport { PageHero } from \"../../blocks/marketing/page-hero\";\r\nimport { StatsGrid } from \"../../blocks/marketing/stats-grid\";\r\nimport { Timeline } from \"../../blocks/marketing/timeline\";\r\nimport { ValuesGrid } from \"../../blocks/marketing/values-grid\";\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 { Link } from \"../../primitives/link/link\";\r\nimport { authors } from \"../../../data/authors\";\r\nimport { posts } from \"../../../data/posts\";\r\n\r\nconst stats = [\r\n\t{\r\n\t\tlabel: \"Articles Published\",\r\n\t\tvalue: posts.length.toString(),\r\n\t\ticon: \"BookOpen\" as const,\r\n\t},\r\n\t{\r\n\t\tlabel: \"Contributing Writers\",\r\n\t\tvalue: authors.length.toString(),\r\n\t\ticon: \"Users\" as const,\r\n\t},\r\n\t{\r\n\t\tlabel: \"Categories Covered\",\r\n\t\tvalue: [...new Set(posts.flatMap((p) => p.categories))].length.toString(),\r\n\t\ticon: \"TrendingUp\" as const,\r\n\t},\r\n\t{ label: \"Years Running\", value: \"3\", icon: \"Calendar\" as const },\r\n];\r\n\r\nconst timeline = [\r\n\t{\r\n\t\tyear: \"2023\",\r\n\t\ttitle: \"The Beginning\",\r\n\t\tdescription:\r\n\t\t\t\"Launched as a personal blog about slow living and intentional design.\",\r\n\t},\r\n\t{\r\n\t\tyear: \"2023\",\r\n\t\ttitle: \"Growing the Team\",\r\n\t\tdescription:\r\n\t\t\t\"New contributing writers expanded coverage into culture and design.\",\r\n\t},\r\n\t{\r\n\t\tyear: \"2024\",\r\n\t\ttitle: \"Community & Resources\",\r\n\t\tdescription:\r\n\t\t\t\"Introduced the Resources hub and Mosaic gallery. Readership doubled.\",\r\n\t},\r\n\t{\r\n\t\tyear: \"2025\",\r\n\t\ttitle: \"New Horizons\",\r\n\t\tdescription:\r\n\t\t\t\"Expanded categories, launched chat, and hit a milestone of regular readers.\",\r\n\t},\r\n];\r\n\r\nconst values = [\r\n\t{\r\n\t\ttitle: \"Depth over speed\",\r\n\t\tdescription:\r\n\t\t\t\"We take time to research, write, and edit. Every piece earns its place.\",\r\n\t},\r\n\t{\r\n\t\ttitle: \"Beauty in simplicity\",\r\n\t\tdescription: \"Clean design, honest words, and images that breathe.\",\r\n\t},\r\n\t{\r\n\t\ttitle: \"Community first\",\r\n\t\tdescription:\r\n\t\t\t\"We write for curious minds who value connection and craft.\",\r\n\t},\r\n];\r\n\r\nexport function AboutPage() {\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<PageHero\r\n\t\t\t\ticon=\"Heart\"\r\n\t\t\t\ttitle=\"About filion\"\r\n\t\t\t\tdescription=\"We believe in the power of slow, intentional storytelling — depth over speed, beauty over noise, and presence over productivity.\"\r\n\t\t\t/>\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<StatsGrid items={stats} />\r\n\t\t\t\t</Layout.Col1>\r\n\t\t\t</Layout>\r\n\r\n\t\t\t<section className=\"sg:bg-muted/40 sg:border-y sg:border-border\">\r\n\t\t\t\t<Layout type=\"col\" className=\"sg:py-16\">\r\n\t\t\t\t\t<Layout.Col1 hideDiv className=\"sg:max-w-3xl\">\r\n\t\t\t\t\t\t<Heading variant=\"h2\" className=\"sg:mb-6\">\r\n\t\t\t\t\t\t\tOur Story\r\n\t\t\t\t\t\t</Heading>\r\n\t\t\t\t\t\t<div className=\"sg:space-y-4\">\r\n\t\t\t\t\t\t\t<Text foreground=\"muted-foreground\" className=\"sg:leading-relaxed\">\r\n\t\t\t\t\t\t\t\tWhat began as one writer&apos;s reflections on slow mornings and\r\n\t\t\t\t\t\t\t\thandwritten letters grew into a collective of voices united by\r\n\t\t\t\t\t\t\t\tcuriosity and care.\r\n\t\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t\t\t<Text foreground=\"muted-foreground\" className=\"sg:leading-relaxed\">\r\n\t\t\t\t\t\t\t\tToday, our team explores everything from minimalist design to\r\n\t\t\t\t\t\t\t\tglobal traditions, always with the same ethos: take your time,\r\n\t\t\t\t\t\t\t\tpay attention, and tell the story honestly.\r\n\t\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</Layout.Col1>\r\n\t\t\t\t</Layout>\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:mb-2\">\r\n\t\t\t\t\t\tThe Team\r\n\t\t\t\t\t</Heading>\r\n\t\t\t\t\t<Text foreground=\"muted-foreground\" className=\"sg:mb-8\">\r\n\t\t\t\t\t\tThe writers behind the words.\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{authors.map((author) => (\r\n\t\t\t\t\t\t\t<Link\r\n\t\t\t\t\t\t\t\tkey={author.slug}\r\n\t\t\t\t\t\t\t\tto={`/extras/authors/${author.slug}`}\r\n\t\t\t\t\t\t\t\tvariant=\"no-decoration\"\r\n\t\t\t\t\t\t\t\tclassName=\"sg:group\"\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t<Card className=\"sg:h-full sg:transition-shadow sg:hover:shadow-lg sg:hover:border-primary/40\">\r\n\t\t\t\t\t\t\t\t\t<CardContent className=\"sg:pt-6 sg:text-center\">\r\n\t\t\t\t\t\t\t\t\t\t<Avatar className=\"sg:h-20 sg:w-20 sg:mx-auto sg:mb-3\">\r\n\t\t\t\t\t\t\t\t\t\t\t<AvatarImage src={author.avatar} alt={author.name} />\r\n\t\t\t\t\t\t\t\t\t\t\t<AvatarFallback>{author.name[0]}</AvatarFallback>\r\n\t\t\t\t\t\t\t\t\t\t</Avatar>\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\tvariant=\"h5\"\r\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"sg:group-hover:text-primary sg:transition-colors\"\r\n\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t{author.name}\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<Text size=\"sm\" className=\"sg:text-primary/80 sg:mb-2\">\r\n\t\t\t\t\t\t\t\t\t\t\t{author.role}\r\n\t\t\t\t\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t\t\t\t\t\t<Text\r\n\t\t\t\t\t\t\t\t\t\t\tsize=\"sm\"\r\n\t\t\t\t\t\t\t\t\t\t\tforeground=\"muted-foreground\"\r\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"sg:line-clamp-3 sg:leading-relaxed\"\r\n\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t{author.bio}\r\n\t\t\t\t\t\t\t\t\t\t</Text>\r\n\t\t\t\t\t\t\t\t\t</CardContent>\r\n\t\t\t\t\t\t\t\t</Card>\r\n\t\t\t\t\t\t\t</Link>\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-3xl\">\r\n\t\t\t\t\t<Timeline\r\n\t\t\t\t\t\titems={timeline}\r\n\t\t\t\t\t\tdescription=\"Key moments that shaped our journey.\"\r\n\t\t\t\t\t/>\r\n\t\t\t\t</Layout.Col1>\r\n\t\t\t</Layout>\r\n\r\n\t\t\t<section className=\"sg:bg-primary/5 sg:border-t sg:border-border\">\r\n\t\t\t\t<Layout type=\"col\" className=\"sg:py-16\">\r\n\t\t\t\t\t<Layout.Col1 hideDiv className=\"sg:max-w-3xl\">\r\n\t\t\t\t\t\t<ValuesGrid\r\n\t\t\t\t\t\t\titems={values}\r\n\t\t\t\t\t\t\ticon={\r\n\t\t\t\t\t\t\t\t<Icon\r\n\t\t\t\t\t\t\t\t\ticon=\"Award\"\r\n\t\t\t\t\t\t\t\t\tclassName=\"sg:h-8 sg:w-8 sg:text-primary sg:mx-auto sg:mb-4\"\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/>\r\n\t\t\t\t\t</Layout.Col1>\r\n\t\t\t\t</Layout>\r\n\t\t\t</section>\r\n\t\t</motion.div>\r\n\t);\r\n}\r\n"],"mappings":";AAwFG,cAkBG,YAlBH;AAtFH,SAAS,cAAc;AACvB,SAAS,QAAQ,SAAS,MAAM,MAAM,iBAAiB;AACvD,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAC3B,SAAS,MAAM,mBAAmB;AAClC;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,YAAY;AACrB,SAAS,eAAe;AACxB,SAAS,aAAa;AAEtB,MAAM,QAAQ;AAAA,EACb;AAAA,IACC,OAAO;AAAA,IACP,OAAO,MAAM,OAAO,SAAS;AAAA,IAC7B,MAAM;AAAA,EACP;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,OAAO,QAAQ,OAAO,SAAS;AAAA,IAC/B,MAAM;AAAA,EACP;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,OAAO,CAAC,GAAG,IAAI,IAAI,MAAM,QAAQ,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC,EAAE,OAAO,SAAS;AAAA,IACxE,MAAM;AAAA,EACP;AAAA,EACA,EAAE,OAAO,iBAAiB,OAAO,KAAK,MAAM,WAAoB;AACjE;AAEA,MAAM,WAAW;AAAA,EAChB;AAAA,IACC,MAAM;AAAA,IACN,OAAO;AAAA,IACP,aACC;AAAA,EACF;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,OAAO;AAAA,IACP,aACC;AAAA,EACF;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,OAAO;AAAA,IACP,aACC;AAAA,EACF;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,OAAO;AAAA,IACP,aACC;AAAA,EACF;AACD;AAEA,MAAM,SAAS;AAAA,EACd;AAAA,IACC,OAAO;AAAA,IACP,aACC;AAAA,EACF;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,aAAa;AAAA,EACd;AAAA,EACA;AAAA,IACC,OAAO;AAAA,IACP,aACC;AAAA,EACF;AACD;AAEO,SAAS,YAAY;AAC3B,SACC;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;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,OAAM;AAAA,YACN,aAAY;AAAA;AAAA,QACb;AAAA,QAEA,oBAAC,UAAO,MAAK,OAAM,WAAU,YAC5B,8BAAC,OAAO,MAAP,EAAY,SAAO,MAAC,WAAU,gBAC9B,8BAAC,aAAU,OAAO,OAAO,GAC1B,GACD;AAAA,QAEA,oBAAC,aAAQ,WAAU,+CAClB,8BAAC,UAAO,MAAK,OAAM,WAAU,YAC5B,+BAAC,OAAO,MAAP,EAAY,SAAO,MAAC,WAAU,gBAC9B;AAAA,8BAAC,WAAQ,SAAQ,MAAK,WAAU,WAAU,uBAE1C;AAAA,UACA,qBAAC,SAAI,WAAU,gBACd;AAAA,gCAAC,QAAK,YAAW,oBAAmB,WAAU,sBAAqB,4JAInE;AAAA,YACA,oBAAC,QAAK,YAAW,oBAAmB,WAAU,sBAAqB,sLAInE;AAAA,aACD;AAAA,WACD,GACD,GACD;AAAA,QAEA,oBAAC,UAAO,MAAK,OAAM,WAAU,YAC5B,+BAAC,OAAO,MAAP,EAAY,SAAO,MAAC,WAAU,gBAC9B;AAAA,8BAAC,WAAQ,SAAQ,MAAK,WAAU,WAAU,sBAE1C;AAAA,UACA,oBAAC,QAAK,YAAW,oBAAmB,WAAU,WAAU,2CAExD;AAAA,UACA,oBAAC,SAAI,WAAU,sCACb,kBAAQ,IAAI,CAAC,WACb;AAAA,YAAC;AAAA;AAAA,cAEA,IAAI,mBAAmB,OAAO,IAAI;AAAA,cAClC,SAAQ;AAAA,cACR,WAAU;AAAA,cAEV,8BAAC,QAAK,WAAU,gFACf,+BAAC,eAAY,WAAU,0BACtB;AAAA,qCAAC,UAAO,WAAU,sCACjB;AAAA,sCAAC,eAAY,KAAK,OAAO,QAAQ,KAAK,OAAO,MAAM;AAAA,kBACnD,oBAAC,kBAAgB,iBAAO,KAAK,CAAC,GAAE;AAAA,mBACjC;AAAA,gBACA;AAAA,kBAAC;AAAA;AAAA,oBACA,SAAQ;AAAA,oBACR,WAAU;AAAA,oBAET,iBAAO;AAAA;AAAA,gBACT;AAAA,gBACA,oBAAC,QAAK,MAAK,MAAK,WAAU,8BACxB,iBAAO,MACT;AAAA,gBACA;AAAA,kBAAC;AAAA;AAAA,oBACA,MAAK;AAAA,oBACL,YAAW;AAAA,oBACX,WAAU;AAAA,oBAET,iBAAO;AAAA;AAAA,gBACT;AAAA,iBACD,GACD;AAAA;AAAA,YA5BK,OAAO;AAAA,UA6Bb,CACA,GACF;AAAA,WACD,GACD;AAAA,QAEA,oBAAC,aAAU,WAAU,2BAA0B;AAAA,QAE/C,oBAAC,UAAO,MAAK,OAAM,WAAU,YAC5B,8BAAC,OAAO,MAAP,EAAY,SAAO,MAAC,WAAU,gBAC9B;AAAA,UAAC;AAAA;AAAA,YACA,OAAO;AAAA,YACP,aAAY;AAAA;AAAA,QACb,GACD,GACD;AAAA,QAEA,oBAAC,aAAQ,WAAU,gDAClB,8BAAC,UAAO,MAAK,OAAM,WAAU,YAC5B,8BAAC,OAAO,MAAP,EAAY,SAAO,MAAC,WAAU,gBAC9B;AAAA,UAAC;AAAA;AAAA,YACA,OAAO;AAAA,YACP,MACC;AAAA,cAAC;AAAA;AAAA,gBACA,MAAK;AAAA,gBACL,WAAU;AAAA;AAAA,YACX;AAAA;AAAA,QAEF,GACD,GACD,GACD;AAAA;AAAA;AAAA,EACD;AAEF;","names":[]}

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

@@ -23,6 +23,7 @@ function AdminPage({ initialEditId }) {
   const { toast } = useToast();
   const emptyPost = {
     id: 0,
+    slug: "",
     title: "",
     excerpt: "",
     content: "",
@@ -39,6 +40,7 @@ function AdminPage({ initialEditId }) {
       if (post) {
         setForm({
           id: post.id,
+          slug: post.slug,
           title: post.title,
           excerpt: post.excerpt,
           content: post.content,
@@ -66,7 +68,8 @@ function AdminPage({ initialEditId }) {
       setEditing(null);
     } else {
       const nextId = Math.max(...postsList.map((p) => p.id), 0) + 1;
-      setPostsList((prev) => [{ ...form, id: nextId }, ...prev]);
+      const slug = form.slug || form.title.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "") || `post-${nextId}`;
+      setPostsList((prev) => [{ ...form, id: nextId, slug }, ...prev]);
       toast.success("Post created", {
         description: `"${form.title}" has been published.`
       });