@olwiba/ui 0.1.15 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -317,7 +317,7 @@ interface SettingsSectionProps {
317
317
  description?: string;
318
318
  /** Form fields, buttons, or any content for the right-hand column — e.g. a `<form>`. */
319
319
  children: React.ReactNode;
320
- /** Styles the content column for a destructive action (e.g. "Delete account"). @default false */
320
+ /** Marks the section as a destructive action (e.g. "Delete account") — renders the title in the destructive color. @default false */
321
321
  danger?: boolean;
322
322
  className?: string;
323
323
  }
@@ -531,8 +531,10 @@ interface FeaturesSectionProps {
531
531
  description: string;
532
532
  href?: string;
533
533
  }>;
534
+ /** How the feature cards are arranged. @default 'grid' */
535
+ layout?: 'grid' | 'carousel';
534
536
  }
535
- declare function FeaturesSection({ title, description, badge, features, }: FeaturesSectionProps): react_jsx_runtime.JSX.Element;
537
+ declare function FeaturesSection({ title, description, badge, features, layout, }: FeaturesSectionProps): react_jsx_runtime.JSX.Element;
536
538
 
537
539
  interface GroupedFeatureGroup {
538
540
  label: string;
@@ -578,23 +580,6 @@ interface TechStackSectionProps {
578
580
  }
579
581
  declare function TechStackSection({ badge, title, description, items, }: TechStackSectionProps): react_jsx_runtime.JSX.Element;
580
582
 
581
- interface CarouselSectionProps {
582
- title?: string;
583
- description?: string;
584
- badge?: string;
585
- features: Array<{
586
- icon: LucideIcon;
587
- title: string;
588
- description: string;
589
- href?: string;
590
- }>;
591
- }
592
- /**
593
- * Horizontally scrolling card carousel for feature-style content.
594
- * Scroll-snap based with prev/next controls — no carousel dependency.
595
- */
596
- declare function CarouselSection({ title, description, badge, features, }: CarouselSectionProps): react_jsx_runtime.JSX.Element;
597
-
598
583
  interface FeatureMarqueeItem {
599
584
  icon: LucideIcon;
600
585
  title: string;
@@ -615,7 +600,7 @@ declare function FeatureMarqueeSection({ badge, title, description, rows, speed,
615
600
 
616
601
  interface CtaSectionProps {
617
602
  heading: string;
618
- description: string;
603
+ description?: string;
619
604
  primaryCta: {
620
605
  label: string;
621
606
  href: string;
@@ -625,22 +610,18 @@ interface CtaSectionProps {
625
610
  href: string;
626
611
  };
627
612
  footnote?: string;
628
- renderLink?: AppShellRenderLink;
629
- }
630
- declare function CtaSection({ heading, description, primaryCta, secondaryCta, footnote, renderLink, }: CtaSectionProps): react_jsx_runtime.JSX.Element;
631
-
632
- interface CtaCardSectionProps {
633
- heading: string;
634
- description?: string;
635
- primaryCta: {
636
- label: string;
637
- href: string;
638
- };
639
- footnote?: string;
613
+ /**
614
+ * Visual treatment of the section.
615
+ * - `'default'` badge icon, radial glow, primary + secondary CTAs
616
+ * - `'showcase'` — large watermark icon with a scroll-reveal, single pill CTA
617
+ * @default 'default'
618
+ */
619
+ variant?: 'default' | 'showcase';
620
+ /** (showcase) Watermark icon rendered behind the content. @default <Rocket /> */
640
621
  icon?: React.ReactNode;
641
622
  renderLink?: AppShellRenderLink;
642
623
  }
643
- declare function CtaCardSection({ heading, description, primaryCta, footnote, icon, renderLink, }: CtaCardSectionProps): react_jsx_runtime.JSX.Element;
624
+ declare function CtaSection(props: CtaSectionProps): react_jsx_runtime.JSX.Element;
644
625
 
645
626
  interface PricingFeature {
646
627
  label: string;
@@ -976,6 +957,24 @@ interface PageTransitionProps extends React.HTMLAttributes<HTMLDivElement> {
976
957
  }
977
958
  declare function PageTransition({ variant, duration, children, className, style, ...props }: PageTransitionProps): react_jsx_runtime.JSX.Element;
978
959
 
960
+ interface CarouselProps {
961
+ /** Items to scroll through — each child becomes one snap slide. */
962
+ children: React.ReactNode;
963
+ /** Width classes applied to each slide. @default 'w-[280px] sm:w-[320px]' */
964
+ itemClassName?: string;
965
+ /** Prev/next control placement. @default 'top-right' */
966
+ controls?: 'top-right' | 'none';
967
+ /** Accessible label for the scroll region. */
968
+ ariaLabel?: string;
969
+ className?: string;
970
+ }
971
+ /**
972
+ * Scroll-snap carousel behavior — wraps any children in a horizontally
973
+ * scrolling track with prev/next controls. A mechanic, not a section:
974
+ * feed it cards, images, or whole blocks. No carousel dependency.
975
+ */
976
+ declare function Carousel({ children, itemClassName, controls, ariaLabel, className, }: CarouselProps): react_jsx_runtime.JSX.Element;
977
+
979
978
  interface SpotlightItem {
980
979
  id: string;
981
980
  label: string;
@@ -1166,7 +1165,7 @@ interface NotifyAction {
1166
1165
  onClick: () => void;
1167
1166
  }
1168
1167
  interface NotificationToastProps {
1169
- variant?: 'success' | 'info' | 'message';
1168
+ variant?: 'success' | 'info' | 'warning' | 'error' | 'message';
1170
1169
  title: string;
1171
1170
  description?: string;
1172
1171
  /** Avatar image — overrides the variant icon (e.g. for a message-from-a-person toast). */
@@ -1190,6 +1189,65 @@ interface NotifyOptions extends Omit<NotificationToastProps, 'onDismiss'> {
1190
1189
  /** Fires a `NotificationToast` through sonner. Requires `<Toaster />` from `@olwiba/cn` mounted once in your app. */
1191
1190
  declare function notify(options: NotifyOptions): string | number;
1192
1191
 
1192
+ interface NotificationItem {
1193
+ id: string;
1194
+ title: string;
1195
+ description?: string;
1196
+ /** Pre-formatted timestamp, e.g. "2h ago" or "Yesterday". */
1197
+ timestamp?: string;
1198
+ read?: boolean;
1199
+ /** Avatar image — takes precedence over `icon`. */
1200
+ avatar?: string;
1201
+ icon?: React.ReactNode;
1202
+ }
1203
+ interface NotificationsPopoverProps {
1204
+ notifications: NotificationItem[];
1205
+ onNotificationClick?: (notification: NotificationItem) => void;
1206
+ /** Shows a "Mark all read" action in the header when there are unread items. */
1207
+ onMarkAllRead?: () => void;
1208
+ title?: string;
1209
+ emptyMessage?: string;
1210
+ /** Popover alignment relative to the bell button. @default 'end' */
1211
+ align?: 'start' | 'center' | 'end';
1212
+ /** Controlled open state — omit to let the component manage it internally. */
1213
+ open?: boolean;
1214
+ onOpenChange?: (open: boolean) => void;
1215
+ className?: string;
1216
+ }
1217
+ /**
1218
+ * Bell button + persistent notification inbox. Complements `notify()` toasts:
1219
+ * a toast announces an event as it happens, this popover holds the history.
1220
+ * Presentation-only — pass `notifications` from your own data layer and
1221
+ * persist read state via `onMarkAllRead`/`onNotificationClick`.
1222
+ */
1223
+ declare function NotificationsPopover({ notifications, onNotificationClick, onMarkAllRead, title, emptyMessage, align, open, onOpenChange, className, }: NotificationsPopoverProps): react_jsx_runtime.JSX.Element;
1224
+
1225
+ interface ActivityFeedItem {
1226
+ id: string;
1227
+ /** Main line — pass rich nodes for emphasis, e.g. <><b>Ana</b> deployed to production</>. */
1228
+ title: React.ReactNode;
1229
+ description?: string;
1230
+ /** Pre-formatted timestamp, e.g. "2h ago" or "Mar 4". */
1231
+ timestamp?: string;
1232
+ /** Avatar image — takes precedence over `icon`. */
1233
+ avatar?: string;
1234
+ /** Fallback initials when `avatar` is set but fails to load. */
1235
+ initials?: string;
1236
+ /** Icon node rendered in the timeline marker when there is no avatar. */
1237
+ icon?: React.ReactNode;
1238
+ }
1239
+ interface ActivityFeedProps {
1240
+ items: ActivityFeedItem[];
1241
+ emptyMessage?: string;
1242
+ className?: string;
1243
+ }
1244
+ /**
1245
+ * Vertical activity timeline — avatar or icon markers connected by a rail,
1246
+ * one row per event. Presentation-only: pass pre-formatted timestamps and
1247
+ * rich `title` nodes from your own data layer.
1248
+ */
1249
+ declare function ActivityFeed({ items, emptyMessage, className, }: ActivityFeedProps): react_jsx_runtime.JSX.Element;
1250
+
1193
1251
  declare const sizes: {
1194
1252
  readonly sm: {
1195
1253
  readonly outer: "w-44";
@@ -1556,4 +1614,4 @@ interface UsePaginationReturn {
1556
1614
  }
1557
1615
  declare function usePagination(total: number, pageSize: number): UsePaginationReturn;
1558
1616
 
1559
- 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, type BillingInvoice, BillingPanel, type BillingPanelProps, type BillingPaymentMethod, type BillingUsageMetric, BrandColorSwitchMinimal, Button, type ButtonProps, Card, type CardProps, CarouselSection, type CarouselSectionProps, 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, CtaCardSection, type CtaCardSectionProps, 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, NotificationToast, type NotificationToastProps, 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 };
1617
+ 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 };