@momo-webplatform/mobase-next 1.0.1 → 1.0.3

package/dist/index.d.mts

@@ -1,137 +1,1717 @@
-export { Button, ButtonProps, buttonVariants } from './components/mobase/button.mjs';
-export { CloseButton, CloseButtonProps, CloseButtonSize } from './components/mobase/close-button.mjs';
-export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants } from './components/mobase/button-group.mjs';
-export { Input, InputControl, InputControlProps, InputProps, InputSize } from './components/mobase/input.mjs';
-export { SearchInput, SearchInputProps } from './components/mobase/input-search.mjs';
-export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea } from './components/mobase/input-group.mjs';
-export { Spinner, SpinnerProps } from './components/mobase/spinner.mjs';
-export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './components/mobase/tooltip.mjs';
-export { Kbd, KbdGroup } from './components/mobase/kbd.mjs';
-export { Tabs, TabsContent, TabsList, TabsTrigger, tabsListVariants } from './components/mobase/tabs.mjs';
-export { HorizontalContent, HorizontalNext, HorizontalPrevious, HorizontalScroll, HorizontalScrollProps } from './components/mobase/horizontal-scroll.mjs';
-export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPositioner, NavigationMenuTrigger, navigationMenuTriggerStyle } from './components/mobase/navigation-menu.mjs';
-export { HeaderNavigation } from './components/blocks/header-navigation/header-navigation.mjs';
-export { Footer } from './components/blocks/footer/footer.mjs';
-export { FooterContent } from './components/blocks/footer/footer-content.mjs';
-export { footerAppDownloads, footerCertificationBadge, footerDefaultPrimaryMenu, footerDefaultSecondaryMenu, footerHelpGuideUrl, footerLogoSrc, footerMoMoText, footerQrDownloadImage, footerSocialItems, footerSupportAddress } from './components/blocks/footer/defaults.mjs';
-export { FooterAppDownloadItem, FooterData, FooterItem, FooterProps, FooterSocialItem } from './components/blocks/footer/types.mjs';
-export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from './components/mobase/table.mjs';
-export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle } from './components/mobase/field.mjs';
-export { Label } from './components/mobase/label.mjs';
-export { Separator } from './components/mobase/separator.mjs';
-export { Badge, BadgeProps, BadgeSize, badgeVariants } from './components/mobase/badge.mjs';
-export { Skeleton } from './components/mobase/skeleton.mjs';
-export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './components/mobase/card.mjs';
-export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from './components/mobase/dropdown-menu.mjs';
-export { Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger } from './components/mobase/popover.mjs';
-export { Select, SelectContent, SelectContentProps, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectTriggerProps, SelectTriggerSize, SelectValue } from './components/mobase/select.mjs';
-export { ScrollArea, ScrollBar } from './components/mobase/scroll-area.mjs';
-export { NativeSelect, NativeSelectOptGroup, NativeSelectOption } from './components/mobase/native-select.mjs';
-export { AnchoredToastProvider, ToastPosition, ToastProvider, ToastProviderProps, anchoredToastManager, toastManager } from './components/mobase/toast.mjs';
-export { Textarea, TextareaProps } from './components/mobase/textarea.mjs';
-export { Logo, LogoProps } from './components/mobase/logo.mjs';
-export { Checkbox, CheckboxProps } from './components/mobase/checkbox.mjs';
-export { Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, useComboboxAnchor } from './components/mobase/combobox.mjs';
-export { Command, CommandCollection, CommandCreateHandle, CommandDialog, CommandDialogBackdrop, CommandDialogPopup, CommandDialogPortal, CommandDialogTrigger, CommandDialogViewport, CommandEmpty, CommandFooter, CommandGroup, CommandGroupLabel, CommandInput, CommandItem, CommandList, CommandPanel, CommandSeparator, CommandShortcut } from './components/mobase/command.mjs';
-export { RadioGroup, RadioGroupItem, RadioGroupItemProps, RadioGroupProps } from './components/mobase/radio-group.mjs';
-export { Switch } from './components/mobase/switch.mjs';
-export { Slider } from './components/mobase/slider.mjs';
-export { Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue } from './components/mobase/progress.mjs';
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from './components/mobase/accordion.mjs';
-export { Alert, AlertAction, AlertDescription, AlertTitle } from './components/mobase/alert.mjs';
-export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger } from './components/mobase/alert-dialog.mjs';
-export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyProps, EmptyTitle, emptyVariants } from './components/mobase/empty.mjs';
-export { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle } from './components/mobase/item.mjs';
-export { Hitbox } from './components/mobase/hitbox.mjs';
-export { Form } from './components/mobase/form.mjs';
-export { AspectRatio } from './components/mobase/aspect-ratio.mjs';
-export { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage } from './components/mobase/avatar.mjs';
-export { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from './components/mobase/breadcrumb.mjs';
-export { Carousel, CarouselApi, CarouselContent, CarouselDots, CarouselItem, CarouselNext, CarouselPrevious, useCarousel } from './components/mobase/carousel.mjs';
-export { Dialog, DialogOverlay as DialogBackdrop, DialogClose, DialogContent, DialogCreateHandle, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPanel, DialogContent as DialogPopup, DialogPopupSize, DialogPortal, DialogTitle, DialogTrigger, DialogViewport, DialogViewportPlacement } from './components/mobase/dialog.mjs';
-export { Drawer, DrawerBackdrop, DrawerBar, DrawerClose, DrawerContent, DrawerCreateHandle, DrawerDescription, DrawerFooter, DrawerHeader, DrawerPanel, DrawerPopup, DrawerPortal, DrawerSwipeArea, DrawerTitle, DrawerTrigger, DrawerViewport } from './components/mobase/drawer.mjs';
-export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious } from './components/mobase/pagination.mjs';
-export { Calendar, CalendarDayButton } from './components/mobase/calendar.mjs';
-export { DatePicker, DatePickerPreset, DatePickerProps, DatePickerSize, DateRangePicker, DateRangePickerProps } from './components/mobase/date-picker.mjs';
-export { Autocomplete, AutocompleteClear, AutocompleteCollection, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteInput, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue, useAutocompleteFilter } from './components/mobase/autocomplete.mjs';
-export { PerType, PresetType, TextEffect, TextEffectProps } from './components/mobase/text-effect.mjs';
-export { SlidingNumber } from './components/mobase/sliding-number.mjs';
-export { Marquee, MarqueeContent, MarqueeContentProps, MarqueeFade, MarqueeFadeProps, MarqueeItem, MarqueeItemProps, MarqueeProps } from './components/mobase/marquee.mjs';
-export { default as LogosCarousel, LogosCarouselProps } from './components/mobase/logos-carousel.mjs';
-export { HeroSection } from './components/blocks/HeroSection/HeroSection.mjs';
-export { HeroContentProps } from './components/blocks/HeroSection/utils.mjs';
-export { GiftListSection } from './components/blocks/GiftListSection/GiftListSection.mjs';
-export { GiftListItemData, GiftListSectionProps } from './components/blocks/GiftListSection/utils.mjs';
-export { FeatureSection } from './components/blocks/FeatureSection/FeatureSection.mjs';
-export { FeatureSectionProps } from './components/blocks/FeatureSection/utils.mjs';
-export { MetricsSection } from './components/blocks/MetricsSection/MetricsSection.mjs';
-export { MetricsSectionProps } from './components/blocks/MetricsSection/utils.mjs';
-export { CTASection } from './components/blocks/CTASection/CTASection.mjs';
-export { CTABlockData, CTAMedia, CTASectionProps } from './components/blocks/CTASection/utils.mjs';
-export { HowItWorksSection } from './components/blocks/HowItWorksSection/HowItWorksSection.mjs';
-export { HowItWorksData, HowItWorksSectionProps } from './components/blocks/HowItWorksSection/utils.mjs';
-export { BlogSection } from './components/blocks/BlogSection/BlogSection.mjs';
-export { BlogItemProps, BlogSectionProps, DataBlogProps } from './components/blocks/BlogSection/utils.mjs';
-export { NewsSection } from './components/blocks/NewsSection/NewsSection.mjs';
-export { DataHorizontalScrollProps, DataNewsProps, NewsItemProps, NewsSectionProps } from './components/blocks/NewsSection/utils.mjs';
-export { FAQSection } from './components/blocks/FAQSection/FAQSection.mjs';
-export { ContentsProps, DataFAQProps, FAQSectionProps } from './components/blocks/FAQSection/utils.mjs';
-export { SocialProofSection } from './components/blocks/SocialProofSection/SocialProofSection.mjs';
-export { BrandData, SocialProofSectionProps } from './components/blocks/SocialProofSection/utils.mjs';
-export { TestimonialSection } from './components/blocks/TestimonialSection/TestimonialSection.mjs';
-export { TestimonialData, TestimonialSectionProps, getColorForIndex, getInitials, randomColors } from './components/blocks/TestimonialSection/utils.mjs';
-export { InfiniteSlider, InfiniteSliderProps } from './components/mobase/infinite-slider.mjs';
-export { TESTIMONIAL_AVATAR_FALLBACK_BACKGROUNDS, getInitialsFromName, getTestimonialAvatarColorClass } from './lib/testimonial-avatar.mjs';
-export { plainTextFromHtml } from './lib/plain-text-from-html.mjs';
-export { useClickOutside } from './hooks/use-click-outside.mjs';
-export { useIsMobile } from './hooks/use-mobile.mjs';
-export { useCopyToClipboard } from './hooks/use-copy-to-clipboard.mjs';
-export { useIsMomoApp } from './hooks/use-is-momo-app.mjs';
-export { default as useLocalStorage } from './hooks/use-local-storage.mjs';
-export { useIsClient } from './hooks/use-is-client.mjs';
-export { useIsTouchDevice } from './hooks/use-is-touch-device.mjs';
-export { default as useWindowSize } from './hooks/use-window-size.mjs';
-export { cn } from './lib/utils.mjs';
-export { scrollToSelector } from './lib/scroll-to-selector.mjs';
-export { convertMediaRatio } from './lib/media-ratio.mjs';
-export { BuildQrCodeImageUrlOptions, buildQrCodeImageUrl } from './lib/qr-image-url.mjs';
-export { LegacyMobaseButtonVariantName, MobaseButtonVariant, mapLegacyMobaseButtonVariant } from './lib/legacy-button-variant.mjs';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { Button as Button$1 } from '@base-ui/react/button';
+import { VariantProps } from 'class-variance-authority';
+import * as React$1 from 'react';
+import React__default, { ReactNode, ComponentProps, Ref, HTMLAttributes, ReactElement, RefObject, Dispatch, SetStateAction } from 'react';
+import { useRender } from '@base-ui/react/use-render';
+import { Separator as Separator$1 } from '@base-ui/react/separator';
+import { Tooltip as Tooltip$1 } from '@base-ui/react/tooltip';
+import { Tabs as Tabs$1 } from '@base-ui/react/tabs';
+import { NavigationMenu as NavigationMenu$1 } from '@base-ui/react/navigation-menu';
+import { Field as Field$1 } from '@base-ui/react/field';
+import { Menu } from '@base-ui/react/menu';
+import { Popover as Popover$1 } from '@base-ui/react/popover';
+import { Select as Select$1 } from '@base-ui/react/select';
+import { ScrollArea as ScrollArea$1 } from '@base-ui/react/scroll-area';
 export { ScrollArea as ScrollAreaPrimitive } from '@base-ui/react/scroll-area';
+import { Toast } from '@base-ui/react/toast';
 export { Toast as ToastPrimitive } from '@base-ui/react/toast';
+import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
+import { Combobox as Combobox$1 } from '@base-ui/react';
+import { Dialog as Dialog$1 } from '@base-ui/react/dialog';
 export { Dialog as CommandDialogPrimitive, Dialog as DialogPrimitive } from '@base-ui/react/dialog';
+import { Autocomplete as Autocomplete$1 } from '@base-ui/react/autocomplete';
+export { Autocomplete as AutocompletePrimitive } from '@base-ui/react/autocomplete';
+import { Radio } from '@base-ui/react/radio';
+import { RadioGroup as RadioGroup$1 } from '@base-ui/react/radio-group';
+import { Switch as Switch$1 } from '@base-ui/react/switch';
+import { Slider as Slider$1 } from '@base-ui/react/slider';
+import { NumberField as NumberField$1 } from '@base-ui/react/number-field';
+import { OTPFieldPreview } from '@base-ui/react/otp-field';
+import { Progress as Progress$1 } from '@base-ui/react/progress';
+import { Accordion as Accordion$1 } from '@base-ui/react/accordion';
+import { AlertDialog as AlertDialog$1 } from '@base-ui/react/alert-dialog';
+import { Form as Form$1 } from '@base-ui/react/form';
 export { Form as FormPrimitive } from '@base-ui/react/form';
+import { Avatar as Avatar$1 } from '@base-ui/react/avatar';
+import useEmblaCarousel, { UseEmblaCarouselType } from 'embla-carousel-react';
+import { Drawer as Drawer$1 } from '@base-ui/react/drawer';
 export { Drawer as DrawerPrimitive } from '@base-ui/react/drawer';
-export { Autocomplete as AutocompletePrimitive } from '@base-ui/react/autocomplete';
-import 'react/jsx-runtime';
-import 'class-variance-authority/types';
-import '@base-ui/react/button';
-import 'class-variance-authority';
-import 'react';
-import '@base-ui/react/use-render';
-import '@base-ui/react/tooltip';
-import '@base-ui/react/tabs';
-import '@base-ui/react/navigation-menu';
-import './components/blocks/header-navigation/types.mjs';
-import '@base-ui/react/field';
-import '@base-ui/react/separator';
-import '@base-ui/react/menu';
-import '@base-ui/react/popover';
-import '@base-ui/react/select';
-import '@base-ui/react/checkbox';
-import '@base-ui/react';
-import '@base-ui/react/radio';
-import '@base-ui/react/radio-group';
-import '@base-ui/react/switch';
-import '@base-ui/react/slider';
-import '@base-ui/react/progress';
-import '@base-ui/react/accordion';
-import '@base-ui/react/alert-dialog';
-import '@base-ui/react/avatar';
-import 'embla-carousel-react';
-import 'react-day-picker';
-import 'motion/react';
-import 'react-fast-marquee';
-import './components/blocks/common-blocks/utils.mjs';
-import './components/blocks/action-button/utils.mjs';
-import './components/blocks/dialog-qr/DialogQr.mjs';
-import 'clsx';
+import { DayPicker, DayButton, Locale, DateRange } from 'react-day-picker';
+import { Variants, Transition } from 'motion/react';
+import { MarqueeProps as MarqueeProps$1 } from 'react-fast-marquee';
+import { ClassValue } from 'clsx';
+
+type ButtonShape = "rounded" | "square";
+declare const buttonVariants: (props?: ({
+    variant?: "link" | "default" | "outline" | "secondary" | "tertiary" | "ghost" | "destructive" | null | undefined;
+    size?: "xs" | "sm" | "default" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type ButtonProps = Omit<Button$1.Props, "prefix" | "suffix"> & VariantProps<typeof buttonVariants> & {
+    loading?: boolean;
+    shape?: ButtonShape;
+    /** Renders before children (e.g. icon). Use for leading icon: `<Button prefix={<ArrowLeft />}>Upload</Button>` */
+    prefix?: ReactNode;
+    /** Renders after children (e.g. icon). Use for trailing icon. */
+    suffix?: ReactNode;
+    /** Umami tracking button event */
+    dataUmamiEvent?: string;
+    /** Umami tracking button event text (button label) */
+    dataUmamiEventText?: string;
+};
+declare function Button({ loading, prefix, suffix, variant, size, shape, className, children, disabled, dataUmamiEvent, dataUmamiEventText, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
+
+type CloseButtonSize = "xs" | "sm" | "default" | "lg";
+type CloseButtonProps = Omit<ComponentProps<typeof Button>, "variant" | "size"> & {
+    /** Hit target / icon scale; maps to icon button sizes in the design system. */
+    size?: CloseButtonSize;
+    /** Replaces the default X icon. */
+    children?: ReactNode;
+};
+declare function CloseButton({ className, size, children, "aria-label": ariaLabel, type, ...props }: CloseButtonProps): react_jsx_runtime.JSX.Element;
+
+declare function Separator({ className, orientation, ...props }: Separator$1.Props): react_jsx_runtime.JSX.Element;
+
+declare const buttonGroupVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function ButtonGroup({ className, orientation, ...props }: React.ComponentProps<"div"> & VariantProps<typeof buttonGroupVariants>): react_jsx_runtime.JSX.Element;
+declare function ButtonGroupText({ className, render, ...props }: useRender.ComponentProps<"div">): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
+declare function ButtonGroupSeparator({ className, orientation, ...props }: React.ComponentProps<typeof Separator>): react_jsx_runtime.JSX.Element;
+
+type InputSize$1 = "sm" | "default" | "lg";
+/**
+ * Bare input control (no wrapper / prefix / suffix / clear button).
+ * Dùng trong `Input` và các composite như `InputGroupInput` để giữ cùng style nền.
+ */
+type InputControlProps = Omit<ComponentProps<"input">, "size"> & {
+    size?: InputSize$1;
+};
+declare function InputControl({ size, className, ...props }: InputControlProps): react_jsx_runtime.JSX.Element;
+/** Strip DOM `prefix` / `suffix` so Mobase can use those names for `ReactNode` slots (native typing is string). */
+type InputProps = Omit<ComponentProps<"input">, "size" | "prefix" | "suffix"> & {
+    /** Mobase size (height); distinct from the native input `size` attribute. */
+    size?: InputSize$1;
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    /**
+     * When `true` (default), the prefix gets Mobase addon styling (padding, subtle text, icon size).
+     * When `false`, only the raw node is wrapped so you can fully control appearance.
+     */
+    prefixStyling?: boolean;
+    /**
+     * When `true` (default), the suffix gets Mobase addon styling.
+     * When `false`, only the raw node is wrapped so you can fully control appearance.
+     */
+    suffixStyling?: boolean;
+    /** When `true`, shows a clear control before the suffix (`data-slot="input-clear-button"`). */
+    clearButton?: boolean;
+};
+declare function Input({ size, className, prefix, suffix, prefixStyling, suffixStyling, disabled, clearButton, value: valueProp, defaultValue, onChange, onKeyDown, ...props }: InputProps): react_jsx_runtime.JSX.Element;
+
+type SearchInputProps = ComponentProps<typeof Input>;
+declare function SearchInput({ clearButton, ...props }: SearchInputProps): react_jsx_runtime.JSX.Element;
+
+type InputSize = "sm" | "default" | "lg";
+declare function InputGroup({ className, size, ...props }: React$1.ComponentProps<"div"> & {
+    size?: InputSize;
+}): react_jsx_runtime.JSX.Element;
+declare const inputGroupAddonVariants: (props?: ({
+    align?: "inline-start" | "inline-end" | "block-start" | "block-end" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function InputGroupAddon({ className, align, ...props }: React$1.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>): react_jsx_runtime.JSX.Element;
+declare const inputGroupButtonVariants: (props?: ({
+    size?: "xs" | "sm" | "icon-xs" | "icon-sm" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function InputGroupButton({ className, type, variant, size, ...props }: Omit<React$1.ComponentProps<typeof Button>, "size" | "type"> & VariantProps<typeof inputGroupButtonVariants> & {
+    type?: "button" | "submit" | "reset";
+}): react_jsx_runtime.JSX.Element;
+declare function InputGroupText({ className, ...props }: React$1.ComponentProps<"span">): react_jsx_runtime.JSX.Element;
+declare function InputGroupInput({ className, ...props }: InputControlProps): react_jsx_runtime.JSX.Element;
+declare function InputGroupTextarea({ className, ...props }: React$1.ComponentProps<"textarea">): react_jsx_runtime.JSX.Element;
+
+type SizeVariant = "xs" | "sm" | "default" | "lg" | "xl";
+type SpeedVariant = "slow" | "normal" | "fast";
+interface SpinnerProps extends Omit<React$1.ComponentPropsWithoutRef<"svg">, "display" | "opacity"> {
+    size?: SizeVariant;
+    speed?: SpeedVariant;
+    className?: string;
+}
+declare const Spinner: React$1.ForwardRefExoticComponent<SpinnerProps & React$1.RefAttributes<SVGSVGElement>>;
+
+declare function TooltipProvider({ delay, ...props }: Tooltip$1.Provider.Props): react_jsx_runtime.JSX.Element;
+declare function Tooltip({ ...props }: Tooltip$1.Root.Props): react_jsx_runtime.JSX.Element;
+declare function TooltipTrigger({ ...props }: Tooltip$1.Trigger.Props): react_jsx_runtime.JSX.Element;
+declare function TooltipContent({ className, side, sideOffset, align, alignOffset, children, ...props }: Tooltip$1.Popup.Props & Pick<Tooltip$1.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset">): react_jsx_runtime.JSX.Element;
+
+declare function Kbd({ className, ...props }: React.ComponentProps<"kbd">): react_jsx_runtime.JSX.Element;
+declare function KbdGroup({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
+declare function Tabs({ className, orientation, ...props }: Tabs$1.Root.Props): react_jsx_runtime.JSX.Element;
+declare const tabsListVariants: (props?: ({
+    variant?: "default" | "line" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function TabsList({ className, variant, ...props }: Tabs$1.List.Props & VariantProps<typeof tabsListVariants>): react_jsx_runtime.JSX.Element;
+declare function TabsTrigger({ className, ...props }: Tabs$1.Tab.Props): react_jsx_runtime.JSX.Element;
+declare function TabsContent({ className, ...props }: Tabs$1.Panel.Props): react_jsx_runtime.JSX.Element;
+
+interface HorizontalScrollProps {
+    showGradientOverlay?: boolean;
+    gradientOverlayColor?: string;
+    className?: string;
+    children?: React.ReactNode;
+}
+declare function HorizontalScroll({ showGradientOverlay, gradientOverlayColor, className, children, }: HorizontalScrollProps): react_jsx_runtime.JSX.Element;
+interface HorizontalContentProps {
+    className?: string;
+    children: React.ReactNode;
+}
+declare function HorizontalContent({ className, children }: HorizontalContentProps): react_jsx_runtime.JSX.Element;
+type HorizontalNavProps = React.ComponentProps<typeof Button>;
+declare function HorizontalPrevious({ className, children, size, variant, ...props }: HorizontalNavProps): react_jsx_runtime.JSX.Element | null;
+declare function HorizontalNext({ className, children, size, variant, ...props }: HorizontalNavProps): react_jsx_runtime.JSX.Element | null;
+
+declare function NavigationMenu({ align, className, children, ...props }: NavigationMenu$1.Root.Props & Pick<NavigationMenu$1.Positioner.Props, "align">): react_jsx_runtime.JSX.Element;
+declare function NavigationMenuList({ className, ...props }: React.ComponentPropsWithRef<typeof NavigationMenu$1.List>): react_jsx_runtime.JSX.Element;
+declare function NavigationMenuItem({ className, ...props }: React.ComponentPropsWithRef<typeof NavigationMenu$1.Item>): react_jsx_runtime.JSX.Element;
+declare const navigationMenuTriggerStyle: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+declare function NavigationMenuTrigger({ className, children, ...props }: NavigationMenu$1.Trigger.Props): react_jsx_runtime.JSX.Element;
+declare function NavigationMenuContent({ className, ...props }: NavigationMenu$1.Content.Props): react_jsx_runtime.JSX.Element;
+declare function NavigationMenuPositioner({ className, side, sideOffset, align, alignOffset, ...props }: NavigationMenu$1.Positioner.Props): react_jsx_runtime.JSX.Element;
+declare function NavigationMenuLink({ className, ...props }: NavigationMenu$1.Link.Props): react_jsx_runtime.JSX.Element;
+declare function NavigationMenuIndicator({ className, ...props }: React.ComponentPropsWithRef<typeof NavigationMenu$1.Icon>): react_jsx_runtime.JSX.Element;
+
+interface HeaderNavigationSubItem {
+    id?: number;
+    title: string;
+    icon: string;
+    url: string;
+    description: string;
+    newTab: boolean;
+}
+interface HeaderNavigationItemWithDropdown {
+    id: number;
+    title: string;
+    hasDropdown: true;
+    dropDownCompact: boolean;
+    url?: string | null;
+    subMenu: HeaderNavigationSubItem[];
+}
+interface HeaderNavigationItemLink {
+    id: number;
+    title: string;
+    hasDropdown: false;
+    url: string;
+    newTab: boolean;
+}
+type HeaderNavigationMenuItem = HeaderNavigationItemWithDropdown | HeaderNavigationItemLink;
+interface HeaderNavigationServiceInfo {
+    logo?: string;
+    name?: ReactNode;
+    url: string;
+}
+/** Maps to Base UI positioner `align` (`start` | `end` | `center`). */
+type HeaderNavigationDropdownAlign = "left" | "right" | "center";
+interface HeaderNavigationProps {
+    className?: string;
+    dataMenu: HeaderNavigationMenuItem[];
+    serviceInfo?: HeaderNavigationServiceInfo;
+    /** Extra actions on the right (e.g. CTA). */
+    navigationRight?: ReactNode;
+    /** Show legacy "Tải Ví MoMo" QR download action. */
+    hasDownloadApp?: boolean;
+    isSticky?: boolean;
+    alignDropdown?: HeaderNavigationDropdownAlign;
+    /** Default home logo (MoMo marketing asset in the legacy component). */
+    isLogoVisible?: boolean;
+}
+
+declare function HeaderNavigation({ className, dataMenu, serviceInfo, navigationRight, hasDownloadApp, isSticky, alignDropdown, isLogoVisible, }: HeaderNavigationProps): react_jsx_runtime.JSX.Element;
+
+interface FooterItem {
+    title: string;
+    url: string;
+    icon?: string | null;
+    newTab: boolean;
+}
+interface FooterData {
+    heading: string;
+    lists: FooterItem[];
+}
+interface FooterSocialItem {
+    name: string;
+    image: string;
+    link: string;
+}
+interface FooterAppDownloadItem {
+    name: string;
+    image: string;
+    link: string;
+}
+interface FooterProps {
+    className?: string;
+    primaryMenu?: FooterData;
+    secondaryMenu?: FooterData;
+}
+
+declare function Footer({ className, primaryMenu, secondaryMenu }: FooterProps): react_jsx_runtime.JSX.Element;
+
+declare function FooterContent({ primaryMenu, secondaryMenu, }: Pick<FooterProps, "primaryMenu" | "secondaryMenu">): react_jsx_runtime.JSX.Element;
+
+/** Default primary column — from legacy `FooterItemsDefault`. */
+declare const footerDefaultPrimaryMenu: FooterData;
+/** Default secondary column — from legacy `SERVICES_DEFAULT` (image → icon). */
+declare const footerDefaultSecondaryMenu: FooterData;
+declare const footerSupportAddress = "L\u1EA7u 6, To\u00E0 nh\u00E0 Ph\u00FA M\u1EF9 H\u01B0ng, s\u1ED1 8 Ho\u00E0ng V\u0103n Th\u00E1i, khu ph\u1ED1 1, Ph\u01B0\u1EDDng T\u00E2n Ph\u00FA, Qu\u1EADn 7, Th\u00E0nh ph\u1ED1 H\u1ED3 Ch\u00ED Minh";
+declare const footerMoMoText: {
+    readonly business: {
+        readonly phone: "1900636652";
+        readonly phoneFormat: "1900 636 652 (Phí 1.000đ/phút)";
+        readonly email: "merchant.care@momo.vn";
+    };
+    readonly support: {
+        readonly hotline: "1900545441";
+        readonly hotlineFormat: "1900 5454 41";
+        readonly phoneExt1: "02873065555";
+        readonly phoneExt1Format: "028.7306.5555";
+        readonly phoneExt2: "02899995555";
+        readonly phoneExt2Format: "028.9999.5555";
+        readonly phoneExt3: "02855555555";
+        readonly phoneExt3Format: "028.5555.5555";
+        readonly email: "hotro@momo.vn";
+    };
+};
+declare const footerSocialItems: FooterSocialItem[];
+declare const footerAppDownloads: FooterAppDownloadItem[];
+declare const footerQrDownloadImage = "https://homepage.momocdn.net/img/momo-upload-api-230627140125-638234712853800898.jpg";
+declare const footerLogoSrc = "https://homepage.momocdn.net/fileuploads/svg/momo-file-240411162904.svg";
+declare const footerCertificationBadge: {
+    readonly href: "http://online.gov.vn/Home/AppDetails/163";
+    readonly imageSrc: "https://homepage.momocdn.net/blogscontents/momo-upload-api-210629153623-637605777831780706.png";
+    readonly width: 119;
+    readonly height: 45;
+};
+declare const footerHelpGuideUrl = "https://www.momo.vn/huong-dan/huong-dan-gui-yeu-cau-ho-tro-bang-tinh-nang-tro-giup";
+
+declare function Table({ className, ...props }: React$1.ComponentProps<"table">): react_jsx_runtime.JSX.Element;
+declare function TableHeader({ className, ...props }: React$1.ComponentProps<"thead">): react_jsx_runtime.JSX.Element;
+declare function TableBody({ className, ...props }: React$1.ComponentProps<"tbody">): react_jsx_runtime.JSX.Element;
+declare function TableFooter({ className, ...props }: React$1.ComponentProps<"tfoot">): react_jsx_runtime.JSX.Element;
+declare function TableRow({ className, ...props }: React$1.ComponentProps<"tr">): react_jsx_runtime.JSX.Element;
+declare function TableHead({ className, ...props }: React$1.ComponentProps<"th">): react_jsx_runtime.JSX.Element;
+declare function TableCell({ className, ...props }: React$1.ComponentProps<"td">): react_jsx_runtime.JSX.Element;
+declare function TableCaption({ className, ...props }: React$1.ComponentProps<"caption">): react_jsx_runtime.JSX.Element;
+
+declare function Label$1({ className, ...props }: ComponentProps<"label">): react_jsx_runtime.JSX.Element;
+declare function FieldSet({ className, ...props }: ComponentProps<"fieldset">): react_jsx_runtime.JSX.Element;
+declare function FieldLegend({ className, variant, ...props }: ComponentProps<"legend"> & {
+    variant?: "legend" | "label";
+}): react_jsx_runtime.JSX.Element;
+declare function FieldGroup({ className, ...props }: ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare const fieldVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | "responsive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function Field({ className, orientation, ...props }: Field$1.Root.Props & VariantProps<typeof fieldVariants>): react_jsx_runtime.JSX.Element;
+declare function FieldContent({ className, ...props }: ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function FieldLabel({ className, ...props }: ComponentProps<typeof Label$1>): react_jsx_runtime.JSX.Element;
+declare function FieldTitle({ className, ...props }: ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function FieldDescription({ className, ...props }: ComponentProps<"p">): react_jsx_runtime.JSX.Element;
+declare function FieldSeparator({ children, className, ...props }: ComponentProps<"div"> & {
+    children?: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function FieldError({ className, children, errors, ...props }: ComponentProps<"div"> & {
+    errors?: ({
+        message?: string;
+    } | undefined)[];
+}): react_jsx_runtime.JSX.Element | null;
+
+declare function Label({ className, ...props }: React$1.ComponentProps<"label">): react_jsx_runtime.JSX.Element;
+
+type BadgeSize = "sm" | "default" | "lg";
+declare const badgeVariants: (props?: ({
+    variant?: "link" | "default" | "outline" | "secondary" | "ghost" | "destructive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type BadgeProps = useRender.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
+    size?: BadgeSize;
+};
+declare function Badge({ className, variant, size, render, ...props }: BadgeProps): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
+
+declare function Skeleton({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
+declare function Card({ className, size, ...props }: React$1.ComponentProps<"div"> & {
+    size?: "default" | "sm";
+}): react_jsx_runtime.JSX.Element;
+declare function CardHeader({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function CardTitle({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function CardDescription({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function CardAction({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function CardContent({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function CardFooter({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
+declare function DropdownMenu({ ...props }: Menu.Root.Props): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuPortal({ ...props }: Menu.Portal.Props): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuTrigger({ ...props }: Menu.Trigger.Props): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuContent({ align, alignOffset, side, sideOffset, className, ...props }: Menu.Popup.Props & Pick<Menu.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset">): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuGroup({ ...props }: Menu.Group.Props): react_jsx_runtime.JSX.Element;
+/** Must be used inside `DropdownMenuGroup` — Base UI `GroupLabel` requires `Menu.Group` context. */
+declare function DropdownMenuLabel({ className, inset, ...props }: Menu.GroupLabel.Props & {
+    inset?: boolean;
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuItem({ className, inset, variant, ...props }: Menu.Item.Props & {
+    inset?: boolean;
+    variant?: "default" | "destructive";
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuSub({ ...props }: Menu.SubmenuRoot.Props): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuSubTrigger({ className, inset, children, ...props }: Menu.SubmenuTrigger.Props & {
+    inset?: boolean;
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuSubContent({ align, alignOffset, side, sideOffset, className, ...props }: ComponentProps<typeof DropdownMenuContent>): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuCheckboxItem({ className, children, checked, inset, ...props }: Menu.CheckboxItem.Props & {
+    inset?: boolean;
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuRadioGroup({ ...props }: Menu.RadioGroup.Props): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuRadioItem({ className, children, inset, ...props }: Menu.RadioItem.Props & {
+    inset?: boolean;
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuSeparator({ className, ...props }: Menu.Separator.Props): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuShortcut({ className, ...props }: ComponentProps<"span">): react_jsx_runtime.JSX.Element;
+
+declare function Popover({ ...props }: Popover$1.Root.Props): react_jsx_runtime.JSX.Element;
+declare function PopoverTrigger({ ...props }: Popover$1.Trigger.Props): react_jsx_runtime.JSX.Element;
+declare function PopoverContent({ className, align, alignOffset, side, sideOffset, collisionAvoidance, ...props }: Popover$1.Popup.Props & Pick<Popover$1.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset" | "collisionAvoidance">): react_jsx_runtime.JSX.Element;
+declare function PopoverHeader({ className, ...props }: ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function PopoverTitle({ className, ...props }: Popover$1.Title.Props): react_jsx_runtime.JSX.Element;
+declare function PopoverDescription({ className, ...props }: Popover$1.Description.Props): react_jsx_runtime.JSX.Element;
+
+type SelectTriggerSize = "sm" | "default" | "lg";
+declare const Select: typeof Select$1.Root;
+declare function SelectGroup({ className, ...props }: Select$1.Group.Props): react_jsx_runtime.JSX.Element;
+declare function SelectValue({ className, ...props }: Select$1.Value.Props): react_jsx_runtime.JSX.Element;
+type SelectTriggerProps = Omit<Select$1.Trigger.Props, "size"> & {
+    size?: SelectTriggerSize;
+};
+declare function SelectTrigger({ className, size, children, ...props }: SelectTriggerProps): react_jsx_runtime.JSX.Element;
+type SelectContentProps = Select$1.Popup.Props & Pick<Select$1.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset" | "alignItemWithTrigger">;
+declare function SelectContent({ className, children, side, sideOffset, align, alignOffset, alignItemWithTrigger, ...props }: SelectContentProps): react_jsx_runtime.JSX.Element;
+declare function SelectLabel({ className, ...props }: Select$1.GroupLabel.Props): react_jsx_runtime.JSX.Element;
+declare function SelectItem({ className, children, ...props }: Select$1.Item.Props): react_jsx_runtime.JSX.Element;
+declare function SelectSeparator({ className, ...props }: Select$1.Separator.Props): react_jsx_runtime.JSX.Element;
+declare function SelectScrollUpButton({ className, ...props }: ComponentProps<typeof Select$1.ScrollUpArrow>): react_jsx_runtime.JSX.Element;
+declare function SelectScrollDownButton({ className, ...props }: ComponentProps<typeof Select$1.ScrollDownArrow>): react_jsx_runtime.JSX.Element;
+
+declare function ScrollArea({ className, children, scrollFade, scrollbarGutter, ...props }: ScrollArea$1.Root.Props & {
+    scrollFade?: boolean;
+    scrollbarGutter?: boolean;
+}): React__default.ReactElement;
+declare function ScrollBar({ className, orientation, ...props }: ScrollArea$1.Scrollbar.Props): React__default.ReactElement;
+
+type NativeSelectProps = Omit<React$1.ComponentProps<"select">, "size"> & {
+    size?: "sm" | "default";
+};
+declare function NativeSelect({ className, size, ...props }: NativeSelectProps): react_jsx_runtime.JSX.Element;
+declare function NativeSelectOption({ ...props }: React$1.ComponentProps<"option">): react_jsx_runtime.JSX.Element;
+declare function NativeSelectOptGroup({ className, ...props }: React$1.ComponentProps<"optgroup">): react_jsx_runtime.JSX.Element;
+
+declare const toastManager: ReturnType<typeof Toast.createToastManager>;
+declare const anchoredToastManager: ReturnType<typeof Toast.createToastManager>;
+type ToastPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
+interface ToastProviderProps extends Toast.Provider.Props {
+    position?: ToastPosition;
+}
+declare function ToastProvider({ children, position, ...props }: ToastProviderProps): React__default.ReactElement;
+declare function AnchoredToastProvider({ children, ...props }: Toast.Provider.Props): React__default.ReactElement;
+
+type TextareaProps = Omit<ComponentProps<"textarea">, "size"> & {
+    size?: InputSize$1;
+};
+declare function Textarea({ size, className, disabled, ...props }: TextareaProps): react_jsx_runtime.JSX.Element;
+
+interface LogoProps extends React$1.SVGProps<SVGSVGElement> {
+    /**
+     * Size preset (height). Use className for custom dimensions.
+     * - `xxsmall` (16px) — smallest
+     * - `xsmall` (20px)
+     * - `small` (24px)
+     * - `medium` (32px) — default, most common
+     * - `large` (40px)
+     * - `xlarge` (48px)
+     */
+    size?: "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge";
+    /**
+     * `default` = full logo (icon + wordmark), `symbol` = wordmark only (MOMO text).
+     */
+    variant?: "default" | "symbol";
+    shape?: "none" | "square" | "circle";
+    /**
+     * `inverse` = swap brand pink and white (e.g. white background, pink icon/text).
+     */
+    appearance?: "default" | "inverse";
+}
+declare const Logo: React$1.ForwardRefExoticComponent<Omit<LogoProps, "ref"> & React$1.RefAttributes<SVGSVGElement>>;
+
+type CheckboxProps = Checkbox$1.Root.Props;
+declare function Checkbox({ className, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
+
+declare const Combobox: typeof Combobox$1.Root;
+declare function ComboboxValue({ ...props }: Combobox$1.Value.Props): react_jsx_runtime.JSX.Element;
+declare function ComboboxTrigger({ className, children, ...props }: Combobox$1.Trigger.Props): react_jsx_runtime.JSX.Element;
+declare function ComboboxInput({ size, className, children, disabled, showTrigger, showClear, ...props }: Omit<Combobox$1.Input.Props, "size"> & {
+    showTrigger?: boolean;
+    showClear?: boolean;
+    size?: InputSize$1;
+}): react_jsx_runtime.JSX.Element;
+declare function ComboboxContent({ className, side, sideOffset, align, alignOffset, anchor, ...props }: Combobox$1.Popup.Props & Pick<Combobox$1.Positioner.Props, "side" | "align" | "sideOffset" | "alignOffset" | "anchor">): react_jsx_runtime.JSX.Element;
+declare function ComboboxList({ className, ...props }: Combobox$1.List.Props): react_jsx_runtime.JSX.Element;
+declare function ComboboxItem({ className, children, ...props }: Combobox$1.Item.Props): react_jsx_runtime.JSX.Element;
+declare function ComboboxGroup({ className, ...props }: Combobox$1.Group.Props): react_jsx_runtime.JSX.Element;
+declare function ComboboxLabel({ className, ...props }: Combobox$1.GroupLabel.Props): react_jsx_runtime.JSX.Element;
+declare function ComboboxCollection({ ...props }: Combobox$1.Collection.Props): react_jsx_runtime.JSX.Element;
+declare function ComboboxEmpty({ className, ...props }: Combobox$1.Empty.Props): react_jsx_runtime.JSX.Element;
+declare function ComboboxSeparator({ className, ...props }: Combobox$1.Separator.Props): react_jsx_runtime.JSX.Element;
+declare function ComboboxChips({ className, ...props }: React$1.ComponentPropsWithRef<typeof Combobox$1.Chips> & Combobox$1.Chips.Props): react_jsx_runtime.JSX.Element;
+declare function ComboboxChip({ className, children, showRemove, ...props }: Combobox$1.Chip.Props & {
+    showRemove?: boolean;
+}): react_jsx_runtime.JSX.Element;
+declare function ComboboxChipsInput({ className, ...props }: Combobox$1.Input.Props): react_jsx_runtime.JSX.Element;
+declare function useComboboxAnchor(): React$1.RefObject<HTMLDivElement | null>;
+
+declare const Autocomplete: typeof Autocomplete$1.Root;
+declare function AutocompleteInput({ size, className, children, disabled, showTrigger, showClear, startAddon, triggerProps, clearProps, ...props }: Omit<Autocomplete$1.Input.Props, "size"> & {
+    showTrigger?: boolean;
+    showClear?: boolean;
+    startAddon?: ReactNode;
+    size?: InputSize$1;
+    ref?: Ref<HTMLInputElement>;
+    triggerProps?: Autocomplete$1.Trigger.Props;
+    clearProps?: Autocomplete$1.Clear.Props;
+}): react_jsx_runtime.JSX.Element;
+declare function AutocompleteTrigger({ className, children, ...props }: Autocomplete$1.Trigger.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompleteClear({ className, ...props }: Autocomplete$1.Clear.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompletePopup({ className, children, side, sideOffset, align, alignOffset, anchor, portalProps, ...props }: Autocomplete$1.Popup.Props & Pick<Autocomplete$1.Positioner.Props, "side" | "align" | "sideOffset" | "alignOffset" | "anchor"> & {
+    portalProps?: Autocomplete$1.Portal.Props;
+}): react_jsx_runtime.JSX.Element;
+declare function AutocompleteList({ className, ...props }: Autocomplete$1.List.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompleteItem({ className, children, ...props }: Autocomplete$1.Item.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompleteGroup({ className, ...props }: Autocomplete$1.Group.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompleteGroupLabel({ className, ...props }: Autocomplete$1.GroupLabel.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompleteCollection({ ...props }: Autocomplete$1.Collection.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompleteEmpty({ className, ...props }: Autocomplete$1.Empty.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompleteSeparator({ className, ...props }: Autocomplete$1.Separator.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompleteRow({ className, ...props }: Autocomplete$1.Row.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompleteValue({ ...props }: Autocomplete$1.Value.Props): react_jsx_runtime.JSX.Element;
+declare function AutocompleteStatus({ className, ...props }: Autocomplete$1.Status.Props): react_jsx_runtime.JSX.Element;
+declare const useAutocompleteFilter: typeof Autocomplete$1.useFilter;
+
+declare const CommandDialog: typeof Dialog$1.Root;
+declare const CommandDialogPortal: typeof Dialog$1.Portal;
+declare const CommandCreateHandle: typeof Dialog$1.createHandle;
+declare function CommandDialogTrigger(props: Dialog$1.Trigger.Props): React$1.ReactElement;
+declare function CommandDialogBackdrop({ className, ...props }: Dialog$1.Backdrop.Props): React$1.ReactElement;
+declare function CommandDialogViewport({ className, ...props }: Dialog$1.Viewport.Props): React$1.ReactElement;
+declare function CommandDialogPopup({ className, children, portalProps, ...props }: Dialog$1.Popup.Props & {
+    portalProps?: Dialog$1.Portal.Props;
+}): React$1.ReactElement;
+declare function Command({ autoHighlight, keepHighlight, ...props }: React$1.ComponentProps<typeof Autocomplete>): React$1.ReactElement;
+declare function CommandInput({ className, placeholder, ...props }: React$1.ComponentProps<typeof AutocompleteInput>): React$1.ReactElement;
+declare function CommandList({ className, ...props }: React$1.ComponentProps<typeof AutocompleteList>): React$1.ReactElement;
+declare function CommandEmpty({ className, ...props }: React$1.ComponentProps<typeof AutocompleteEmpty>): React$1.ReactElement;
+declare function CommandPanel({ className, ...props }: React$1.ComponentProps<"div">): React$1.ReactElement;
+declare function CommandGroup({ className, ...props }: React$1.ComponentProps<typeof AutocompleteGroup>): React$1.ReactElement;
+declare function CommandGroupLabel({ className, ...props }: React$1.ComponentProps<typeof AutocompleteGroupLabel>): React$1.ReactElement;
+declare function CommandCollection({ ...props }: React$1.ComponentProps<typeof AutocompleteCollection>): React$1.ReactElement;
+declare function CommandItem({ className, ...props }: React$1.ComponentProps<typeof AutocompleteItem>): React$1.ReactElement;
+declare function CommandSeparator({ className, ...props }: React$1.ComponentProps<typeof AutocompleteSeparator>): React$1.ReactElement;
+declare function CommandShortcut({ className, ...props }: React$1.ComponentProps<"kbd">): React$1.ReactElement;
+declare function CommandFooter({ className, ...props }: React$1.ComponentProps<"div">): React$1.ReactElement;
+
+type RadioGroupProps = RadioGroup$1.Props;
+type RadioGroupItemProps = Radio.Root.Props;
+declare function RadioGroup({ className, ...props }: RadioGroupProps): react_jsx_runtime.JSX.Element;
+declare function RadioGroupItem({ className, ...props }: RadioGroupItemProps): react_jsx_runtime.JSX.Element;
+
+declare function Switch({ className, size, ...props }: Switch$1.Root.Props & {
+    size?: "sm" | "default";
+}): react_jsx_runtime.JSX.Element;
+
+declare function Slider({ className, defaultValue, value, min, max, ...props }: Slider$1.Root.Props): react_jsx_runtime.JSX.Element;
+
+type NumberFieldSize = "sm" | "default" | "lg";
+type NumberFieldProps = NumberField$1.Root.Props & {
+    size?: NumberFieldSize;
+};
+declare function NumberField({ className, size, ...props }: NumberFieldProps): react_jsx_runtime.JSX.Element;
+declare function NumberFieldGroup({ className, ...props }: NumberField$1.Group.Props): react_jsx_runtime.JSX.Element;
+declare function NumberFieldInput({ className, ...props }: NumberField$1.Input.Props): react_jsx_runtime.JSX.Element;
+declare function NumberFieldDecrement({ className, children, ...props }: NumberField$1.Decrement.Props): react_jsx_runtime.JSX.Element;
+declare function NumberFieldIncrement({ className, children, ...props }: NumberField$1.Increment.Props): react_jsx_runtime.JSX.Element;
+type NumberFieldScrubAreaProps = NumberField$1.ScrubArea.Props & {
+    label?: React$1.ReactNode;
+};
+declare function NumberFieldScrubArea({ className, children, label, ...props }: NumberFieldScrubAreaProps): react_jsx_runtime.JSX.Element;
+
+type OTPFieldSize = "sm" | "default" | "lg";
+type OTPFieldProps = OTPFieldPreview.Root.Props & {
+    size?: OTPFieldSize;
+};
+declare function OTPField({ className, size, validationType, ...props }: OTPFieldProps): react_jsx_runtime.JSX.Element;
+declare function OTPFieldInput({ className, ...props }: OTPFieldPreview.Input.Props): react_jsx_runtime.JSX.Element;
+declare function OTPFieldSeparator({ className, orientation, ...props }: OTPFieldPreview.Separator.Props): react_jsx_runtime.JSX.Element;
+
+declare function Progress({ className, children, value, ...props }: Progress$1.Root.Props): react_jsx_runtime.JSX.Element;
+declare function ProgressTrack({ className, ...props }: Progress$1.Track.Props): react_jsx_runtime.JSX.Element;
+declare function ProgressIndicator({ className, ...props }: Progress$1.Indicator.Props): react_jsx_runtime.JSX.Element;
+declare function ProgressLabel({ className, ...props }: Progress$1.Label.Props): react_jsx_runtime.JSX.Element;
+declare function ProgressValue({ className, ...props }: Progress$1.Value.Props): react_jsx_runtime.JSX.Element;
+
+declare function Accordion({ className, ...props }: Accordion$1.Root.Props): react_jsx_runtime.JSX.Element;
+declare function AccordionItem({ className, ...props }: Accordion$1.Item.Props): react_jsx_runtime.JSX.Element;
+declare function AccordionTrigger({ className, children, ...props }: Accordion$1.Trigger.Props): react_jsx_runtime.JSX.Element;
+declare function AccordionContent({ className, children, ...props }: Accordion$1.Panel.Props): react_jsx_runtime.JSX.Element;
+
+declare const alertVariants: (props?: ({
+    variant?: "default" | "destructive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function Alert({ className, variant, ...props }: React$1.ComponentProps<"div"> & VariantProps<typeof alertVariants>): react_jsx_runtime.JSX.Element;
+declare function AlertTitle({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertDescription({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertAction({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
+declare function AlertDialog({ ...props }: AlertDialog$1.Root.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogTrigger({ ...props }: AlertDialog$1.Trigger.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogPortal({ ...props }: AlertDialog$1.Portal.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogOverlay({ className, ...props }: AlertDialog$1.Backdrop.Props): react_jsx_runtime.JSX.Element;
+declare function AlertDialogContent({ className, size, ...props }: AlertDialog$1.Popup.Props & {
+    size?: "default" | "sm";
+}): react_jsx_runtime.JSX.Element;
+declare function AlertDialogHeader({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertDialogFooter({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertDialogMedia({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AlertDialogTitle({ className, ...props }: React$1.ComponentProps<typeof AlertDialog$1.Title>): react_jsx_runtime.JSX.Element;
+declare function AlertDialogDescription({ className, ...props }: React$1.ComponentProps<typeof AlertDialog$1.Description>): react_jsx_runtime.JSX.Element;
+declare function AlertDialogAction({ className, ...props }: React$1.ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
+declare function AlertDialogCancel({ className, variant, size, ...props }: AlertDialog$1.Close.Props & Pick<React$1.ComponentProps<typeof Button>, "variant" | "size">): react_jsx_runtime.JSX.Element;
+
+declare function Empty({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function EmptyHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare const emptyMediaVariants: (props?: ({
+    variant?: "default" | "icon" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function EmptyMedia({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof emptyMediaVariants>): react_jsx_runtime.JSX.Element;
+declare function EmptyTitle({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function EmptyDescription({ className, ...props }: React.ComponentProps<"p">): react_jsx_runtime.JSX.Element;
+declare function EmptyContent({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
+declare function ItemGroup({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function ItemSeparator({ className, ...props }: React$1.ComponentProps<typeof Separator>): react_jsx_runtime.JSX.Element;
+declare const itemVariants: (props?: ({
+    variant?: "default" | "outline" | "muted" | null | undefined;
+    size?: "xs" | "sm" | "default" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function Item({ className, variant, size, render, ...props }: useRender.ComponentProps<"div"> & VariantProps<typeof itemVariants>): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
+declare const itemMediaVariants: (props?: ({
+    variant?: "default" | "image" | "icon" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function ItemMedia({ className, variant, ...props }: React$1.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): react_jsx_runtime.JSX.Element;
+declare function ItemContent({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function ItemTitle({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function ItemDescription({ className, ...props }: React$1.ComponentProps<"p">): react_jsx_runtime.JSX.Element;
+declare function ItemActions({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function ItemHeader({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function ItemFooter({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
+type Size = "default" | "sm" | "lg";
+type DynamicSize = Size | (string & {});
+declare const hitboxVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | "dynamic" | null | undefined;
+    position?: "bottom" | "left" | "right" | "top" | "horizontal" | "vertical" | "all" | null | undefined;
+    radius?: "sm" | "lg" | "none" | "md" | "full" | null | undefined;
+    debug?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface HitboxProps extends useRender.ComponentProps<"div">, Omit<VariantProps<typeof hitboxVariants>, "size"> {
+    size?: DynamicSize;
+}
+declare function Hitbox(props: HitboxProps): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
+
+declare function Form({ className, ...props }: Form$1.Props): React__default.ReactElement;
+
+declare function AspectRatio({ ratio, className, ...props }: ComponentProps<"div"> & {
+    ratio: number;
+}): react_jsx_runtime.JSX.Element;
+
+declare function Avatar({ className, size, ...props }: Avatar$1.Root.Props & {
+    size?: "default" | "sm" | "lg";
+}): react_jsx_runtime.JSX.Element;
+declare function AvatarImage({ className, ...props }: Avatar$1.Image.Props): react_jsx_runtime.JSX.Element;
+declare function AvatarFallback({ className, ...props }: Avatar$1.Fallback.Props): react_jsx_runtime.JSX.Element;
+declare function AvatarBadge({ className, ...props }: React$1.ComponentProps<"span">): react_jsx_runtime.JSX.Element;
+declare function AvatarGroup({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function AvatarGroupCount({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
+declare function Breadcrumb({ className, ...props }: React$1.ComponentProps<"nav">): react_jsx_runtime.JSX.Element;
+declare function BreadcrumbList({ className, ...props }: React$1.ComponentProps<"ol">): react_jsx_runtime.JSX.Element;
+declare function BreadcrumbItem({ className, ...props }: React$1.ComponentProps<"li">): react_jsx_runtime.JSX.Element;
+declare function BreadcrumbLink({ className, render, ...props }: useRender.ComponentProps<"a">): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
+declare function BreadcrumbPage({ className, ...props }: React$1.ComponentProps<"span">): react_jsx_runtime.JSX.Element;
+declare function BreadcrumbSeparator({ children, className, ...props }: React$1.ComponentProps<"li">): react_jsx_runtime.JSX.Element;
+declare function BreadcrumbEllipsis({ className, ...props }: React$1.ComponentProps<"span">): react_jsx_runtime.JSX.Element;
+
+type CarouselApi = UseEmblaCarouselType[1];
+type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
+type CarouselOptions = UseCarouselParameters[0];
+type CarouselPlugin = UseCarouselParameters[1];
+interface CarouselProps {
+    opts?: CarouselOptions;
+    plugins?: CarouselPlugin;
+    orientation?: "horizontal" | "vertical";
+    setApi?: (api: CarouselApi) => void;
+}
+type CarouselContextProps = {
+    carouselRef: ReturnType<typeof useEmblaCarousel>[0];
+    api: ReturnType<typeof useEmblaCarousel>[1];
+    scrollPrev: () => void;
+    scrollNext: () => void;
+    canScrollPrev: boolean;
+    canScrollNext: boolean;
+} & CarouselProps;
+declare function useCarousel(): CarouselContextProps;
+declare function Carousel({ orientation, opts, setApi, plugins, className, children, ...props }: React$1.ComponentProps<"div"> & CarouselProps): react_jsx_runtime.JSX.Element;
+declare function CarouselContent({ className, classNameContent, ...props }: React$1.ComponentProps<"div"> & {
+    classNameContent?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function CarouselItem({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function CarouselPrevious({ className, variant, size, ...props }: React$1.ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
+declare function CarouselNext({ className, variant, size, ...props }: React$1.ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
+declare function CarouselDots({ className }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element | null;
+
+declare const DialogCreateHandle: typeof Dialog$1.createHandle;
+declare const Dialog: typeof Dialog$1.Root;
+declare const DialogPortal: typeof Dialog$1.Portal;
+declare function DialogTrigger(props: Dialog$1.Trigger.Props): React__default.ReactElement;
+declare function DialogClose(props: Dialog$1.Close.Props): React__default.ReactElement;
+declare function DialogBackdrop({ className, ...props }: Dialog$1.Backdrop.Props): React__default.ReactElement;
+declare const dialogPopupSizeVariants: (props?: ({
+    size?: "xs" | "sm" | "lg" | "xl" | "md" | "2xl" | "3xl" | "4xl" | "5xl" | "cover" | "full" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type DialogPopupSize = NonNullable<VariantProps<typeof dialogPopupSizeVariants>["size"]>;
+declare const dialogViewportPlacementVariants: (props?: ({
+    placement?: "bottom" | "top" | "center" | "auto" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type DialogViewportPlacement = NonNullable<VariantProps<typeof dialogViewportPlacementVariants>["placement"]>;
+declare function DialogViewport({ className, placement, ...props }: Dialog$1.Viewport.Props & {
+    placement?: DialogViewportPlacement;
+}): React__default.ReactElement;
+declare function DialogPopup({ className, children, showCloseButton, bottomStickOnMobile, placement, size, closeProps, portalProps, ...props }: Dialog$1.Popup.Props & {
+    showCloseButton?: boolean;
+    bottomStickOnMobile?: boolean;
+    placement?: DialogViewportPlacement;
+    size?: DialogPopupSize;
+    closeProps?: Dialog$1.Close.Props;
+    portalProps?: Dialog$1.Portal.Props;
+}): React__default.ReactElement;
+declare function DialogHeader({ className, render, ...props }: useRender.ComponentProps<"div">): React__default.ReactElement;
+declare function DialogFooter({ className, render, ...props }: useRender.ComponentProps<"div">): React__default.ReactElement;
+declare function DialogTitle({ className, ...props }: Dialog$1.Title.Props): React__default.ReactElement;
+declare function DialogDescription({ className, ...props }: Dialog$1.Description.Props): React__default.ReactElement;
+declare function DialogPanel({ className, scrollFade, render, ...props }: useRender.ComponentProps<"div"> & {
+    scrollFade?: boolean;
+}): React__default.ReactElement;
+
+type DrawerPosition = "right" | "left" | "top" | "bottom";
+declare const DrawerCreateHandle: typeof Drawer$1.createHandle;
+declare function Drawer({ swipeDirection, position, ...props }: Drawer$1.Root.Props & {
+    position?: DrawerPosition;
+}): React__default.ReactElement;
+declare const DrawerPortal: typeof Drawer$1.Portal;
+declare function DrawerTrigger(props: Drawer$1.Trigger.Props): React__default.ReactElement;
+declare function DrawerClose(props: Drawer$1.Close.Props): React__default.ReactElement;
+declare function DrawerSwipeArea({ className, position: positionProp, ...props }: Drawer$1.SwipeArea.Props & {
+    position?: DrawerPosition;
+}): React__default.ReactElement;
+declare function DrawerBackdrop({ className, ...props }: Drawer$1.Backdrop.Props): React__default.ReactElement;
+declare function DrawerViewport({ className, position, variant, ...props }: Drawer$1.Viewport.Props & {
+    position?: DrawerPosition;
+    variant?: "default" | "straight" | "inset";
+}): React__default.ReactElement;
+declare function DrawerPopup({ className, children, showCloseButton, position: positionProp, variant, showBar, ...props }: Drawer$1.Popup.Props & {
+    showCloseButton?: boolean;
+    position?: DrawerPosition;
+    variant?: "default" | "straight" | "inset";
+    showBar?: boolean;
+}): React__default.ReactElement;
+declare function DrawerHeader({ className, allowSelection, render, ...props }: useRender.ComponentProps<"div"> & {
+    allowSelection?: boolean;
+}): React__default.ReactElement;
+declare function DrawerFooter({ className, allowSelection, render, ...props }: useRender.ComponentProps<"div"> & {
+    allowSelection?: boolean;
+}): React__default.ReactElement;
+declare function DrawerTitle({ className, ...props }: Drawer$1.Title.Props): React__default.ReactElement;
+declare function DrawerDescription({ className, ...props }: Drawer$1.Description.Props): React__default.ReactElement;
+declare function DrawerPanel({ className, scrollFade, scrollable, allowSelection, render, ...props }: useRender.ComponentProps<"div"> & {
+    scrollFade?: boolean;
+    scrollable?: boolean;
+    allowSelection?: boolean;
+}): React__default.ReactElement;
+declare function DrawerBar({ className, position: positionProp, render, ...props }: useRender.ComponentProps<"div"> & {
+    position?: DrawerPosition;
+}): React__default.ReactElement;
+declare const DrawerContent: typeof Drawer$1.Content;
+
+declare function Pagination({ className, ...props }: React$1.ComponentProps<"nav">): react_jsx_runtime.JSX.Element;
+declare function PaginationContent({ className, ...props }: React$1.ComponentProps<"ul">): react_jsx_runtime.JSX.Element;
+declare function PaginationItem({ ...props }: React$1.ComponentProps<"li">): react_jsx_runtime.JSX.Element;
+type PaginationLinkProps = {
+    isActive?: boolean;
+} & Pick<React$1.ComponentProps<typeof Button>, "size"> & React$1.ComponentProps<"a">;
+declare function PaginationLink({ className, isActive, size, ...props }: PaginationLinkProps): react_jsx_runtime.JSX.Element;
+declare function PaginationPrevious({ className, text, ...props }: React$1.ComponentProps<typeof PaginationLink> & {
+    text?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function PaginationNext({ className, text, ...props }: React$1.ComponentProps<typeof PaginationLink> & {
+    text?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function PaginationEllipsis({ className, ...props }: React$1.ComponentProps<"span">): react_jsx_runtime.JSX.Element;
+
+declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, locale, formatters, components, ...props }: React$1.ComponentProps<typeof DayPicker> & {
+    buttonVariant?: React$1.ComponentProps<typeof Button>["variant"];
+}): react_jsx_runtime.JSX.Element;
+declare function CalendarDayButton({ className, day, modifiers, locale, ...props }: React$1.ComponentProps<typeof DayButton> & {
+    locale?: Partial<Locale>;
+}): react_jsx_runtime.JSX.Element;
+
+/** Trigger scale; maps to Mobase `Button` `size` (`sm` / `default` / `lg`). */
+type DatePickerSize = "sm" | "default" | "lg";
+type CalendarProps = React$1.ComponentProps<typeof Calendar>;
+type OmitSelectionProps = Omit<CalendarProps, "mode" | "selected" | "onSelect" | "required">;
+interface DatePickerPreset {
+    label: string;
+    date: Date;
+}
+type DatePickerProps = OmitSelectionProps & {
+    className?: string;
+    placeholder?: string;
+    value?: Date;
+    defaultValue?: Date;
+    onValueChange?: (date: Date | undefined) => void;
+    presets?: DatePickerPreset[];
+    locale?: Locale;
+    /** Trigger height; `Button` `size`: `sm`, `default`, or `lg`. */
+    size?: DatePickerSize;
+    /** `date-fns` format string for the trigger label. Default: MMMM dd, yyyy */
+    dateFormat?: string;
+};
+declare function DatePicker({ className, placeholder, value, defaultValue, onValueChange, presets, locale, disabled, size, dateFormat, captionLayout, ...calendarProps }: DatePickerProps): react_jsx_runtime.JSX.Element;
+type DateRangePickerProps = OmitSelectionProps & {
+    className?: string;
+    placeholder?: string;
+    value?: DateRange;
+    defaultValue?: DateRange;
+    onValueChange?: (range: DateRange | undefined) => void;
+    locale?: Locale;
+    /** Trigger height; `Button` `size`: `sm`, `default`, or `lg`. */
+    size?: DatePickerSize;
+    /** `date-fns` format string for each boundary in the trigger. Default: MMMM dd, yyyy */
+    dateFormat?: string;
+};
+declare function DateRangePicker({ className, placeholder, value, defaultValue, onValueChange, locale, disabled, size, dateFormat, captionLayout, ...calendarProps }: DateRangePickerProps): react_jsx_runtime.JSX.Element;
+
+type PresetType = 'blur' | 'fade-in-blur' | 'scale' | 'fade' | 'slide';
+type PerType = 'word' | 'char' | 'line';
+interface TextEffectProps {
+    children: string;
+    per?: PerType;
+    as?: keyof React__default.JSX.IntrinsicElements;
+    variants?: {
+        container?: Variants;
+        item?: Variants;
+    };
+    className?: string;
+    preset?: PresetType;
+    delay?: number;
+    speedReveal?: number;
+    speedSegment?: number;
+    trigger?: boolean;
+    onAnimationComplete?: () => void;
+    onAnimationStart?: () => void;
+    segmentWrapperClassName?: string;
+    containerTransition?: Transition;
+    segmentTransition?: Transition;
+    style?: React__default.CSSProperties;
+}
+declare function TextEffect({ children, per, as, variants, className, preset, delay, speedReveal, speedSegment, trigger, onAnimationComplete, onAnimationStart, segmentWrapperClassName, containerTransition, segmentTransition, style, }: TextEffectProps): react_jsx_runtime.JSX.Element;
+
+interface SlidingNumberProps {
+    value: number;
+    padStart?: boolean;
+    decimalSeparator?: string;
+}
+declare function SlidingNumber({ value, padStart, decimalSeparator, }: SlidingNumberProps): react_jsx_runtime.JSX.Element;
+
+type MarqueeProps = HTMLAttributes<HTMLDivElement>;
+declare function Marquee({ className, ...props }: MarqueeProps): react_jsx_runtime.JSX.Element;
+type MarqueeContentProps = MarqueeProps$1;
+declare function MarqueeContent({ loop, autoFill, pauseOnHover, ...props }: MarqueeContentProps): react_jsx_runtime.JSX.Element;
+type MarqueeFadeProps = HTMLAttributes<HTMLDivElement> & {
+    side: "left" | "right";
+};
+declare function MarqueeFade({ className, side, ...props }: MarqueeFadeProps): react_jsx_runtime.JSX.Element;
+type MarqueeItemProps = HTMLAttributes<HTMLDivElement>;
+declare function MarqueeItem({ className, ...props }: MarqueeItemProps): react_jsx_runtime.JSX.Element;
+
+interface LogosCarouselProps {
+    children: React$1.ReactNode;
+    stagger?: number;
+    count?: number;
+    className?: string;
+    duration?: number;
+    interval?: number;
+    initialDelay?: number;
+}
+declare function LogosCarousel({ children, stagger, count, className, duration, interval, initialDelay, }: LogosCarouselProps): react_jsx_runtime.JSX.Element | null;
+
+interface DialogQrProps extends Omit<React$1.ComponentProps<typeof Dialog>, "children"> {
+    /**
+     * The title of the dialog QR.
+     */
+    title?: string;
+    /**
+     * The short title of the step 3 in dialog QR.
+     */
+    shortTitle?: string;
+    /**
+     * The image URL for the QR code.
+     */
+    qrImage?: string;
+    /**
+     * The link associated with the QR code.
+     */
+    qrLink?: string;
+    /**
+     * The logo image URL for the QR code.
+     */
+    logoQr?: string;
+    /**
+     * Indicates whether the QR code is all in one.
+     */
+    isQrForAll?: boolean;
+    className?: string;
+    /**
+     * Optional override for step list (left side).
+     */
+    children?: React$1.ReactNode;
+}
+declare function DialogQr({ className, children, title, shortTitle, qrImage, qrLink, logoQr, isQrForAll, ...props }: DialogQrProps): react_jsx_runtime.JSX.Element;
+
+interface QRPaymentProps extends React$1.ComponentProps<"div"> {
+    loading?: boolean;
+    isExpriedQR: Date | string | number | boolean;
+    qrLink: string;
+    qrImage?: string;
+    logoQr?: string;
+    titleOrder?: string;
+    dateExpired?: Date | string | number;
+    priceOrder?: number | string;
+    isAIOQR?: boolean;
+    isHideGuidePayment?: boolean;
+}
+interface PaymentGuideProps {
+    isQrForAll?: boolean;
+    shortTitle?: string;
+    className?: string;
+}
+interface PaymentGuideDialogProps {
+    children: React$1.ReactElement;
+    title?: string;
+    isQrForAll?: boolean;
+    shortTitle?: string;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+declare function PaymentGuide({ isQrForAll, shortTitle, className }: PaymentGuideProps): react_jsx_runtime.JSX.Element;
+declare function PaymentGuideDialog({ children, title, isQrForAll, shortTitle, open, onOpenChange, }: PaymentGuideDialogProps): react_jsx_runtime.JSX.Element;
+declare function QRCodeScanBox({ isQrForAll, qrImage, qrLink, logoQr, expired, loading, onQrLoaded, dateExpired, priceOrder, titleOrder, isHideGuidePayment, }: {
+    isQrForAll?: boolean;
+    qrImage?: string;
+    qrLink: string;
+    logoQr?: string;
+    expired?: boolean;
+    loading?: boolean;
+    onQrLoaded?: () => void;
+    dateExpired?: Date | string | number;
+    priceOrder?: number | string;
+    titleOrder?: string;
+    isHideGuidePayment?: boolean;
+}): react_jsx_runtime.JSX.Element;
+declare function QRPayment({ loading, isExpriedQR, qrLink, qrImage, logoQr, dateExpired, priceOrder, titleOrder, className, isAIOQR, isHideGuidePayment, ...props }: QRPaymentProps): react_jsx_runtime.JSX.Element;
+
+type LegacyActionButtonVariant = "primary" | "secondary" | "outline" | "tonal" | "danger" | "transparent";
+interface ActionButtonProps extends Omit<ButtonProps, "disabled" | "loading" | "variant"> {
+    /**
+     * Action to be performed when the button is clicked.
+     */
+    action?: string | (() => void) | undefined;
+    /**
+     * Opens a new tab when href link.
+     */
+    newTab?: boolean;
+    /**
+     * Offset top when use button scroll to element.
+     */
+    offset?: number;
+    /**
+     * Props to pass to the DialogQr component. If this prop is provided, the button will open a dialog with a QR code. qrLink in DialogQrProps is required.
+     */
+    dialogQrProps?: Partial<DialogQrProps>;
+    /**
+     * Button variant. Supports both legacy block variants and current Mobase button variants.
+     */
+    variant?: LegacyActionButtonVariant | ButtonProps["variant"];
+    /**
+     * Legacy loading prop from Mobase website blocks.
+     */
+    isLoading?: boolean;
+    /**
+     * Legacy disabled prop from Mobase website blocks.
+     */
+    isDisabled?: boolean;
+    /**
+     * Current Mobase button loading prop.
+     */
+    loading?: ButtonProps["loading"];
+    /**
+     * Current Mobase button disabled prop.
+     */
+    disabled?: ButtonProps["disabled"];
+    /**
+     * CSS class to be appended to the root element.
+     */
+    className?: string;
+    /**
+     * The content for button.
+     */
+    children?: ReactNode;
+    /**
+     * Callback fired when tracking event is pushed.
+     */
+    onPushTrackingEvent?: () => void;
+}
+
+interface HeadingBlockProps {
+    /**
+     * ALign the heading.
+     */
+    align?: "center" | "left" | "right";
+    /**
+     * The tagline content.
+     */
+    tagline?: string;
+    /**
+     * The title content.
+     */
+    title?: string;
+    /**
+     * The description content.
+     */
+    description?: string;
+    /**
+     * HTML Tag heading. Default is "h2".
+     */
+    tagHeading?: "h1" | "h2";
+    /**
+     * The color scheme of the heading block.
+     */
+    colorScheme?: "pink" | "black" | "white";
+    /**
+     * The size of the heading.
+     */
+    sizeHeading?: "small" | "large";
+    /**
+     * CSS class to be appended to the root element heading.
+     */
+    className?: string;
+}
+interface dataButton extends ActionButtonProps {
+    /**
+     * Button name.
+     */
+    btnName: string;
+}
+interface ButtonsBlockProps {
+    /**
+     * CSS class to be appended to the root element.
+     */
+    className?: string;
+    /**
+     * ALign the button.
+     */
+    align?: "center" | "left" | "right";
+    /**
+     * Button is full width in mobile.
+     */
+    isFullInMobile?: boolean;
+    /**
+     * Button group data.
+     */
+    buttons?: dataButton[];
+}
+interface SectionBlockProps {
+    /**
+     * Id of the section.
+     */
+    idSection?: string | undefined;
+    /**
+     * CSS class to be appended to the root element.
+     */
+    className?: string;
+    /**
+     * Input the color code or image url according to CSS syntax.
+     */
+    background?: string;
+    /**
+     * The children of the section.
+     */
+    children?: React.ReactNode;
+    /**
+     * When true, disables all loop animations (InfiniteSlider, HorizontalScroll nav, Carousel).
+     * Use in editor environments like Puck to prevent performance issues.
+     * @default false
+     */
+    editorMode?: boolean;
+}
+
+interface HeroContentProps extends SectionBlockProps {
+    /**
+     * The template of the hero section.
+     */
+    template?: 1 | 2 | 3;
+    /**
+     * The data heading of the hero section.
+     */
+    dataHeading?: HeadingBlockProps;
+    /**
+     * The array of feature items displayed in the hero section.
+     */
+    dataFeatures?: HeroContentListFeatureProps[];
+    /**
+     * The data buttons of the hero section.
+     */
+    dataButtons?: ButtonsBlockProps;
+    /**
+     * Key statistics displayed below the heading.
+     */
+    dataStats?: HeroContentListStats[];
+    /**
+     * The media (image or YouTube video) of the hero section.
+     */
+    dataMedia?: HeroContentMediaProps;
+    /**
+     * Custom component to replace the default media slot.
+     * Useful for embedding interactive widgets, app mockups, etc.
+     */
+    advancedComponent?: React.ReactNode;
+}
+interface HeroContentListFeatureProps {
+    /** Feature label — supports HTML string via html-react-parser. */
+    name?: string;
+    /** Optional image/icon URL replacing the default check icon. */
+    image?: string;
+}
+interface HeroContentListStats {
+    /**
+     * Numeric (or string) value of the stat, e.g. 30 or "30+".
+     */
+    value?: number | string;
+    /**
+     * Short suffix appended immediately after value, e.g. "M+".
+     */
+    suffix?: string;
+    /**
+     * Unit label shown after suffix, e.g. "người dùng".
+     */
+    unit?: string;
+    /**
+     * Supporting description below the value.
+     */
+    description?: string;
+}
+interface HeroContentMediaProps {
+    /** Image or video thumbnail URL. */
+    src: string;
+    /** Aspect ratio as number (e.g. 16/9) or string (e.g. "16/9"). */
+    ratio?: string | number;
+    /** Callback when the play button is clicked. */
+    onClickFC?: () => void;
+    /** Extra class on the media wrapper div. */
+    className?: string;
+    /** Extra class on the inner img element. */
+    classNameMedia?: string;
+    /** YouTube video ID — enables the play-button overlay dialog. */
+    youtubeId?: string;
+    /** Media type constant: TYPE_MEDIA_IMAGE (1) | TYPE_MEDIA_VIDEO (2). */
+    type?: number | null;
+    /** Alt text for the image. */
+    alt?: string;
+}
+
+declare const HERO_SECTION_DEFAULT_BACKGROUND: string;
+declare function HeroSection({ template, idSection, dataHeading, dataButtons, dataFeatures, dataStats, dataMedia, className, background, advancedComponent, editorMode, }: HeroContentProps): react_jsx_runtime.JSX.Element;
+
+interface GiftListItemData {
+    /**
+     * Service name of gift card.
+     */
+    serviceName?: string;
+    /**
+     * Gift card title.
+     */
+    title: string;
+    /**
+     * Short description of gift card.
+     */
+    description?: string;
+    /**
+     * Gift thumbnail url (square image).
+     */
+    thumbnail?: string;
+    /**
+     * Gift tag content.
+     */
+    tag?: string;
+    /**
+     * Mark card as featured item.
+     */
+    isFeatured?: boolean;
+    /**
+     * Gift action button text.
+     */
+    btnName?: string;
+    /**
+     * Gift action button url. When set (non-empty), the CTA uses a link with this target.
+     * When empty or omitted but `btnName` is set, the CTA opens the detail modal instead.
+     */
+    btnLink?: string;
+    /**
+     * Open action button in new tab.
+     */
+    newTab?: boolean;
+    /**
+     * When true, clicking the card (outside the CTA) opens the detail modal. Does not affect CTA:
+     * CTA follows `btnLink` (navigate) vs no `btnLink` (open modal).
+     */
+    useModal?: boolean;
+    /**
+     * Short description displayed in modal.
+     */
+    content?: string;
+}
+interface GiftListSectionProps extends SectionBlockProps {
+    /**
+     * The template of the section.
+     */
+    template?: 1;
+    /**
+     * The data heading of the section.
+     */
+    dataHeading?: HeadingBlockProps;
+    /**
+     * The data buttons of the section.
+     */
+    dataButtons?: ButtonsBlockProps;
+    /**
+     * The array data gift list of the section.
+     */
+    dataGiftList?: GiftListItemData[];
+}
+
+declare function GiftListSection({ template, className, idSection, background, dataHeading, dataButtons, dataGiftList, editorMode, }: GiftListSectionProps): react_jsx_runtime.JSX.Element;
+
+interface BannerData {
+    /**
+     * The image source.
+     */
+    src?: string;
+    /**
+     * The image alt.
+     */
+    alt?: string;
+    /**
+     * The image ratio.
+     */
+    ratio?: number;
+}
+interface FeatureData {
+    /**
+     * Feature name.
+     */
+    name?: string;
+    /**
+     * Feature description.
+     */
+    description?: string;
+    /**
+     * Feature image.
+     */
+    image?: string;
+    /**
+     * Feature button name.
+     */
+    btnName?: string;
+    /**
+     * Feature button link.
+     */
+    btnLink?: string;
+    /**
+     * Feature button use new tab.
+     */
+    newTab?: boolean;
+}
+interface FeatureSectionProps extends SectionBlockProps {
+    /**
+     * The template of the feature section.
+     */
+    template?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11;
+    /**
+     * The data heading of the feature section.
+     */
+    dataHeading?: HeadingBlockProps;
+    /**
+     * The array data features of the feature section.
+     */
+    dataFeatures?: FeatureData[];
+    /**
+     * The data buttons of the feature section.
+     */
+    dataButtons?: ButtonsBlockProps;
+    /**
+     * The data banner of the feature section.
+     */
+    dataBanner?: BannerData;
+}
+
+declare const FeatureSection: ({ template, background, className, idSection, dataHeading, dataFeatures, dataButtons, dataBanner, editorMode, }: FeatureSectionProps) => react_jsx_runtime.JSX.Element;
+
+interface DataMetricsProps {
+    metricValue: string;
+    metricTitle: string;
+    metricDescription?: string;
+}
+interface MetricsSectionProps extends SectionBlockProps {
+    /**
+     * The template of the metrics section.
+     * The template value must be a positive integer greater than 0.
+     */
+    template?: (number & {
+        __type?: "PositiveInteger";
+    }) | 1;
+    /**
+     * The data heading of the metrics section.
+     */
+    dataHeading: HeadingBlockProps;
+    /**
+     * The array data metrics of the metrics section.
+     */
+    dataMetrics: DataMetricsProps[];
+    dataButtons?: ButtonsBlockProps;
+}
+
+declare const MetricsSection: ({ idSection, dataHeading, dataMetrics, dataButtons, background, className, template, editorMode, }: MetricsSectionProps) => react_jsx_runtime.JSX.Element;
+
+interface CTAMedia {
+    /**
+     * The image source.
+     */
+    src?: string;
+    /**
+     * The image alt text.
+     */
+    alt?: string;
+    /**
+     * The image aspect ratio (width / height). Defaults to 4/3.
+     */
+    ratio?: number;
+}
+interface CTABlockData {
+    /**
+     * Override the background color or image of the CTA block.
+     * Accepts any CSS background value (color, gradient, url()).
+     */
+    background?: string;
+}
+interface CTASectionProps extends SectionBlockProps {
+    /**
+     * Layout template variant.
+     * - `1` — centered content on a light background (default).
+     * - `2` — split layout: text on the left, media image on the right, on a primary background.
+     */
+    template?: 1 | 2;
+    /**
+     * Heading block data (tagline, title, description).
+     */
+    dataHeading?: HeadingBlockProps;
+    /**
+     * CTA block styling data (custom background).
+     */
+    dataCTA?: CTABlockData;
+    /**
+     * Button group data.
+     */
+    dataButtons?: ButtonsBlockProps;
+    /**
+     * Media (image) data used in template 2.
+     */
+    dataMedia?: CTAMedia;
+}
+type CTASectionData = CTABlockData;
+
+declare function CTASection({ template, background, className, idSection, dataHeading, dataCTA, dataButtons, dataMedia, editorMode, }: CTASectionProps): react_jsx_runtime.JSX.Element;
+
+interface HowItWorksData {
+    /**
+     * Image banner `src` or icon (`svg` string or React `svg` element) of the step.
+     */
+    image?: string | ReactElement;
+    /**
+     * Title of the step.
+     */
+    title: string;
+    /**
+     * Description of the step.
+     */
+    description?: string;
+}
+interface HowItWorksSectionProps extends SectionBlockProps {
+    /**
+     * The template of the section.
+     */
+    template?: 1 | 2 | 3;
+    /**
+     * The data heading of the section.
+     */
+    dataHeading?: HeadingBlockProps;
+    /**
+     * The array data steps of the section.
+     */
+    dataHowItWorks?: HowItWorksData[];
+    /**
+     * The data buttons of the section.
+     */
+    dataButtons?: ButtonsBlockProps;
+}
+
+declare function HowItWorksSection({ template, background, className, idSection, dataHeading, dataHowItWorks, dataButtons, editorMode, }: HowItWorksSectionProps): react_jsx_runtime.JSX.Element;
+
+interface StepItemProps {
+    /**
+     * The title of the step item.
+     */
+    title: string;
+    /**
+     * The content of the step item.
+     */
+    content?: string;
+    /**
+     * The image of the step item.
+     */
+    image?: string;
+}
+interface GuideDataProps {
+    /**
+     * The title of the guide item.
+     */
+    title: string;
+    /**
+     * The description of the guide item.
+     */
+    description?: string;
+    /**
+     * The avatar image of the guide item. Image size: 540x960 or 540x1168. If not provided, the image in step first will be used.
+     */
+    avatar?: string;
+    /**
+     * The array of step.
+     */
+    stepList: StepItemProps[];
+}
+interface GuideSectionProps extends SectionBlockProps {
+    /**
+     * The template of the section.
+     */
+    template?: 1;
+    /**
+     * The data heading of the section.
+     */
+    dataHeading?: HeadingBlockProps;
+    /**
+     * The data guides of the section.
+     */
+    dataGuide?: GuideDataProps[];
+    /**
+     * The data horizontal scroll of the guide section.
+     */
+    dataHorizontalScroll?: HorizontalScrollProps;
+    /**
+     * The data buttons of the section.
+     */
+    dataButtons?: ButtonsBlockProps;
+    /**
+     * Show mockup mobile in banner.
+     */
+    mockup?: "default" | "small" | "none";
+    /**
+     * Show UI step.
+     */
+    isStep?: boolean;
+}
+
+declare function GuideSection({ idSection, dataHeading, dataGuide, dataHorizontalScroll, dataButtons, className, background, template, mockup, isStep, editorMode, }: GuideSectionProps): react_jsx_runtime.JSX.Element;
+
+interface BlogItemProps {
+    id: number;
+    title: string;
+    totalViews?: string;
+    thumbnailMobile: string;
+    thumbnailDesktop: string;
+    url: string;
+    category?: string;
+    categoryUrl?: string;
+    description?: string;
+}
+interface DataBlogProps {
+    title: string;
+    blogList: BlogItemProps[];
+    classNameItem?: string;
+    isShowBtn?: boolean;
+    btnUrl?: string;
+    btnName?: string;
+    isNewTab?: boolean;
+    isLoading?: boolean;
+    dataUmamiEvent?: string;
+}
+interface DataHorizontalScrollProps$2 {
+    showGradientOverlay?: boolean;
+    gradientOverlayColor?: string;
+    className?: string;
+}
+interface BlogSectionProps extends SectionBlockProps {
+    template?: 1 | 2;
+    dataHeading: HeadingBlockProps;
+    dataHorizontalScroll?: DataHorizontalScrollProps$2;
+    dataBlog: DataBlogProps[];
+    onClickModal?: (id: number) => void;
+    onClickLoadMore?: (tabIndex: number) => void;
+}
+
+declare function BlogSection({ dataHeading, dataHorizontalScroll, dataBlog, idSection, className, background, template, onClickModal, onClickLoadMore, editorMode, }: BlogSectionProps): react_jsx_runtime.JSX.Element;
+
+interface NewsItemProps {
+    /** The id of the news item. */
+    id: number;
+    /** The title of the news item. */
+    title: string;
+    /** The date time of the news item. */
+    dateTime?: string;
+    /** Thumbnail for small viewports. */
+    thumbnailMobile: string;
+    /** Thumbnail for desktop. */
+    thumbnailDesktop: string;
+    /** The url of the news item. */
+    url: string;
+    /** The category of the news item. */
+    category?: string;
+    /** The category url of the news item. */
+    categoryUrl?: string;
+}
+interface DataNewsProps {
+    /** The title of the news group (tab label). */
+    title: string;
+    /** The array of news items. */
+    newsList: NewsItemProps[];
+    /** The class name of the news item. */
+    classNameItem?: string;
+    /** Show the CTA button. Default false. */
+    isShowBtn?: boolean;
+    /** The url of the button. */
+    btnUrl?: string;
+    /** The name of the button. Default "Xem thêm". */
+    btnName?: string;
+    /** Open the button in a new tab. Default false. */
+    isNewTab?: boolean;
+    /** Loading state for load-more. Default false. */
+    isLoading?: boolean;
+    /** Umami tracking event name for the load more button. */
+    dataUmamiEvent?: string;
+}
+interface DataHorizontalScrollProps$1 {
+    showGradientOverlay?: boolean;
+    gradientOverlayColor?: string;
+    className?: string;
+}
+interface NewsSectionProps extends SectionBlockProps {
+    template?: 1;
+    dataHeading: HeadingBlockProps;
+    dataHorizontalScroll?: DataHorizontalScrollProps$1;
+    dataNews: DataNewsProps[];
+    onClickModal?: (id: number) => void;
+    onClickLoadMore?: (tabIndex: number) => void;
+}
+
+declare function NewsSection({ idSection, dataHeading, dataHorizontalScroll, dataNews, className, background, template, onClickModal, onClickLoadMore, editorMode, }: NewsSectionProps): react_jsx_runtime.JSX.Element;
+
+interface ContentsProps {
+    title: string;
+    description: string;
+}
+interface DataFAQProps {
+    title: string;
+    isActiveFistQuestion?: boolean;
+    contents: ContentsProps[];
+}
+interface DataHorizontalScrollProps {
+    showGradientOverlay?: boolean;
+    gradientOverlayColor?: string;
+    className?: string;
+}
+interface FAQSectionProps extends SectionBlockProps {
+    template?: 1 | 2;
+    dataHeading?: HeadingBlockProps;
+    dataFAQ: DataFAQProps[];
+    dataButtons?: ButtonsBlockProps;
+    dataHorizontalScroll?: DataHorizontalScrollProps;
+}
+
+declare function FAQSection({ dataHeading, dataFAQ, className, background, idSection, dataButtons, dataHorizontalScroll, template, editorMode, }: FAQSectionProps): react_jsx_runtime.JSX.Element;
+
+interface BrandData {
+    name?: string;
+    logo?: string;
+    url?: string;
+    newTab?: boolean;
+}
+interface SocialProofSectionProps extends SectionBlockProps {
+    template?: 1 | 2 | 3 | 4;
+    dataHeading?: HeadingBlockProps;
+    dataBrands?: BrandData[];
+    dataButtons?: ButtonsBlockProps;
+    /** Desktop horizontal gap between logos (template 1 only). Mobile uses fixed spacing. */
+    spaceX?: "20px" | "28px" | "36px" | "40px" | "48px" | "56px" | "64px" | "80px";
+    /** Scroll snap on mobile (template 1 and 2). */
+    isScrollSnap?: boolean;
+}
+
+declare function SocialProofSection({ template, background, className, idSection, dataHeading, dataBrands, dataButtons, spaceX, isScrollSnap, editorMode, }: SocialProofSectionProps): react_jsx_runtime.JSX.Element;
+
+interface TestimonialData {
+    avatar?: string;
+    name?: string;
+    position?: string;
+    shortTitle?: string;
+    description?: string;
+    /** 1–5; 0 hides stars */
+    rating?: number;
+    date?: string;
+}
+interface TestimonialSectionProps extends SectionBlockProps {
+    template?: 1 | 2 | 3;
+    dataHeading?: HeadingBlockProps;
+    dataTestimonials?: TestimonialData[];
+    dataButtons?: ButtonsBlockProps;
+}
+declare const randomColors: string[];
+/** Supports `getInitials("Jane Doe")` or legacy `getInitials({ name })`. */
+declare function getInitials(nameOrOpts: string | {
+    name?: string;
+}): string;
+declare function getColorForIndex(index: number, colors?: readonly string[]): string;
+
+declare function TestimonialSection({ template, background, className, idSection, dataHeading, dataTestimonials, dataButtons, editorMode, }: TestimonialSectionProps): react_jsx_runtime.JSX.Element;
+
+type InfiniteSliderProps = {
+    children: React.ReactNode;
+    gap?: number;
+    speed?: number;
+    speedOnHover?: number;
+    direction?: "horizontal" | "vertical";
+    reverse?: boolean;
+    className?: string;
+    /** Extra classes on the inner motion track (e.g. `w-full` for vertical columns). */
+    classNameMotion?: string;
+};
+/**
+ * Infinite marquee using Motion — used by testimonial rails and similar blocks.
+ */
+declare function InfiniteSlider({ children, gap, speed, speedOnHover, direction, reverse, className, classNameMotion, }: InfiniteSliderProps): react_jsx_runtime.JSX.Element;
+
+/** Background classes for initials avatars (MoMo palette tokens, cycles by index). */
+declare const TESTIMONIAL_AVATAR_FALLBACK_BACKGROUNDS: readonly ["bg-pink-7", "bg-blue-7", "bg-green-7", "bg-amber-7", "bg-purple-7", "bg-teal-7", "bg-red-7", "bg-primary"];
+declare function getInitialsFromName(name: string): string;
+declare function getTestimonialAvatarColorClass(index: number): string;
+
+/**
+ * Best-effort plain text for `alt` and similar when CMS fields may contain HTML.
+ */
+declare function plainTextFromHtml(html: string, maxLength?: number): string;
+
+type ClickOutsideEvent = MouseEvent | TouchEvent;
+declare function useClickOutside(refs: RefObject<HTMLElement | null>[], onClickOutside: (event: ClickOutsideEvent) => void): void;
+
+declare function useIsMobile(): boolean;
+
+declare function useCopyToClipboard({ timeout, onCopy, }?: {
+    timeout?: number;
+    onCopy?: () => void;
+}): {
+    isCopied: boolean;
+    copyToClipboard: (value: string) => Promise<boolean>;
+};
+
+declare function useIsMomoApp(): boolean;
+
+declare function useLocalStorage<T>(key: string, initialValue: T | (() => T)): [T, Dispatch<SetStateAction<T>>];
+
+declare function useIsClient(): boolean;
+
+/**
+ * Hook to detect if the current device has touch capabilities.
+ * Safe for SSR - returns `false` during server-side rendering.
+ */
+declare function useIsTouchDevice(): boolean;
+
+interface WindowSize {
+    width: number | undefined;
+    height: number | undefined;
+}
+/**
+ * Hook that returns the current window dimensions.
+ * Safe for SSR - returns `undefined` for width and height during server-side rendering.
+ */
+declare function useWindowSize(): WindowSize;
+
+declare function cn(...inputs: ClassValue[]): string;
+declare function stripHtml(html?: string): string;
+
+/**
+ * Scrolls the viewport so the element matching `selector` sits near the top,
+ * minus `offset` pixels. No-op if the element is missing.
+ *
+ * **Chỉ dùng trên client** (gọi từ `onClick`, `useEffect`, v.v.) — không gọi trong RSC.
+ */
+declare function scrollToSelector(selector: string, offset?: number): void;
+
+/**
+ * Chuẩn hoá `ratio` từ CMS (số hoặc chuỗi `"16/9"`) thành một số dương cho `AspectRatio` / layout.
+ */
+declare function convertMediaRatio(ratio: string | number | undefined): number;
+
+interface BuildQrCodeImageUrlOptions {
+    /** Kích thước ảnh vuông (pixel). Mặc định 240. */
+    size?: number;
+    /** Nếu có, trả về URL này thay vì tạo từ `qrLink`. */
+    qrImage?: string;
+}
+/**
+ * Trả về URL ảnh QR để hiển thị (`<img src={...} />`).
+ * Mặc định dùng dịch vụ công khai; có thể truyền `qrImage` để dùng ảnh tự host.
+ */
+declare function buildQrCodeImageUrl(qrLink: string, options?: BuildQrCodeImageUrlOptions): string;
+
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertAction, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AnchoredToastProvider, AspectRatio, Autocomplete, AutocompleteClear, AutocompleteCollection, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteInput, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, type BadgeProps, type BadgeSize, type BlogItemProps, BlogSection, type BlogSectionProps, type BrandData, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, type BuildQrCodeImageUrlOptions, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, type ButtonProps, type CTABlockData, type CTAMedia, CTASection, type CTASectionData, type CTASectionProps, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselDots, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, type CheckboxProps, CloseButton, type CloseButtonProps, type CloseButtonSize, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, Command, CommandCollection, CommandCreateHandle, CommandDialog, CommandDialogBackdrop, CommandDialogPopup, CommandDialogPortal, CommandDialogTrigger, CommandDialogViewport, CommandEmpty, CommandFooter, CommandGroup, CommandGroupLabel, CommandInput, CommandItem, CommandList, CommandPanel, CommandSeparator, CommandShortcut, type ContentsProps, type DataBlogProps, type DataFAQProps, type DataHorizontalScrollProps$1 as DataHorizontalScrollProps, type DataNewsProps, DatePicker, type DatePickerPreset, type DatePickerProps, type DatePickerSize, DateRangePicker, type DateRangePickerProps, Dialog, DialogBackdrop, DialogClose, DialogPopup as DialogContent, DialogCreateHandle, DialogDescription, DialogFooter, DialogHeader, DialogBackdrop as DialogOverlay, DialogPanel, DialogPopup, type DialogPopupSize, DialogPortal, DialogQr, type DialogQrProps, DialogTitle, DialogTrigger, DialogViewport, type DialogViewportPlacement, Drawer, DrawerBackdrop, DrawerBar, DrawerClose, DrawerContent, DrawerCreateHandle, DrawerDescription, DrawerFooter, DrawerHeader, DrawerPanel, DrawerPopup, DrawerPortal, DrawerSwipeArea, DrawerTitle, DrawerTrigger, DrawerViewport, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, FAQSection, type FAQSectionProps, FeatureSection, type FeatureSectionProps, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Footer, type FooterAppDownloadItem, FooterContent, type FooterData, type FooterItem, type FooterProps, type FooterSocialItem, Form, type GiftListItemData, GiftListSection, type GiftListSectionProps, type GuideDataProps, GuideSection, type GuideSectionProps, HERO_SECTION_DEFAULT_BACKGROUND, HeaderNavigation, type HeaderNavigationDropdownAlign, type HeaderNavigationItemLink, type HeaderNavigationItemWithDropdown, type HeaderNavigationMenuItem, type HeaderNavigationProps, type HeaderNavigationServiceInfo, type HeaderNavigationSubItem, type HeroContentListFeatureProps, type HeroContentListStats, type HeroContentMediaProps, type HeroContentProps, HeroSection, Hitbox, HorizontalContent, HorizontalNext, HorizontalPrevious, HorizontalScroll, type HorizontalScrollProps, type HowItWorksData, HowItWorksSection, type HowItWorksSectionProps, InfiniteSlider, type InfiniteSliderProps, Input, InputControl, type InputControlProps, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, type InputProps, type InputSize$1 as InputSize, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, Logo, type LogoProps, LogosCarousel, type LogosCarouselProps, Marquee, MarqueeContent, type MarqueeContentProps, MarqueeFade, type MarqueeFadeProps, MarqueeItem, type MarqueeItemProps, type MarqueeProps, MetricsSection, type MetricsSectionProps, NativeSelect, NativeSelectOptGroup, NativeSelectOption, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPositioner, NavigationMenuTrigger, type NewsItemProps, NewsSection, type NewsSectionProps, NumberField, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, type NumberFieldProps, NumberFieldScrubArea, type NumberFieldScrubAreaProps, type NumberFieldSize, OTPField, OTPFieldInput, type OTPFieldProps, OTPFieldSeparator, type OTPFieldSize, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PaymentGuide, PaymentGuideDialog, type PaymentGuideDialogProps, type PaymentGuideProps, type PerType, Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, type PresetType, Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, QRCodeScanBox, QRPayment, type QRPaymentProps, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, ScrollArea, ScrollBar, SearchInput, type SearchInputProps, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, type SelectTriggerSize, SelectValue, Separator, Skeleton, Slider, SlidingNumber, SocialProofSection, type SocialProofSectionProps, Spinner, type SpinnerProps, type StepItemProps, Switch, TESTIMONIAL_AVATAR_FALLBACK_BACKGROUNDS, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, type TestimonialData, TestimonialSection, type TestimonialSectionProps, TextEffect, type TextEffectProps, Textarea, type TextareaProps, type ToastPosition, ToastProvider, type ToastProviderProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, anchoredToastManager, badgeVariants, buildQrCodeImageUrl, buttonGroupVariants, buttonVariants, cn, convertMediaRatio, footerAppDownloads, footerCertificationBadge, footerDefaultPrimaryMenu, footerDefaultSecondaryMenu, footerHelpGuideUrl, footerLogoSrc, footerMoMoText, footerQrDownloadImage, footerSocialItems, footerSupportAddress, getColorForIndex, getInitials, getInitialsFromName, getTestimonialAvatarColorClass, navigationMenuTriggerStyle, plainTextFromHtml, randomColors, scrollToSelector, stripHtml, tabsListVariants, toastManager, useAutocompleteFilter, useCarousel, useClickOutside, useComboboxAnchor, useCopyToClipboard, useIsClient, useIsMobile, useIsMomoApp, useIsTouchDevice, useLocalStorage, useWindowSize };