@olwiba/ui 0.1.14 → 0.2.0

package/dist/index.d.ts

@@ -5,6 +5,8 @@ import React__default, { ReactNode } from 'react';
 import { ButtonProps as ButtonProps$1, CardProps as CardProps$1, BadgeProps as BadgeProps$1, InputProps as InputProps$1, TextareaProps as TextareaProps$1, CheckboxProps as CheckboxProps$1, SwitchProps as SwitchProps$1 } from '@olwiba/cn';
 export { CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Enchanted, EnchantedProps } from '@olwiba/cn';
 import { LucideIcon } from 'lucide-react';
+import { ColumnDef } from '@tanstack/react-table';
+export { ColumnDef as DataTableColumn } from '@tanstack/react-table';
 export { MdxContent, MdxContentProps } from './mdx/index.js';
 
 declare function cn(...inputs: ClassValue[]): string;
@@ -260,19 +262,34 @@ interface AppShellProps {
 declare function AppShell({ brand, navItems, action, user, pageTitle, headerStart, headerEnd, renderLink, collapsible, sidebarPosition, side, children, }?: AppShellProps): react_jsx_runtime.JSX.Element;
 
 interface AuthFormProps {
-    /** Controls form title, fields, and footer text. @default 'signin' */
-    mode?: 'signin' | 'signup';
+    /**
+     * Controls form title, fields, and footer text.
+     * - `'signin'` / `'signup'` — email + password
+     * - `'forgot-password'` — email only, sends a reset link
+     * - `'reset-password'` — new password + confirmation
+     * - `'verify'` — one-time code entry (email verification or 2FA)
+     * @default 'signin'
+     */
+    mode?: 'signin' | 'signup' | 'forgot-password' | 'reset-password' | 'verify';
     onSubmit?: (e: React.FormEvent<HTMLFormElement>) => void;
     onSso?: () => void;
     /** (signin) Link to the sign-up page */
     signUpHref?: string;
-    /** (signup) Link back to the sign-in page */
+    /** (signup / forgot-password / reset-password / verify) Link back to the sign-in page */
     signInHref?: string;
     forgotPasswordHref?: string;
+    /** (verify) Re-sends the one-time code */
+    onResend?: () => void;
+    /** (verify) Address the code was sent to, shown in the description */
+    destination?: string;
+    /** (verify) Number of digits in the code. @default 6 */
+    codeLength?: number;
     /** Brand node — in centered layout renders above the card; in split layout renders inside the card */
     brand?: React.ReactNode;
     /** Error message displayed below the form fields */
     error?: string;
+    /** Positive confirmation message displayed below the form fields (e.g. "Reset link sent") */
+    success?: string;
     /** Disables the submit button and shows a loading label */
     loading?: boolean;
     /** Render prop for links — use to inject framework-native link components (e.g. TanStack Router Link) */
@@ -295,6 +312,108 @@ interface AuthSectionProps extends AuthFormProps {
 }
 declare function AuthSection({ layout, children, panel, className, ...formProps }: AuthSectionProps): react_jsx_runtime.JSX.Element;
 
+interface SettingsSectionProps {
+    title: string;
+    description?: string;
+    /** Form fields, buttons, or any content for the right-hand column — e.g. a `<form>`. */
+    children: React.ReactNode;
+    /** Marks the section as a destructive action (e.g. "Delete account") — renders the title in the destructive color. @default false */
+    danger?: boolean;
+    className?: string;
+}
+/**
+ * One title+description+content row for a settings page. Stack a few inside
+ * a `<div className="divide-y divide-border">` to build a full settings
+ * page — one block reused per row, rather than a bespoke layout each time.
+ */
+declare function SettingsSection({ title, description, children, danger, className }: SettingsSectionProps): react_jsx_runtime.JSX.Element;
+
+interface TeamMemberRecord {
+    id: string;
+    name: string;
+    email: string;
+    avatar?: string;
+    role: string;
+}
+interface TeamMembersPanelProps {
+    members: TeamMemberRecord[];
+    /** Roles offered in the invite dialog and the per-row role menu. @default ['Owner', 'Admin', 'Member'] */
+    roles?: string[];
+    onInvite?: (email: string, role: string) => void;
+    onRoleChange?: (memberId: string, role: string) => void;
+    onRemove?: (memberId: string) => void;
+    title?: string;
+    description?: string;
+}
+/**
+ * Member list with role management and an invite dialog. One block for
+ * team/org administration — built on `DataTable` rather than a bespoke list.
+ */
+declare function TeamMembersPanel({ members, roles, onInvite, onRoleChange, onRemove, title, description, }: TeamMembersPanelProps): react_jsx_runtime.JSX.Element;
+
+interface BillingUsageMetric {
+    label: string;
+    used: number;
+    limit: number;
+    unit?: string;
+}
+interface BillingInvoice {
+    id: string;
+    date: string;
+    amount: string;
+    status: 'paid' | 'open' | 'void';
+    downloadUrl?: string;
+}
+interface BillingPaymentMethod {
+    brand: string;
+    last4: string;
+    expiry: string;
+}
+interface BillingPanelProps {
+    planName: string;
+    planPrice?: string;
+    renewalDate?: string;
+    usage?: BillingUsageMetric[];
+    paymentMethod?: BillingPaymentMethod;
+    invoices?: BillingInvoice[];
+    onManagePlan?: () => void;
+    onUpdatePaymentMethod?: () => void;
+    className?: string;
+}
+/**
+ * In-app billing summary — current plan + usage, payment method, invoice
+ * history. Built from `SettingsSection` rows and `DataTable`, rather than a
+ * one-off billing page each time. Marketing plan comparisons stay in
+ * `PricingSection`/`UpgradePrompt` — this is the account-side view.
+ */
+declare function BillingPanel({ planName, planPrice, renewalDate, usage, paymentMethod, invoices, onManagePlan, onUpdatePaymentMethod, className, }: BillingPanelProps): react_jsx_runtime.JSX.Element;
+
+interface OnboardingStep {
+    id: string;
+    title: string;
+    description?: string;
+    content: React.ReactNode;
+    /** Runs before advancing past this step. Return `false`/an error string to block. */
+    onNext?: () => boolean | string | Promise<boolean | string>;
+}
+interface OnboardingWizardProps {
+    steps: OnboardingStep[];
+    /** Called after the last step's `onNext` succeeds. */
+    onComplete?: () => void;
+    onStepChange?: (index: number) => void;
+    /** Controlled current step index — omit to let the component manage it internally. */
+    step?: number;
+    onStepIndexChange?: (index: number) => void;
+    completeLabel?: string;
+    className?: string;
+}
+/**
+ * Stateful multi-step onboarding flow. One component driven by a `steps`
+ * prop — swap the array to reshape the flow rather than hand-building a
+ * new wizard per feature.
+ */
+declare function OnboardingWizard({ steps, onComplete, onStepChange, step: stepProp, onStepIndexChange, completeLabel, className, }: OnboardingWizardProps): react_jsx_runtime.JSX.Element;
+
 interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement> {
     icon?: LucideIcon;
     title: string;
@@ -412,8 +531,10 @@ interface FeaturesSectionProps {
         description: string;
         href?: string;
     }>;
+    /** How the feature cards are arranged. @default 'grid' */
+    layout?: 'grid' | 'carousel';
 }
-declare function FeaturesSection({ title, description, badge, features, }: FeaturesSectionProps): react_jsx_runtime.JSX.Element;
+declare function FeaturesSection({ title, description, badge, features, layout, }: FeaturesSectionProps): react_jsx_runtime.JSX.Element;
 
 interface GroupedFeatureGroup {
     label: string;
@@ -459,23 +580,6 @@ interface TechStackSectionProps {
 }
 declare function TechStackSection({ badge, title, description, items, }: TechStackSectionProps): react_jsx_runtime.JSX.Element;
 
-interface CarouselSectionProps {
-    title?: string;
-    description?: string;
-    badge?: string;
-    features: Array<{
-        icon: LucideIcon;
-        title: string;
-        description: string;
-        href?: string;
-    }>;
-}
-/**
- * Horizontally scrolling card carousel for feature-style content.
- * Scroll-snap based with prev/next controls — no carousel dependency.
- */
-declare function CarouselSection({ title, description, badge, features, }: CarouselSectionProps): react_jsx_runtime.JSX.Element;
-
 interface FeatureMarqueeItem {
     icon: LucideIcon;
     title: string;
@@ -496,7 +600,7 @@ declare function FeatureMarqueeSection({ badge, title, description, rows, speed,
 
 interface CtaSectionProps {
     heading: string;
-    description: string;
+    description?: string;
     primaryCta: {
         label: string;
         href: string;
@@ -506,22 +610,18 @@ interface CtaSectionProps {
         href: string;
     };
     footnote?: string;
-    renderLink?: AppShellRenderLink;
-}
-declare function CtaSection({ heading, description, primaryCta, secondaryCta, footnote, renderLink, }: CtaSectionProps): react_jsx_runtime.JSX.Element;
-
-interface CtaCardSectionProps {
-    heading: string;
-    description?: string;
-    primaryCta: {
-        label: string;
-        href: string;
-    };
-    footnote?: string;
+    /**
+     * Visual treatment of the section.
+     * - `'default'` — badge icon, radial glow, primary + secondary CTAs
+     * - `'showcase'` — large watermark icon with a scroll-reveal, single pill CTA
+     * @default 'default'
+     */
+    variant?: 'default' | 'showcase';
+    /** (showcase) Watermark icon rendered behind the content. @default <Rocket /> */
     icon?: React.ReactNode;
     renderLink?: AppShellRenderLink;
 }
-declare function CtaCardSection({ heading, description, primaryCta, footnote, icon, renderLink, }: CtaCardSectionProps): react_jsx_runtime.JSX.Element;
+declare function CtaSection(props: CtaSectionProps): react_jsx_runtime.JSX.Element;
 
 interface PricingFeature {
     label: string;
@@ -857,6 +957,24 @@ interface PageTransitionProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 declare function PageTransition({ variant, duration, children, className, style, ...props }: PageTransitionProps): react_jsx_runtime.JSX.Element;
 
+interface CarouselProps {
+    /** Items to scroll through — each child becomes one snap slide. */
+    children: React.ReactNode;
+    /** Width classes applied to each slide. @default 'w-[280px] sm:w-[320px]' */
+    itemClassName?: string;
+    /** Prev/next control placement. @default 'top-right' */
+    controls?: 'top-right' | 'none';
+    /** Accessible label for the scroll region. */
+    ariaLabel?: string;
+    className?: string;
+}
+/**
+ * Scroll-snap carousel behavior — wraps any children in a horizontally
+ * scrolling track with prev/next controls. A mechanic, not a section:
+ * feed it cards, images, or whole blocks. No carousel dependency.
+ */
+declare function Carousel({ children, itemClassName, controls, ariaLabel, className, }: CarouselProps): react_jsx_runtime.JSX.Element;
+
 interface SpotlightItem {
     id: string;
     label: string;
@@ -956,6 +1074,180 @@ interface ConfirmDialogProps extends Pick<UseConfirmReturn, 'isOpen' | 'options'
 }
 declare function ConfirmDialog({ isOpen, options, handleConfirm, handleCancel, destructive }: ConfirmDialogProps): react_jsx_runtime.JSX.Element;
 
+interface CommandMenuItem {
+    id: string;
+    label: string;
+    icon?: LucideIcon;
+    shortcut?: string;
+    keywords?: string[];
+    onSelect: () => void;
+}
+interface CommandMenuGroup {
+    heading: string;
+    items: CommandMenuItem[];
+}
+interface CommandMenuProps {
+    groups: CommandMenuGroup[];
+    placeholder?: string;
+    emptyMessage?: string;
+    /** Controlled open state — omit to let the component manage it internally. */
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Registers Cmd+K (mac) / Ctrl+K (win) to toggle the palette. @default true */
+    hotkey?: boolean;
+}
+/**
+ * Global search / Cmd+K command palette. One component — pass different
+ * `groups` per surface rather than building a bespoke dialog each time.
+ */
+declare function CommandMenu({ groups, placeholder, emptyMessage, open: openProp, onOpenChange, hotkey, }: CommandMenuProps): react_jsx_runtime.JSX.Element;
+
+interface DataTableProps<TData> {
+    columns: ColumnDef<TData>[];
+    data: TData[];
+    /** Shows a quick-filter input above the table, matching against `searchKey`. */
+    searchKey?: string;
+    searchPlaceholder?: string;
+    /** Adds a checkbox column and reports the selected rows. */
+    selectable?: boolean;
+    onSelectionChange?: (rows: TData[]) => void;
+    /** Rows per page. Set to `0` to disable pagination entirely. @default 10 */
+    pageSize?: number;
+    /** Slot rendered top-right of the toolbar — e.g. an "Add" button. */
+    toolbar?: React.ReactNode;
+    onRowClick?: (row: TData) => void;
+    emptyMessage?: string;
+    className?: string;
+}
+/**
+ * Sortable, paginated, optionally-selectable data table. One component —
+ * toggle `searchKey`/`selectable`/`pageSize` rather than reaching for a
+ * different table component per use case.
+ */
+declare function DataTable<TData>({ columns, data, searchKey, searchPlaceholder, selectable, onSelectionChange, pageSize, toolbar, onRowClick, emptyMessage, className, }: DataTableProps<TData>): react_jsx_runtime.JSX.Element;
+
+interface FileUploadEntry {
+    id: string;
+    file: File;
+    /** 0–100. Omit while pending, or when not tracking progress. */
+    progress?: number;
+    status?: 'pending' | 'uploading' | 'done' | 'error';
+    error?: string;
+}
+interface FileUploadProps {
+    /** Comma-separated MIME types / extensions, e.g. `"image/png,image/jpeg"`. */
+    accept?: string;
+    multiple?: boolean;
+    maxSizeMb?: number;
+    maxFiles?: number;
+    /** Controlled file list — pass this (with `onFilesChange`) to drive upload progress from your own network layer. */
+    files?: FileUploadEntry[];
+    /** Uncontrolled default list. */
+    defaultFiles?: FileUploadEntry[];
+    onFilesChange?: (files: FileUploadEntry[]) => void;
+    /** Fired with the raw, already-validated `File` objects a user just added. */
+    onFilesAdded?: (files: File[]) => void;
+    disabled?: boolean;
+    /** Helper text under the drop zone, e.g. "PNG or JPG, up to 5MB". */
+    hint?: string;
+    className?: string;
+}
+/**
+ * Drag-and-drop file picker with a validated queue list. One component —
+ * toggle `multiple`/`accept`/`maxSizeMb`/`maxFiles` rather than reaching for
+ * a separate dropzone per use case. Progress/status is presentation-only;
+ * wire `files`/`onFilesChange` to your own upload layer to drive it.
+ */
+declare function FileUpload({ accept, multiple, maxSizeMb, maxFiles, files: filesProp, defaultFiles, onFilesChange, onFilesAdded, disabled, hint, className, }: FileUploadProps): react_jsx_runtime.JSX.Element;
+
+interface NotifyAction {
+    label: string;
+    onClick: () => void;
+}
+interface NotificationToastProps {
+    variant?: 'success' | 'info' | 'warning' | 'error' | 'message';
+    title: string;
+    description?: string;
+    /** Avatar image — overrides the variant icon (e.g. for a message-from-a-person toast). */
+    avatar?: string;
+    /** Primary action, right-aligned next to the description (e.g. "Undo"). */
+    action?: NotifyAction;
+    /** Secondary action, rendered after the primary one (e.g. "Decline"). */
+    secondaryAction?: NotifyAction;
+    onDismiss?: () => void;
+}
+/**
+ * Rich toast content — rendered via `notify()` inside sonner's `toast.custom`.
+ * One component: `variant` swaps the default icon, `avatar`/`action`/
+ * `secondaryAction` add the pieces a given toast needs, rather than a
+ * separate toast component per shape.
+ */
+declare function NotificationToast({ variant, title, description, avatar, action, secondaryAction, onDismiss, }: NotificationToastProps): react_jsx_runtime.JSX.Element;
+interface NotifyOptions extends Omit<NotificationToastProps, 'onDismiss'> {
+    duration?: number;
+}
+/** Fires a `NotificationToast` through sonner. Requires `<Toaster />` from `@olwiba/cn` mounted once in your app. */
+declare function notify(options: NotifyOptions): string | number;
+
+interface NotificationItem {
+    id: string;
+    title: string;
+    description?: string;
+    /** Pre-formatted timestamp, e.g. "2h ago" or "Yesterday". */
+    timestamp?: string;
+    read?: boolean;
+    /** Avatar image — takes precedence over `icon`. */
+    avatar?: string;
+    icon?: React.ReactNode;
+}
+interface NotificationsPopoverProps {
+    notifications: NotificationItem[];
+    onNotificationClick?: (notification: NotificationItem) => void;
+    /** Shows a "Mark all read" action in the header when there are unread items. */
+    onMarkAllRead?: () => void;
+    title?: string;
+    emptyMessage?: string;
+    /** Popover alignment relative to the bell button. @default 'end' */
+    align?: 'start' | 'center' | 'end';
+    /** Controlled open state — omit to let the component manage it internally. */
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    className?: string;
+}
+/**
+ * Bell button + persistent notification inbox. Complements `notify()` toasts:
+ * a toast announces an event as it happens, this popover holds the history.
+ * Presentation-only — pass `notifications` from your own data layer and
+ * persist read state via `onMarkAllRead`/`onNotificationClick`.
+ */
+declare function NotificationsPopover({ notifications, onNotificationClick, onMarkAllRead, title, emptyMessage, align, open, onOpenChange, className, }: NotificationsPopoverProps): react_jsx_runtime.JSX.Element;
+
+interface ActivityFeedItem {
+    id: string;
+    /** Main line — pass rich nodes for emphasis, e.g. <><b>Ana</b> deployed to production</>. */
+    title: React.ReactNode;
+    description?: string;
+    /** Pre-formatted timestamp, e.g. "2h ago" or "Mar 4". */
+    timestamp?: string;
+    /** Avatar image — takes precedence over `icon`. */
+    avatar?: string;
+    /** Fallback initials when `avatar` is set but fails to load. */
+    initials?: string;
+    /** Icon node rendered in the timeline marker when there is no avatar. */
+    icon?: React.ReactNode;
+}
+interface ActivityFeedProps {
+    items: ActivityFeedItem[];
+    emptyMessage?: string;
+    className?: string;
+}
+/**
+ * Vertical activity timeline — avatar or icon markers connected by a rail,
+ * one row per event. Presentation-only: pass pre-formatted timestamps and
+ * rich `title` nodes from your own data layer.
+ */
+declare function ActivityFeed({ items, emptyMessage, className, }: ActivityFeedProps): react_jsx_runtime.JSX.Element;
+
 declare const sizes: {
     readonly sm: {
         readonly outer: "w-44";
@@ -1322,4 +1614,4 @@ interface UsePaginationReturn {
 }
 declare function usePagination(total: number, pageSize: number): UsePaginationReturn;
 
-export { AnimatedPill, type AnimatedPillProps, AppContent, type AppContentProps, AppGrid, AppGridCell, type AppGridCellProps, type AppGridProps, type AppNavItem, AppScreen, AppShell, type AppShellAction, type AppShellBrand, type AppShellProps, type AppShellRenderLink, type AppShellUser, type AuthFormProps, AuthSection, type AuthSectionProps, Badge, type BadgeProps, BrandColorSwitchMinimal, Button, type ButtonProps, Card, type CardProps, CarouselSection, type CarouselSectionProps, ChangelogCard, type ChangelogCardProps, type ChangelogHighlight, ChangelogList, type ChangelogListProps, type ChangelogReleaseType, Checkbox, type CheckboxProps, type ComparisonColumn, ComparisonSection, type ComparisonSectionProps, ConfirmDialog, type ConfirmDialogProps, type ConfirmOptions, type ContactInfoItem, ContactSection, type ContactSectionProps, ContextMenu, type ContextMenuDef, type ContextMenuProps, CountUp, type CountUpProps, CountdownTimer, type CountdownTimerProps, CtaCardSection, type CtaCardSectionProps, 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, type FeatureMarqueeItem, type FeatureMarqueeRow, FeatureMarqueeSection, type FeatureMarqueeSectionProps, FeaturesSection, type FeaturesSectionProps, FlowBracket, type FlowBracketProps, FlowConnector, type FlowConnectorProps, Footer, type FooterProps, FullPageSpinner, GlassCard, type GlassCardProps, Grid, GridItem, type GridItemProps, type GridProps, type GroupedFeatureGroup, GroupedFeaturesSection, type GroupedFeaturesSectionProps, HeroSection, type HeroSectionProps, type Hotkey, ImageCard, type ImageCardProps, Input, type InputProps, LogoStrip, type LogoStripProps, type MarketingSectionSpacing, ModeSwitchMinimal, 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, type PostAuthor, PostCard, type PostCardProps, PostList, type PostListProps, PricingCard, type PricingCardProps, type PricingFeature, type PricingPlan, PricingSection, type PricingSectionProps, PublicPageFrame, type PublicPageFrameProps, type QualificationColumn, QualificationSection, type QualificationSectionProps, RegisterHotkeys, RootErrorFallback, Section, type SectionProps, SectionTitle, type SectionTitleProps, Spotlight, type SpotlightGroup, type SpotlightItem, type SpotlightProps, Stack, type StackProps, StaggerChildren, type StaggerChildrenProps, StatCard, type StatCardProps, StatsSection, type StatsSectionProps, type StepItem, StepsSection, type StepsSectionProps, Suspensed, Switch, type SwitchProps, type TeamMember, TeamSection, type TeamSectionProps, type TechStackItem, TechStackSection, type TechStackSectionProps, 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, marketingSectionSpacing, useConfirm, useControlledOpen, useCopyToClipboard, useDebounce, useIntersectionObserver, useLocalStorage, useMediaQuery, useMounted, useOlwibaUI, usePagination, useScrolledPast, useUIMode };
+export { ActivityFeed, type ActivityFeedItem, type ActivityFeedProps, AnimatedPill, type AnimatedPillProps, AppContent, type AppContentProps, AppGrid, AppGridCell, type AppGridCellProps, type AppGridProps, type AppNavItem, AppScreen, AppShell, type AppShellAction, type AppShellBrand, type AppShellProps, type AppShellRenderLink, type AppShellUser, type AuthFormProps, AuthSection, type AuthSectionProps, Badge, type BadgeProps, type BillingInvoice, BillingPanel, type BillingPanelProps, type BillingPaymentMethod, type BillingUsageMetric, BrandColorSwitchMinimal, Button, type ButtonProps, Card, type CardProps, Carousel, type CarouselProps, ChangelogCard, type ChangelogCardProps, type ChangelogHighlight, ChangelogList, type ChangelogListProps, type ChangelogReleaseType, Checkbox, type CheckboxProps, CommandMenu, type CommandMenuGroup, type CommandMenuItem, type CommandMenuProps, type ComparisonColumn, ComparisonSection, type ComparisonSectionProps, ConfirmDialog, type ConfirmDialogProps, type ConfirmOptions, type ContactInfoItem, ContactSection, type ContactSectionProps, ContextMenu, type ContextMenuDef, type ContextMenuProps, CountUp, type CountUpProps, CountdownTimer, type CountdownTimerProps, CtaSection, type CtaSectionProps, DataTable, type DataTableProps, DevBanner, type DevBannerProps, Dock, type DockItem, type DockProps, EmptyState, type EmptyStateProps, ErrorPage, type ErrorPageProps, FadeIn, type FadeInProps, FaqSection, type FaqSectionProps, FeatureCard, type FeatureCardProps, type FeatureMarqueeItem, type FeatureMarqueeRow, FeatureMarqueeSection, type FeatureMarqueeSectionProps, FeaturesSection, type FeaturesSectionProps, FileUpload, type FileUploadEntry, type FileUploadProps, FlowBracket, type FlowBracketProps, FlowConnector, type FlowConnectorProps, Footer, type FooterProps, FullPageSpinner, GlassCard, type GlassCardProps, Grid, GridItem, type GridItemProps, type GridProps, type GroupedFeatureGroup, GroupedFeaturesSection, type GroupedFeaturesSectionProps, HeroSection, type HeroSectionProps, type Hotkey, ImageCard, type ImageCardProps, Input, type InputProps, LogoStrip, type LogoStripProps, type MarketingSectionSpacing, ModeSwitchMinimal, Navbar, type NavbarProps, NewsletterSection, type NewsletterSectionProps, type NotificationItem, NotificationToast, type NotificationToastProps, NotificationsPopover, type NotificationsPopoverProps, type NotifyAction, type NotifyOptions, OlwibaUIProvider, type OlwibaUIProviderProps, type OnboardingStep, OnboardingWizard, type OnboardingWizardProps, Overlay, type OverlayProps, type OverlayVariant, PageHeader, type PageHeaderBackButton, type PageHeaderBreadcrumb, type PageHeaderProps, PageTransition, type PageTransitionProps, PhoneFrame, type PhoneFrameProps, type PostAuthor, PostCard, type PostCardProps, PostList, type PostListProps, PricingCard, type PricingCardProps, type PricingFeature, type PricingPlan, PricingSection, type PricingSectionProps, PublicPageFrame, type PublicPageFrameProps, type QualificationColumn, QualificationSection, type QualificationSectionProps, RegisterHotkeys, RootErrorFallback, Section, type SectionProps, SectionTitle, type SectionTitleProps, SettingsSection, type SettingsSectionProps, Spotlight, type SpotlightGroup, type SpotlightItem, type SpotlightProps, Stack, type StackProps, StaggerChildren, type StaggerChildrenProps, StatCard, type StatCardProps, StatsSection, type StatsSectionProps, type StepItem, StepsSection, type StepsSectionProps, Suspensed, Switch, type SwitchProps, type TeamMember, type TeamMemberRecord, TeamMembersPanel, type TeamMembersPanelProps, TeamSection, type TeamSectionProps, type TechStackItem, TechStackSection, type TechStackSectionProps, 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, marketingSectionSpacing, notify, useConfirm, useControlledOpen, useCopyToClipboard, useDebounce, useIntersectionObserver, useLocalStorage, useMediaQuery, useMounted, useOlwibaUI, usePagination, useScrolledPast, useUIMode };