@olwiba/ui 0.0.36 → 0.0.38

package/dist/index.d.ts

@@ -359,9 +359,36 @@ interface StatsSectionProps {
 }
 declare function StatsSection({ title, description, badge, stats, }: StatsSectionProps): react_jsx_runtime.JSX.Element;
 
-declare function NewsletterSection(): react_jsx_runtime.JSX.Element;
+interface NewsletterSectionProps {
+    badge?: string;
+    title?: string;
+    description?: string;
+    placeholder?: string;
+    submitLabel?: string;
+    privacyHref?: string;
+    privacyLabel?: string;
+    successTitle?: string;
+    successDescription?: string;
+    onSubscribe?: (email: string) => void | Promise<void>;
+}
+declare function NewsletterSection({ badge, title, description, placeholder, submitLabel, privacyHref, privacyLabel, successTitle, successDescription, onSubscribe, }?: NewsletterSectionProps): react_jsx_runtime.JSX.Element;
 
-declare function ContactSection(): react_jsx_runtime.JSX.Element;
+type ContactInfoItem = {
+    label: string;
+    value: string;
+    icon?: LucideIcon;
+};
+interface ContactSectionProps {
+    badge?: string;
+    title?: string;
+    description?: string;
+    contactInfo?: ContactInfoItem[];
+    successTitle?: string;
+    successDescription?: string;
+    sendAnotherLabel?: string;
+    onSubmit?: (event: React.FormEvent<HTMLFormElement>) => void | Promise<void>;
+}
+declare function ContactSection({ badge, title, description, contactInfo, successTitle, successDescription, sendAnotherLabel, onSubmit, }?: ContactSectionProps): react_jsx_runtime.JSX.Element;
 
 interface NavbarProps {
     brand: {
@@ -787,6 +814,25 @@ interface PostListProps {
 }
 declare function PostList({ posts, renderLink, emptyMessage }: PostListProps): react_jsx_runtime.JSX.Element;
 
+interface ChangelogCardProps {
+    title: string;
+    summary: string;
+    date: string;
+    slug: string;
+    version?: string;
+    hrefPrefix?: string;
+    renderLink?: AppShellRenderLink;
+}
+declare function ChangelogCard({ title, summary, date, slug, version, hrefPrefix, renderLink, }: ChangelogCardProps): react_jsx_runtime.JSX.Element;
+
+interface ChangelogListProps {
+    entries: ChangelogCardProps[];
+    renderLink?: AppShellRenderLink;
+    emptyMessage?: string;
+    hrefPrefix?: string;
+}
+declare function ChangelogList({ entries, renderLink, emptyMessage, hrefPrefix, }: ChangelogListProps): react_jsx_runtime.JSX.Element;
+
 interface MdxContentProps {
     code: string;
 }
@@ -848,4 +894,4 @@ interface UsePaginationReturn {
 }
 declare function usePagination(total: number, pageSize: number): UsePaginationReturn;
 
-export { type AppNavItem, AppScreen, AppShell, type AppShellAction, type AppShellBrand, type AppShellProps, type AppShellRenderLink, type AppShellUser, type AuthFormProps, AuthSection, type AuthSectionProps, Badge, type BadgeProps, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, ConfirmDialog, type ConfirmDialogProps, type ConfirmOptions, ContactSection, ContextMenu, type ContextMenuDef, type ContextMenuProps, CountUp, type CountUpProps, CtaSection, type CtaSectionProps, DevBanner, type DevBannerProps, Dock, type DockItem, type DockProps, EmptyState, type EmptyStateProps, ErrorPage, type ErrorPageProps, FadeIn, type FadeInProps, FaqSection, type FaqSectionProps, FeatureCard, type FeatureCardProps, FeaturesSection, type FeaturesSectionProps, Footer, type FooterProps, FullPageSpinner, GlassCard, type GlassCardProps, HeroSection, type HeroSectionProps, type Hotkey, ImageCard, type ImageCardProps, Input, type InputProps, LogoStrip, type LogoStripProps, MdxContent, type MdxContentProps, Navbar, type NavbarProps, NewsletterSection, OlwibaUIProvider, type OlwibaUIProviderProps, Overlay, type OverlayProps, type OverlayVariant, PageHeader, type PageHeaderBackButton, type PageHeaderBreadcrumb, type PageHeaderProps, PageTransition, type PageTransitionProps, PhoneFrame, type PhoneFrameProps, PostCard, type PostCardProps, PostList, type PostListProps, PricingCard, type PricingCardProps, type PricingFeature, type PricingPlan, PricingSection, type PricingSectionProps, RegisterHotkeys, RootErrorFallback, SectionTitle, type SectionTitleProps, Spotlight, type SpotlightGroup, type SpotlightItem, type SpotlightProps, StaggerChildren, type StaggerChildrenProps, StatCard, type StatCardProps, StatsSection, type StatsSectionProps, Suspensed, Switch, type SwitchProps, TeamSection, TestimonialCard, type TestimonialCardProps, TestimonialsSection, type TestimonialsSectionProps, Textarea, type TextareaProps, ThemeColorUpdater, ThemeSwitchMinimal, type UIMode, Underlay, type UnderlayProps, type UnderlayVariant, type UpgradeComparisonRow, UpgradePrompt, type UpgradePromptProps, type UseConfirmReturn, type UseControlledOpenReturn, type UsePaginationReturn, VersionBanner, cn, useConfirm, useControlledOpen, useCopyToClipboard, useDebounce, useIntersectionObserver, useLocalStorage, useMediaQuery, useMounted, useOlwibaUI, usePagination, useScrolledPast, useUIMode };
+export { type AppNavItem, AppScreen, AppShell, type AppShellAction, type AppShellBrand, type AppShellProps, type AppShellRenderLink, type AppShellUser, type AuthFormProps, AuthSection, type AuthSectionProps, Badge, type BadgeProps, Button, type ButtonProps, Card, type CardProps, ChangelogCard, type ChangelogCardProps, ChangelogList, type ChangelogListProps, Checkbox, type CheckboxProps, ConfirmDialog, type ConfirmDialogProps, type ConfirmOptions, type ContactInfoItem, ContactSection, type ContactSectionProps, ContextMenu, type ContextMenuDef, type ContextMenuProps, CountUp, type CountUpProps, CtaSection, type CtaSectionProps, DevBanner, type DevBannerProps, Dock, type DockItem, type DockProps, EmptyState, type EmptyStateProps, ErrorPage, type ErrorPageProps, FadeIn, type FadeInProps, FaqSection, type FaqSectionProps, FeatureCard, type FeatureCardProps, FeaturesSection, type FeaturesSectionProps, Footer, type FooterProps, FullPageSpinner, GlassCard, type GlassCardProps, HeroSection, type HeroSectionProps, type Hotkey, ImageCard, type ImageCardProps, Input, type InputProps, LogoStrip, type LogoStripProps, MdxContent, type MdxContentProps, Navbar, type NavbarProps, NewsletterSection, type NewsletterSectionProps, OlwibaUIProvider, type OlwibaUIProviderProps, Overlay, type OverlayProps, type OverlayVariant, PageHeader, type PageHeaderBackButton, type PageHeaderBreadcrumb, type PageHeaderProps, PageTransition, type PageTransitionProps, PhoneFrame, type PhoneFrameProps, PostCard, type PostCardProps, PostList, type PostListProps, PricingCard, type PricingCardProps, type PricingFeature, type PricingPlan, PricingSection, type PricingSectionProps, RegisterHotkeys, RootErrorFallback, SectionTitle, type SectionTitleProps, Spotlight, type SpotlightGroup, type SpotlightItem, type SpotlightProps, StaggerChildren, type StaggerChildrenProps, StatCard, type StatCardProps, StatsSection, type StatsSectionProps, Suspensed, Switch, type SwitchProps, TeamSection, TestimonialCard, type TestimonialCardProps, TestimonialsSection, type TestimonialsSectionProps, Textarea, type TextareaProps, ThemeColorUpdater, ThemeSwitchMinimal, type UIMode, Underlay, type UnderlayProps, type UnderlayVariant, type UpgradeComparisonRow, UpgradePrompt, type UpgradePromptProps, type UseConfirmReturn, type UseControlledOpenReturn, type UsePaginationReturn, VersionBanner, cn, useConfirm, useControlledOpen, useCopyToClipboard, useDebounce, useIntersectionObserver, useLocalStorage, useMediaQuery, useMounted, useOlwibaUI, usePagination, useScrolledPast, useUIMode };

package/dist/index.js

@@ -1200,31 +1200,54 @@ function StatsSection({
     ] })
   ] }) });
 }
-function NewsletterSection() {
+var defaults = {
+  badge: "Newsletter",
+  title: "Stay in the loop",
+  description: "New components, release notes, and product tips \u2014 straight to your inbox. No spam, unsubscribe any time.",
+  placeholder: "you@company.com",
+  submitLabel: "Subscribe",
+  privacyHref: "#",
+  privacyLabel: "Privacy Policy",
+  successTitle: "You're on the list.",
+  successDescription: "We'll be in touch soon."
+};
+function NewsletterSection({
+  badge = defaults.badge,
+  title = defaults.title,
+  description = defaults.description,
+  placeholder = defaults.placeholder,
+  submitLabel = defaults.submitLabel,
+  privacyHref = defaults.privacyHref,
+  privacyLabel = defaults.privacyLabel,
+  successTitle = defaults.successTitle,
+  successDescription = defaults.successDescription,
+  onSubscribe
+} = {}) {
   const [email, setEmail] = React25.useState("");
   const [submitted, setSubmitted] = React25.useState(false);
-  function handleSubmit(e) {
+  async function handleSubmit(e) {
     e.preventDefault();
     if (!email) return;
+    await onSubscribe?.(email);
     setSubmitted(true);
   }
   return /* @__PURE__ */ jsx("section", { className: "overflow-hidden rounded-2xl border bg-card", children: /* @__PURE__ */ jsxs("div", { className: "relative px-6 py-14 sm:px-10 sm:py-20", children: [
     /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-[radial-gradient(ellipse_at_top_right,hsl(var(--primary)/0.1),transparent_60%)]" }),
     /* @__PURE__ */ jsxs("div", { className: "relative mx-auto max-w-xl text-center", children: [
       /* @__PURE__ */ jsx("div", { className: "mb-4 inline-flex h-10 w-10 items-center justify-center rounded-2xl bg-primary/10 text-primary", children: /* @__PURE__ */ jsx(Mail, { className: "size-5" }) }),
-      /* @__PURE__ */ jsx(Badge$1, { variant: "secondary", className: "mb-3", children: "Newsletter" }),
-      /* @__PURE__ */ jsx("h2", { className: "text-balance text-3xl font-semibold tracking-tight sm:text-4xl", children: "Stay in the loop" }),
-      /* @__PURE__ */ jsx("p", { className: "mx-auto mt-4 max-w-sm text-pretty text-muted-foreground", children: "New components, release notes, and product tips \u2014 straight to your inbox. No spam, unsubscribe any time." }),
+      /* @__PURE__ */ jsx(Badge$1, { variant: "secondary", className: "mb-3", children: badge }),
+      /* @__PURE__ */ jsx("h2", { className: "text-balance text-3xl font-semibold tracking-tight sm:text-4xl", children: title }),
+      /* @__PURE__ */ jsx("p", { className: "mx-auto mt-4 max-w-sm text-pretty text-muted-foreground", children: description }),
       submitted ? /* @__PURE__ */ jsxs("div", { className: "mt-8 rounded-2xl border bg-muted/50 px-6 py-5 text-sm", children: [
-        /* @__PURE__ */ jsx("span", { className: "font-medium", children: "You're on the list." }),
+        /* @__PURE__ */ jsx("span", { className: "font-medium", children: successTitle }),
         " ",
-        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "We'll be in touch soon." })
+        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: successDescription })
       ] }) : /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "mt-8 flex flex-col gap-3 sm:flex-row", children: [
         /* @__PURE__ */ jsx(
           Input$1,
           {
             type: "email",
-            placeholder: "you@company.com",
+            placeholder,
             value: email,
             onChange: (e) => setEmail(e.target.value),
             required: true,
@@ -1232,28 +1255,46 @@ function NewsletterSection() {
           }
         ),
         /* @__PURE__ */ jsxs(Button$1, { type: "submit", children: [
-          "Subscribe",
+          submitLabel,
           /* @__PURE__ */ jsx(ArrowRight, { className: "ml-2 size-4" })
         ] })
       ] }),
       /* @__PURE__ */ jsxs("p", { className: "mt-4 text-xs text-muted-foreground", children: [
         "By subscribing you agree to our",
         " ",
-        /* @__PURE__ */ jsx("a", { href: "#", className: "underline underline-offset-4 hover:text-foreground", children: "Privacy Policy" }),
+        /* @__PURE__ */ jsx("a", { href: privacyHref, className: "underline underline-offset-4 hover:text-foreground", children: privacyLabel }),
         "."
       ] })
     ] })
   ] }) });
 }
-var contactInfo = [
-  { Icon: Mail, label: "Email", value: "hello@olwiba.com" },
-  { Icon: Phone, label: "Phone", value: "+1 (555) 000-0000" },
-  { Icon: MapPin, label: "Office", value: "San Francisco, CA" }
+var defaultContactInfoResolved = [
+  { icon: Mail, label: "Email", value: "hello@olwiba.com" },
+  { icon: Phone, label: "Phone", value: "+1 (555) 000-0000" },
+  { icon: MapPin, label: "Office", value: "San Francisco, CA" }
 ];
-function ContactSection() {
+var defaults2 = {
+  badge: "Contact us",
+  title: "Let's talk",
+  description: "Have a question or want to work together? Fill in the form and we'll get back to you within one business day.",
+  successTitle: "Message sent",
+  successDescription: "Thanks for reaching out. We'll get back to you within one business day.",
+  sendAnotherLabel: "Send another"
+};
+function ContactSection({
+  badge = defaults2.badge,
+  title = defaults2.title,
+  description = defaults2.description,
+  contactInfo = defaultContactInfoResolved,
+  successTitle = defaults2.successTitle,
+  successDescription = defaults2.successDescription,
+  sendAnotherLabel = defaults2.sendAnotherLabel,
+  onSubmit
+} = {}) {
   const [submitted, setSubmitted] = React25.useState(false);
-  function handleSubmit(e) {
+  async function handleSubmit(e) {
     e.preventDefault();
+    await onSubmit?.(e);
     setSubmitted(true);
   }
   return /* @__PURE__ */ jsx("section", { className: "overflow-hidden rounded-2xl border bg-card", children: /* @__PURE__ */ jsxs("div", { className: "grid lg:grid-cols-[1fr_1.4fr]", children: [
@@ -1261,12 +1302,19 @@ function ContactSection() {
       /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_top_right,hsl(var(--primary-foreground)/0.1),transparent_60%)]" }),
       /* @__PURE__ */ jsxs("div", { className: "relative space-y-6", children: [
         /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Badge$1, { variant: "secondary", className: "mb-3 bg-primary-foreground/15 text-primary-foreground hover:bg-primary-foreground/20", children: "Contact us" }),
-          /* @__PURE__ */ jsx("h2", { className: "text-2xl font-semibold", children: "Let's talk" }),
-          /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-primary-foreground/70", children: "Have a question or want to work together? Fill in the form and we'll get back to you within one business day." })
+          /* @__PURE__ */ jsx(
+            Badge$1,
+            {
+              variant: "secondary",
+              className: "mb-3 bg-primary-foreground/15 text-primary-foreground hover:bg-primary-foreground/20",
+              children: badge
+            }
+          ),
+          /* @__PURE__ */ jsx("h2", { className: "text-2xl font-semibold", children: title }),
+          /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-primary-foreground/70", children: description })
         ] }),
         /* @__PURE__ */ jsx(Separator, { className: "bg-primary-foreground/20" }),
-        /* @__PURE__ */ jsx("div", { className: "space-y-4", children: contactInfo.map(({ Icon, label, value }) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsx("div", { className: "space-y-4", children: contactInfo.map(({ icon: Icon = Mail, label, value }) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
           /* @__PURE__ */ jsx("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary-foreground/10", children: /* @__PURE__ */ jsx(Icon, { className: "size-4" }) }),
           /* @__PURE__ */ jsxs("div", { children: [
             /* @__PURE__ */ jsx("div", { className: "text-xs text-primary-foreground/60", children: label }),
@@ -1278,10 +1326,10 @@ function ContactSection() {
     /* @__PURE__ */ jsx("div", { className: "p-8", children: submitted ? /* @__PURE__ */ jsxs("div", { className: "flex h-full min-h-[320px] flex-col items-center justify-center gap-4 text-center", children: [
       /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-2xl bg-primary/10 text-primary", children: /* @__PURE__ */ jsx(MessageSquare, { className: "size-6" }) }),
       /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("h3", { className: "font-semibold", children: "Message sent" }),
-        /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: "Thanks for reaching out. We'll get back to you within one business day." })
+        /* @__PURE__ */ jsx("h3", { className: "font-semibold", children: successTitle }),
+        /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: successDescription })
       ] }),
-      /* @__PURE__ */ jsx(Button$1, { variant: "outline", onClick: () => setSubmitted(false), children: "Send another" })
+      /* @__PURE__ */ jsx(Button$1, { variant: "outline", onClick: () => setSubmitted(false), children: sendAnotherLabel })
     ] }) : /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-5", children: [
       /* @__PURE__ */ jsxs("div", { className: "grid gap-4 sm:grid-cols-2", children: [
         /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
@@ -2116,6 +2164,59 @@ function PostList({ posts, renderLink, emptyMessage = "No posts published yet."
   }
   return /* @__PURE__ */ jsx("div", { className: "grid gap-8 sm:grid-cols-2", children: posts.map((post) => /* @__PURE__ */ jsx(PostCard, { ...post, renderLink }, post.slug)) });
 }
+function formatDate2(dateStr) {
+  return new Date(dateStr).toLocaleDateString("en-US", {
+    year: "numeric",
+    month: "long",
+    day: "numeric"
+  });
+}
+function ChangelogCard({
+  title,
+  summary,
+  date,
+  slug,
+  version,
+  hrefPrefix = "/changelog",
+  renderLink
+}) {
+  const href = `${hrefPrefix}/${slug}`;
+  const LinkWrapper = ({
+    children,
+    className
+  }) => renderLink ? renderLink({ href, children, className }) : /* @__PURE__ */ jsx("a", { href, className, children });
+  return /* @__PURE__ */ jsxs("article", { className: "group flex flex-col gap-3 border-b border-border/60 pb-8 last:border-0 last:pb-0", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2 text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ jsx("time", { dateTime: date, children: formatDate2(date) }),
+      version && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("span", { children: "\xB7" }),
+        /* @__PURE__ */ jsx(Badge$1, { variant: "secondary", className: "font-mono text-xs", children: version })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold leading-snug tracking-tight", children: /* @__PURE__ */ jsx(LinkWrapper, { className: "transition-colors hover:text-primary", children: title }) }),
+    /* @__PURE__ */ jsx("p", { className: cn$1("line-clamp-3 text-sm text-muted-foreground"), children: summary }),
+    /* @__PURE__ */ jsx(LinkWrapper, { className: "text-sm font-medium text-primary hover:underline", children: "Read release notes \u2192" })
+  ] });
+}
+function ChangelogList({
+  entries,
+  renderLink,
+  emptyMessage = "No changelog entries yet.",
+  hrefPrefix
+}) {
+  if (entries.length === 0) {
+    return /* @__PURE__ */ jsx("p", { className: "text-sm italic text-muted-foreground", children: emptyMessage });
+  }
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-8", children: entries.map((entry) => /* @__PURE__ */ jsx(
+    ChangelogCard,
+    {
+      ...entry,
+      hrefPrefix,
+      renderLink
+    },
+    entry.slug
+  )) });
+}
 var components = {
   h1: ({ className, ...props }) => /* @__PURE__ */ jsx("h1", { className: cn("mt-8 scroll-m-20 text-3xl font-bold tracking-tight text-foreground first:mt-0", className), ...props }),
   h2: ({ className, ...props }) => /* @__PURE__ */ jsx("h2", { className: cn("mt-10 scroll-m-20 text-2xl font-semibold tracking-tight text-foreground first:mt-0", className), ...props }),
@@ -2274,6 +2375,6 @@ function usePagination(total, pageSize) {
   return { page, pageSize, totalPages, offset, hasPrev: page > 1, hasNext: page < totalPages, goTo, next, prev };
 }
 
-export { AppScreen, AppShell, AuthSection, Badge, Button, Card, Checkbox, ConfirmDialog, ContactSection, ContextMenu, CountUp, CtaSection, DevBanner, Dock, EmptyState, ErrorPage, FadeIn, FaqSection, FeatureCard, FeaturesSection, Footer, FullPageSpinner, GlassCard, HeroSection, ImageCard, Input, LogoStrip, MdxContent, Navbar, NewsletterSection, OlwibaUIProvider, Overlay, PageHeader, PageTransition, PhoneFrame, PostCard, PostList, PricingCard, PricingSection, RegisterHotkeys, RootErrorFallback, SectionTitle, Spotlight, StaggerChildren, StatCard, StatsSection, Suspensed, Switch, TeamSection, TestimonialCard, TestimonialsSection, Textarea, ThemeColorUpdater, ThemeSwitchMinimal, Underlay, UpgradePrompt, VersionBanner, cn, useConfirm, useControlledOpen, useCopyToClipboard, useDebounce, useIntersectionObserver, useLocalStorage, useMediaQuery, useMounted, useOlwibaUI, usePagination, useScrolledPast, useUIMode };
+export { AppScreen, AppShell, AuthSection, Badge, Button, Card, ChangelogCard, ChangelogList, Checkbox, ConfirmDialog, ContactSection, ContextMenu, CountUp, CtaSection, DevBanner, Dock, EmptyState, ErrorPage, FadeIn, FaqSection, FeatureCard, FeaturesSection, Footer, FullPageSpinner, GlassCard, HeroSection, ImageCard, Input, LogoStrip, MdxContent, Navbar, NewsletterSection, OlwibaUIProvider, Overlay, PageHeader, PageTransition, PhoneFrame, PostCard, PostList, PricingCard, PricingSection, RegisterHotkeys, RootErrorFallback, SectionTitle, Spotlight, StaggerChildren, StatCard, StatsSection, Suspensed, Switch, TeamSection, TestimonialCard, TestimonialsSection, Textarea, ThemeColorUpdater, ThemeSwitchMinimal, Underlay, UpgradePrompt, VersionBanner, cn, useConfirm, useControlledOpen, useCopyToClipboard, useDebounce, useIntersectionObserver, useLocalStorage, useMediaQuery, useMounted, useOlwibaUI, usePagination, useScrolledPast, useUIMode };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map