@underverse-ui/underverse 1.0.61 → 1.0.62
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/api-reference.json +16 -2
- package/dist/index.cjs +183 -64
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +20 -4
- package/dist/index.d.ts +20 -4
- package/dist/index.js +193 -74
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -1803,10 +1803,24 @@ interface FileUploadProps {
|
|
|
1803
1803
|
declare function FileUpload({ onUpload, onRemove, onChange, uploadHandler, maxSize, // Default 50MB
|
|
1804
1804
|
maxFiles, accept, multiple, disabled, className, showFileList, variant, size, dragDropText, browseText, supportedFormatsText, showTypeIcons, allowPreview, initialFiles, }: FileUploadProps): react_jsx_runtime.JSX.Element;
|
|
1805
1805
|
|
|
1806
|
-
type AnimationVariant$1 = "slide" | "fade" | "scale";
|
|
1806
|
+
type AnimationVariant$1 = "slide" | "fade" | "scale" | "coverflow" | "stack";
|
|
1807
1807
|
type Orientation = "horizontal" | "vertical";
|
|
1808
|
+
type CarouselEffectPreset = "cinematic" | "gallery";
|
|
1809
|
+
interface CarouselEffectOptions {
|
|
1810
|
+
mainScale?: number;
|
|
1811
|
+
sideScale?: number;
|
|
1812
|
+
farScale?: number;
|
|
1813
|
+
sideOpacity?: number;
|
|
1814
|
+
farOpacity?: number;
|
|
1815
|
+
sideOffset?: number;
|
|
1816
|
+
rotate?: number;
|
|
1817
|
+
depthStep?: number;
|
|
1818
|
+
blur?: number;
|
|
1819
|
+
stackOffset?: number;
|
|
1820
|
+
stackLift?: number;
|
|
1821
|
+
}
|
|
1808
1822
|
interface CarouselProps {
|
|
1809
|
-
children: React$1.ReactNode
|
|
1823
|
+
children: React$1.ReactNode;
|
|
1810
1824
|
autoScroll?: boolean;
|
|
1811
1825
|
autoScrollInterval?: number;
|
|
1812
1826
|
animation?: AnimationVariant$1;
|
|
@@ -1824,8 +1838,10 @@ interface CarouselProps {
|
|
|
1824
1838
|
onSlideChange?: (index: number) => void;
|
|
1825
1839
|
thumbnailRenderer?: (child: React$1.ReactNode, index: number) => React$1.ReactNode;
|
|
1826
1840
|
ariaLabel?: string;
|
|
1841
|
+
effectPreset?: CarouselEffectPreset;
|
|
1842
|
+
effectOptions?: CarouselEffectOptions;
|
|
1827
1843
|
}
|
|
1828
|
-
declare function Carousel({ children, autoScroll, autoScrollInterval, animation, orientation, showArrows, showDots, showProgress, showThumbnails, loop, slidesToShow, slidesToScroll, className, containerClassName, slideClassName, onSlideChange, thumbnailRenderer, ariaLabel, }: CarouselProps): react_jsx_runtime.JSX.Element;
|
|
1844
|
+
declare function Carousel({ children, autoScroll, autoScrollInterval, animation, orientation, showArrows, showDots, showProgress, showThumbnails, loop, slidesToShow, slidesToScroll, className, containerClassName, slideClassName, onSlideChange, thumbnailRenderer, ariaLabel, effectPreset, effectOptions, }: CarouselProps): react_jsx_runtime.JSX.Element;
|
|
1829
1845
|
|
|
1830
1846
|
type IconComponent = React__default.ComponentType<{
|
|
1831
1847
|
className?: string;
|
|
@@ -4547,4 +4563,4 @@ declare function getUnderverseMessages(locale?: UnderverseLocale): {
|
|
|
4547
4563
|
};
|
|
4548
4564
|
};
|
|
4549
4565
|
|
|
4550
|
-
export { AccessDenied, type AccessDeniedProps, Alert, Avatar, Badge, Badge as BadgeBase, BatteryProgress, BottomSheet, Breadcrumb, Button, ButtonLoading, type ButtonProps, Calendar, type CalendarEvent, type CalendarHoliday, type CalendarProps, CalendarTimeline, type CalendarTimelineDateInput, type CalendarTimelineDayRangeMode, type CalendarTimelineEvent, type CalendarTimelineFormatters, type CalendarTimelineGroup, type CalendarTimelineInteractions, type CalendarTimelineLabels, type CalendarTimelineProps, type CalendarTimelineResource, type CalendarTimelineSize, type CalendarTimelineView, type CalendarTimelineVirtualization, Card, type CardProps, Carousel, type Category, CategoryTreeSelect, type CategoryTreeSelectBaseProps, type CategoryTreeSelectLabels, type CategoryTreeSelectMultiProps, type CategoryTreeSelectProps, type CategoryTreeSelectSingleProps, Checkbox, type CheckboxProps, CircularProgress, ClientOnly, ColorPicker, type ColorPickerProps, Combobox, type ComboboxOption, type ComboboxProps, CompactDatePicker, CompactPagination, type CompactPaginationProps, DataTable, type DataTableColumn, type DataTableDensity, type DataTableLabels, type DataTableProps, type DataTableQuery, type DataTableSize, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, DateTimePicker, type DateTimePickerProps, date as DateUtils, Drawer, DropdownMenu, DropdownMenuItem, DropdownMenuSeparator, FallingIcons, FileUpload, type FileUploadProps, type FilterType, ForceInternalTranslationsProvider, Form, FormActions, FormCheckbox, FormControl, FormDescription, FormField, FormInput, FormItem, FormLabel, FormMessage, FormSubmitButton, GlobalLoading, GradientBadge, Grid, GridItem, type GridItemProps, type GridProps, ImageUpload, type ImageUploadProps, InlineLoading, Input, type InputProps, InteractiveBadge, Label, type LanguageOption, LanguageSwitcherHeadless as LanguageSwitcher, LanguageSwitcherHeadless, type LanguageSwitcherHeadlessProps, type LanguageSwitcherHeadlessProps as LanguageSwitcherProps, List, ListItem, LoadingBar, LoadingDots, LoadingProgress, LoadingSpinner, type LoadingState, type Locale$1 as Locale, MiniProgress, Modal, MonthYearPicker, MonthYearPicker as MonthYearPickerBase, type MonthYearPickerProps, MultiCombobox, type MultiComboboxOption, type MultiComboboxProps, MusicPlayer, MusicPlayer as MusicPlayerDefault, type MusicPlayerProps, NotificationBadge, NotificationModal, NumberInput, type NumberInputProps, OverlayControls, type OverlayControlsProps, OverlayScrollArea, type OverlayScrollAreaProps, OverlayScrollbarProvider, type OverlayScrollbarProviderProps, PageLoading, Pagination, type PaginationProps, PasswordInput, type PasswordInputProps, PillTabs, Popover, Progress, PulseBadge, RadioGroup, RadioGroupItem, SIZE_STYLES_BTN, ScrollArea, type ScrollAreaProps, SearchInput, type SearchInputProps, Section, SegmentedProgress, SelectDropdown, Sheet, SidebarSheet, SimplePagination, type SimplePaginationProps, SimpleTabs, Skeleton, SkeletonAvatar, SkeletonButton, SkeletonCard, SkeletonList, SkeletonMessage, SkeletonPost, SkeletonTable, SkeletonText, SlideOver, Slider, type SliderProps, SmartImage, type Song, type Sorter, StatusBadge, StepProgress, type SupportedLocale, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableHeaderProps, type TableProps, TableRow, Tabs, TagBadge, TagInput, TagInput as TagInputBase, type TagInputProps, Textarea, type TextareaProps, type ThemeMode, ThemeToggleHeadless as ThemeToggle, ThemeToggleHeadless, type ThemeToggleHeadlessProps, type ThemeToggleHeadlessProps as ThemeToggleProps, TimePicker, type TimePickerProps, Timeline, TimelineItem, ToastProvider, Tooltip, TranslationProvider, type TranslationProviderProps, type Translations, UEditor, type UEditorInlineUploadedItem, UEditorPrepareContentForSaveError, type UEditorPrepareContentForSaveOptions, type UEditorPrepareContentForSaveResult, type UEditorProps, type UEditorRef, type UEditorUploadImageForSave, type UEditorUploadImageForSaveResult, type UEditorVariant, type UnderverseLocale, UnderverseProvider, type UnderverseProviderProps, type UploadedFile, type UploadedImage, type UseOverlayScrollbarTargetOptions, VARIANT_STYLES_ALERT, VARIANT_STYLES_BTN, VIETNAM_HOLIDAYS, VerticalTabs, Watermark, type WatermarkProps, cn$1 as cn, cn as cnLocal, extractImageSrcsFromHtml, getAnimationStyles, getUnderverseMessages, injectAnimationStyles, loading, normalizeImageUrl, prepareUEditorContentForSave, shadcnAnimationStyles, underverseMessages, useFormField, useOverlayScrollbarTarget, useShadCNAnimations, useSmartLocale, useSmartTranslations, useToast, useTranslations as useUnderverseI18n, useLocale as useUnderverseI18nLocale, useUnderverseLocale, useUnderverseTranslations };
|
|
4566
|
+
export { AccessDenied, type AccessDeniedProps, Alert, Avatar, Badge, Badge as BadgeBase, BatteryProgress, BottomSheet, Breadcrumb, Button, ButtonLoading, type ButtonProps, Calendar, type CalendarEvent, type CalendarHoliday, type CalendarProps, CalendarTimeline, type CalendarTimelineDateInput, type CalendarTimelineDayRangeMode, type CalendarTimelineEvent, type CalendarTimelineFormatters, type CalendarTimelineGroup, type CalendarTimelineInteractions, type CalendarTimelineLabels, type CalendarTimelineProps, type CalendarTimelineResource, type CalendarTimelineSize, type CalendarTimelineView, type CalendarTimelineVirtualization, Card, type CardProps, Carousel, type CarouselEffectOptions, type CarouselEffectPreset, type Category, CategoryTreeSelect, type CategoryTreeSelectBaseProps, type CategoryTreeSelectLabels, type CategoryTreeSelectMultiProps, type CategoryTreeSelectProps, type CategoryTreeSelectSingleProps, Checkbox, type CheckboxProps, CircularProgress, ClientOnly, ColorPicker, type ColorPickerProps, Combobox, type ComboboxOption, type ComboboxProps, CompactDatePicker, CompactPagination, type CompactPaginationProps, DataTable, type DataTableColumn, type DataTableDensity, type DataTableLabels, type DataTableProps, type DataTableQuery, type DataTableSize, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, DateTimePicker, type DateTimePickerProps, date as DateUtils, Drawer, DropdownMenu, DropdownMenuItem, DropdownMenuSeparator, FallingIcons, FileUpload, type FileUploadProps, type FilterType, ForceInternalTranslationsProvider, Form, FormActions, FormCheckbox, FormControl, FormDescription, FormField, FormInput, FormItem, FormLabel, FormMessage, FormSubmitButton, GlobalLoading, GradientBadge, Grid, GridItem, type GridItemProps, type GridProps, ImageUpload, type ImageUploadProps, InlineLoading, Input, type InputProps, InteractiveBadge, Label, type LanguageOption, LanguageSwitcherHeadless as LanguageSwitcher, LanguageSwitcherHeadless, type LanguageSwitcherHeadlessProps, type LanguageSwitcherHeadlessProps as LanguageSwitcherProps, List, ListItem, LoadingBar, LoadingDots, LoadingProgress, LoadingSpinner, type LoadingState, type Locale$1 as Locale, MiniProgress, Modal, MonthYearPicker, MonthYearPicker as MonthYearPickerBase, type MonthYearPickerProps, MultiCombobox, type MultiComboboxOption, type MultiComboboxProps, MusicPlayer, MusicPlayer as MusicPlayerDefault, type MusicPlayerProps, NotificationBadge, NotificationModal, NumberInput, type NumberInputProps, OverlayControls, type OverlayControlsProps, OverlayScrollArea, type OverlayScrollAreaProps, OverlayScrollbarProvider, type OverlayScrollbarProviderProps, PageLoading, Pagination, type PaginationProps, PasswordInput, type PasswordInputProps, PillTabs, Popover, Progress, PulseBadge, RadioGroup, RadioGroupItem, SIZE_STYLES_BTN, ScrollArea, type ScrollAreaProps, SearchInput, type SearchInputProps, Section, SegmentedProgress, SelectDropdown, Sheet, SidebarSheet, SimplePagination, type SimplePaginationProps, SimpleTabs, Skeleton, SkeletonAvatar, SkeletonButton, SkeletonCard, SkeletonList, SkeletonMessage, SkeletonPost, SkeletonTable, SkeletonText, SlideOver, Slider, type SliderProps, SmartImage, type Song, type Sorter, StatusBadge, StepProgress, type SupportedLocale, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableHeaderProps, type TableProps, TableRow, Tabs, TagBadge, TagInput, TagInput as TagInputBase, type TagInputProps, Textarea, type TextareaProps, type ThemeMode, ThemeToggleHeadless as ThemeToggle, ThemeToggleHeadless, type ThemeToggleHeadlessProps, type ThemeToggleHeadlessProps as ThemeToggleProps, TimePicker, type TimePickerProps, Timeline, TimelineItem, ToastProvider, Tooltip, TranslationProvider, type TranslationProviderProps, type Translations, UEditor, type UEditorInlineUploadedItem, UEditorPrepareContentForSaveError, type UEditorPrepareContentForSaveOptions, type UEditorPrepareContentForSaveResult, type UEditorProps, type UEditorRef, type UEditorUploadImageForSave, type UEditorUploadImageForSaveResult, type UEditorVariant, type UnderverseLocale, UnderverseProvider, type UnderverseProviderProps, type UploadedFile, type UploadedImage, type UseOverlayScrollbarTargetOptions, VARIANT_STYLES_ALERT, VARIANT_STYLES_BTN, VIETNAM_HOLIDAYS, VerticalTabs, Watermark, type WatermarkProps, cn$1 as cn, cn as cnLocal, extractImageSrcsFromHtml, getAnimationStyles, getUnderverseMessages, injectAnimationStyles, loading, normalizeImageUrl, prepareUEditorContentForSave, shadcnAnimationStyles, underverseMessages, useFormField, useOverlayScrollbarTarget, useShadCNAnimations, useSmartLocale, useSmartTranslations, useToast, useTranslations as useUnderverseI18n, useLocale as useUnderverseI18nLocale, useUnderverseLocale, useUnderverseTranslations };
|
package/dist/index.d.ts
CHANGED
|
@@ -1803,10 +1803,24 @@ interface FileUploadProps {
|
|
|
1803
1803
|
declare function FileUpload({ onUpload, onRemove, onChange, uploadHandler, maxSize, // Default 50MB
|
|
1804
1804
|
maxFiles, accept, multiple, disabled, className, showFileList, variant, size, dragDropText, browseText, supportedFormatsText, showTypeIcons, allowPreview, initialFiles, }: FileUploadProps): react_jsx_runtime.JSX.Element;
|
|
1805
1805
|
|
|
1806
|
-
type AnimationVariant$1 = "slide" | "fade" | "scale";
|
|
1806
|
+
type AnimationVariant$1 = "slide" | "fade" | "scale" | "coverflow" | "stack";
|
|
1807
1807
|
type Orientation = "horizontal" | "vertical";
|
|
1808
|
+
type CarouselEffectPreset = "cinematic" | "gallery";
|
|
1809
|
+
interface CarouselEffectOptions {
|
|
1810
|
+
mainScale?: number;
|
|
1811
|
+
sideScale?: number;
|
|
1812
|
+
farScale?: number;
|
|
1813
|
+
sideOpacity?: number;
|
|
1814
|
+
farOpacity?: number;
|
|
1815
|
+
sideOffset?: number;
|
|
1816
|
+
rotate?: number;
|
|
1817
|
+
depthStep?: number;
|
|
1818
|
+
blur?: number;
|
|
1819
|
+
stackOffset?: number;
|
|
1820
|
+
stackLift?: number;
|
|
1821
|
+
}
|
|
1808
1822
|
interface CarouselProps {
|
|
1809
|
-
children: React$1.ReactNode
|
|
1823
|
+
children: React$1.ReactNode;
|
|
1810
1824
|
autoScroll?: boolean;
|
|
1811
1825
|
autoScrollInterval?: number;
|
|
1812
1826
|
animation?: AnimationVariant$1;
|
|
@@ -1824,8 +1838,10 @@ interface CarouselProps {
|
|
|
1824
1838
|
onSlideChange?: (index: number) => void;
|
|
1825
1839
|
thumbnailRenderer?: (child: React$1.ReactNode, index: number) => React$1.ReactNode;
|
|
1826
1840
|
ariaLabel?: string;
|
|
1841
|
+
effectPreset?: CarouselEffectPreset;
|
|
1842
|
+
effectOptions?: CarouselEffectOptions;
|
|
1827
1843
|
}
|
|
1828
|
-
declare function Carousel({ children, autoScroll, autoScrollInterval, animation, orientation, showArrows, showDots, showProgress, showThumbnails, loop, slidesToShow, slidesToScroll, className, containerClassName, slideClassName, onSlideChange, thumbnailRenderer, ariaLabel, }: CarouselProps): react_jsx_runtime.JSX.Element;
|
|
1844
|
+
declare function Carousel({ children, autoScroll, autoScrollInterval, animation, orientation, showArrows, showDots, showProgress, showThumbnails, loop, slidesToShow, slidesToScroll, className, containerClassName, slideClassName, onSlideChange, thumbnailRenderer, ariaLabel, effectPreset, effectOptions, }: CarouselProps): react_jsx_runtime.JSX.Element;
|
|
1829
1845
|
|
|
1830
1846
|
type IconComponent = React__default.ComponentType<{
|
|
1831
1847
|
className?: string;
|
|
@@ -4547,4 +4563,4 @@ declare function getUnderverseMessages(locale?: UnderverseLocale): {
|
|
|
4547
4563
|
};
|
|
4548
4564
|
};
|
|
4549
4565
|
|
|
4550
|
-
export { AccessDenied, type AccessDeniedProps, Alert, Avatar, Badge, Badge as BadgeBase, BatteryProgress, BottomSheet, Breadcrumb, Button, ButtonLoading, type ButtonProps, Calendar, type CalendarEvent, type CalendarHoliday, type CalendarProps, CalendarTimeline, type CalendarTimelineDateInput, type CalendarTimelineDayRangeMode, type CalendarTimelineEvent, type CalendarTimelineFormatters, type CalendarTimelineGroup, type CalendarTimelineInteractions, type CalendarTimelineLabels, type CalendarTimelineProps, type CalendarTimelineResource, type CalendarTimelineSize, type CalendarTimelineView, type CalendarTimelineVirtualization, Card, type CardProps, Carousel, type Category, CategoryTreeSelect, type CategoryTreeSelectBaseProps, type CategoryTreeSelectLabels, type CategoryTreeSelectMultiProps, type CategoryTreeSelectProps, type CategoryTreeSelectSingleProps, Checkbox, type CheckboxProps, CircularProgress, ClientOnly, ColorPicker, type ColorPickerProps, Combobox, type ComboboxOption, type ComboboxProps, CompactDatePicker, CompactPagination, type CompactPaginationProps, DataTable, type DataTableColumn, type DataTableDensity, type DataTableLabels, type DataTableProps, type DataTableQuery, type DataTableSize, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, DateTimePicker, type DateTimePickerProps, date as DateUtils, Drawer, DropdownMenu, DropdownMenuItem, DropdownMenuSeparator, FallingIcons, FileUpload, type FileUploadProps, type FilterType, ForceInternalTranslationsProvider, Form, FormActions, FormCheckbox, FormControl, FormDescription, FormField, FormInput, FormItem, FormLabel, FormMessage, FormSubmitButton, GlobalLoading, GradientBadge, Grid, GridItem, type GridItemProps, type GridProps, ImageUpload, type ImageUploadProps, InlineLoading, Input, type InputProps, InteractiveBadge, Label, type LanguageOption, LanguageSwitcherHeadless as LanguageSwitcher, LanguageSwitcherHeadless, type LanguageSwitcherHeadlessProps, type LanguageSwitcherHeadlessProps as LanguageSwitcherProps, List, ListItem, LoadingBar, LoadingDots, LoadingProgress, LoadingSpinner, type LoadingState, type Locale$1 as Locale, MiniProgress, Modal, MonthYearPicker, MonthYearPicker as MonthYearPickerBase, type MonthYearPickerProps, MultiCombobox, type MultiComboboxOption, type MultiComboboxProps, MusicPlayer, MusicPlayer as MusicPlayerDefault, type MusicPlayerProps, NotificationBadge, NotificationModal, NumberInput, type NumberInputProps, OverlayControls, type OverlayControlsProps, OverlayScrollArea, type OverlayScrollAreaProps, OverlayScrollbarProvider, type OverlayScrollbarProviderProps, PageLoading, Pagination, type PaginationProps, PasswordInput, type PasswordInputProps, PillTabs, Popover, Progress, PulseBadge, RadioGroup, RadioGroupItem, SIZE_STYLES_BTN, ScrollArea, type ScrollAreaProps, SearchInput, type SearchInputProps, Section, SegmentedProgress, SelectDropdown, Sheet, SidebarSheet, SimplePagination, type SimplePaginationProps, SimpleTabs, Skeleton, SkeletonAvatar, SkeletonButton, SkeletonCard, SkeletonList, SkeletonMessage, SkeletonPost, SkeletonTable, SkeletonText, SlideOver, Slider, type SliderProps, SmartImage, type Song, type Sorter, StatusBadge, StepProgress, type SupportedLocale, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableHeaderProps, type TableProps, TableRow, Tabs, TagBadge, TagInput, TagInput as TagInputBase, type TagInputProps, Textarea, type TextareaProps, type ThemeMode, ThemeToggleHeadless as ThemeToggle, ThemeToggleHeadless, type ThemeToggleHeadlessProps, type ThemeToggleHeadlessProps as ThemeToggleProps, TimePicker, type TimePickerProps, Timeline, TimelineItem, ToastProvider, Tooltip, TranslationProvider, type TranslationProviderProps, type Translations, UEditor, type UEditorInlineUploadedItem, UEditorPrepareContentForSaveError, type UEditorPrepareContentForSaveOptions, type UEditorPrepareContentForSaveResult, type UEditorProps, type UEditorRef, type UEditorUploadImageForSave, type UEditorUploadImageForSaveResult, type UEditorVariant, type UnderverseLocale, UnderverseProvider, type UnderverseProviderProps, type UploadedFile, type UploadedImage, type UseOverlayScrollbarTargetOptions, VARIANT_STYLES_ALERT, VARIANT_STYLES_BTN, VIETNAM_HOLIDAYS, VerticalTabs, Watermark, type WatermarkProps, cn$1 as cn, cn as cnLocal, extractImageSrcsFromHtml, getAnimationStyles, getUnderverseMessages, injectAnimationStyles, loading, normalizeImageUrl, prepareUEditorContentForSave, shadcnAnimationStyles, underverseMessages, useFormField, useOverlayScrollbarTarget, useShadCNAnimations, useSmartLocale, useSmartTranslations, useToast, useTranslations as useUnderverseI18n, useLocale as useUnderverseI18nLocale, useUnderverseLocale, useUnderverseTranslations };
|
|
4566
|
+
export { AccessDenied, type AccessDeniedProps, Alert, Avatar, Badge, Badge as BadgeBase, BatteryProgress, BottomSheet, Breadcrumb, Button, ButtonLoading, type ButtonProps, Calendar, type CalendarEvent, type CalendarHoliday, type CalendarProps, CalendarTimeline, type CalendarTimelineDateInput, type CalendarTimelineDayRangeMode, type CalendarTimelineEvent, type CalendarTimelineFormatters, type CalendarTimelineGroup, type CalendarTimelineInteractions, type CalendarTimelineLabels, type CalendarTimelineProps, type CalendarTimelineResource, type CalendarTimelineSize, type CalendarTimelineView, type CalendarTimelineVirtualization, Card, type CardProps, Carousel, type CarouselEffectOptions, type CarouselEffectPreset, type Category, CategoryTreeSelect, type CategoryTreeSelectBaseProps, type CategoryTreeSelectLabels, type CategoryTreeSelectMultiProps, type CategoryTreeSelectProps, type CategoryTreeSelectSingleProps, Checkbox, type CheckboxProps, CircularProgress, ClientOnly, ColorPicker, type ColorPickerProps, Combobox, type ComboboxOption, type ComboboxProps, CompactDatePicker, CompactPagination, type CompactPaginationProps, DataTable, type DataTableColumn, type DataTableDensity, type DataTableLabels, type DataTableProps, type DataTableQuery, type DataTableSize, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, DateTimePicker, type DateTimePickerProps, date as DateUtils, Drawer, DropdownMenu, DropdownMenuItem, DropdownMenuSeparator, FallingIcons, FileUpload, type FileUploadProps, type FilterType, ForceInternalTranslationsProvider, Form, FormActions, FormCheckbox, FormControl, FormDescription, FormField, FormInput, FormItem, FormLabel, FormMessage, FormSubmitButton, GlobalLoading, GradientBadge, Grid, GridItem, type GridItemProps, type GridProps, ImageUpload, type ImageUploadProps, InlineLoading, Input, type InputProps, InteractiveBadge, Label, type LanguageOption, LanguageSwitcherHeadless as LanguageSwitcher, LanguageSwitcherHeadless, type LanguageSwitcherHeadlessProps, type LanguageSwitcherHeadlessProps as LanguageSwitcherProps, List, ListItem, LoadingBar, LoadingDots, LoadingProgress, LoadingSpinner, type LoadingState, type Locale$1 as Locale, MiniProgress, Modal, MonthYearPicker, MonthYearPicker as MonthYearPickerBase, type MonthYearPickerProps, MultiCombobox, type MultiComboboxOption, type MultiComboboxProps, MusicPlayer, MusicPlayer as MusicPlayerDefault, type MusicPlayerProps, NotificationBadge, NotificationModal, NumberInput, type NumberInputProps, OverlayControls, type OverlayControlsProps, OverlayScrollArea, type OverlayScrollAreaProps, OverlayScrollbarProvider, type OverlayScrollbarProviderProps, PageLoading, Pagination, type PaginationProps, PasswordInput, type PasswordInputProps, PillTabs, Popover, Progress, PulseBadge, RadioGroup, RadioGroupItem, SIZE_STYLES_BTN, ScrollArea, type ScrollAreaProps, SearchInput, type SearchInputProps, Section, SegmentedProgress, SelectDropdown, Sheet, SidebarSheet, SimplePagination, type SimplePaginationProps, SimpleTabs, Skeleton, SkeletonAvatar, SkeletonButton, SkeletonCard, SkeletonList, SkeletonMessage, SkeletonPost, SkeletonTable, SkeletonText, SlideOver, Slider, type SliderProps, SmartImage, type Song, type Sorter, StatusBadge, StepProgress, type SupportedLocale, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableHeaderProps, type TableProps, TableRow, Tabs, TagBadge, TagInput, TagInput as TagInputBase, type TagInputProps, Textarea, type TextareaProps, type ThemeMode, ThemeToggleHeadless as ThemeToggle, ThemeToggleHeadless, type ThemeToggleHeadlessProps, type ThemeToggleHeadlessProps as ThemeToggleProps, TimePicker, type TimePickerProps, Timeline, TimelineItem, ToastProvider, Tooltip, TranslationProvider, type TranslationProviderProps, type Translations, UEditor, type UEditorInlineUploadedItem, UEditorPrepareContentForSaveError, type UEditorPrepareContentForSaveOptions, type UEditorPrepareContentForSaveResult, type UEditorProps, type UEditorRef, type UEditorUploadImageForSave, type UEditorUploadImageForSaveResult, type UEditorVariant, type UnderverseLocale, UnderverseProvider, type UnderverseProviderProps, type UploadedFile, type UploadedImage, type UseOverlayScrollbarTargetOptions, VARIANT_STYLES_ALERT, VARIANT_STYLES_BTN, VIETNAM_HOLIDAYS, VerticalTabs, Watermark, type WatermarkProps, cn$1 as cn, cn as cnLocal, extractImageSrcsFromHtml, getAnimationStyles, getUnderverseMessages, injectAnimationStyles, loading, normalizeImageUrl, prepareUEditorContentForSave, shadcnAnimationStyles, underverseMessages, useFormField, useOverlayScrollbarTarget, useShadCNAnimations, useSmartLocale, useSmartTranslations, useToast, useTranslations as useUnderverseI18n, useLocale as useUnderverseI18nLocale, useUnderverseLocale, useUnderverseTranslations };
|
package/dist/index.js
CHANGED
|
@@ -16182,20 +16182,92 @@ function Carousel({
|
|
|
16182
16182
|
slideClassName,
|
|
16183
16183
|
onSlideChange,
|
|
16184
16184
|
thumbnailRenderer,
|
|
16185
|
-
ariaLabel = "Carousel"
|
|
16185
|
+
ariaLabel = "Carousel",
|
|
16186
|
+
effectPreset,
|
|
16187
|
+
effectOptions
|
|
16186
16188
|
}) {
|
|
16187
16189
|
const [currentIndex, setCurrentIndex] = React42.useState(0);
|
|
16188
16190
|
const [isPaused, setIsPaused] = React42.useState(false);
|
|
16189
|
-
const [isDragging, setIsDragging] = React42.useState(false);
|
|
16190
|
-
const [startPos, setStartPos] = React42.useState(0);
|
|
16191
|
-
const [currentTranslate, setCurrentTranslate] = React42.useState(0);
|
|
16192
|
-
const [prevTranslate, setPrevTranslate] = React42.useState(0);
|
|
16193
16191
|
const progressElRef = React42.useRef(null);
|
|
16194
16192
|
const carouselRef = React42.useRef(null);
|
|
16195
16193
|
const rafRef = React42.useRef(null);
|
|
16196
|
-
const
|
|
16197
|
-
const
|
|
16194
|
+
const isDraggingRef = React42.useRef(false);
|
|
16195
|
+
const startPosRef = React42.useRef(0);
|
|
16196
|
+
const lastDragPositionRef = React42.useRef(0);
|
|
16197
|
+
const slides = React42.useMemo(() => React42.Children.toArray(children), [children]);
|
|
16198
|
+
const totalSlides = slides.length;
|
|
16198
16199
|
const isHorizontal = orientation === "horizontal";
|
|
16200
|
+
const effectiveAnimation = slidesToShow > 1 && !["slide", "coverflow", "stack"].includes(animation) ? "slide" : animation;
|
|
16201
|
+
const isDeckAnimation = effectiveAnimation === "coverflow" || effectiveAnimation === "stack";
|
|
16202
|
+
const effectiveSlidesToShow = isDeckAnimation ? 1 : slidesToShow;
|
|
16203
|
+
const maxIndex = Math.max(0, totalSlides - effectiveSlidesToShow);
|
|
16204
|
+
const presetEffectOptions = React42.useMemo(() => {
|
|
16205
|
+
if (effectPreset === "cinematic") {
|
|
16206
|
+
return effectiveAnimation === "stack" ? {
|
|
16207
|
+
mainScale: 1.08,
|
|
16208
|
+
sideScale: 0.9,
|
|
16209
|
+
farScale: 0.84,
|
|
16210
|
+
sideOpacity: 0.68,
|
|
16211
|
+
farOpacity: 0.3,
|
|
16212
|
+
depthStep: 76,
|
|
16213
|
+
blur: 2.2,
|
|
16214
|
+
stackOffset: 16,
|
|
16215
|
+
stackLift: 16
|
|
16216
|
+
} : {
|
|
16217
|
+
mainScale: 1.12,
|
|
16218
|
+
sideScale: 0.82,
|
|
16219
|
+
farScale: 0.72,
|
|
16220
|
+
sideOpacity: 0.72,
|
|
16221
|
+
farOpacity: 0.24,
|
|
16222
|
+
sideOffset: 22,
|
|
16223
|
+
rotate: 20,
|
|
16224
|
+
depthStep: 120,
|
|
16225
|
+
blur: 2.6
|
|
16226
|
+
};
|
|
16227
|
+
}
|
|
16228
|
+
if (effectPreset === "gallery") {
|
|
16229
|
+
return effectiveAnimation === "stack" ? {
|
|
16230
|
+
mainScale: 1.03,
|
|
16231
|
+
sideScale: 0.94,
|
|
16232
|
+
farScale: 0.88,
|
|
16233
|
+
sideOpacity: 0.82,
|
|
16234
|
+
farOpacity: 0.5,
|
|
16235
|
+
depthStep: 50,
|
|
16236
|
+
blur: 0.8,
|
|
16237
|
+
stackOffset: 24,
|
|
16238
|
+
stackLift: 8
|
|
16239
|
+
} : {
|
|
16240
|
+
mainScale: 1.05,
|
|
16241
|
+
sideScale: 0.9,
|
|
16242
|
+
farScale: 0.82,
|
|
16243
|
+
sideOpacity: 0.84,
|
|
16244
|
+
farOpacity: 0.48,
|
|
16245
|
+
sideOffset: 30,
|
|
16246
|
+
rotate: 16,
|
|
16247
|
+
depthStep: 78,
|
|
16248
|
+
blur: 1
|
|
16249
|
+
};
|
|
16250
|
+
}
|
|
16251
|
+
return {};
|
|
16252
|
+
}, [effectPreset, effectiveAnimation]);
|
|
16253
|
+
const mergedEffectOptions = React42.useMemo(
|
|
16254
|
+
() => ({
|
|
16255
|
+
mainScale: 1.04,
|
|
16256
|
+
sideScale: effectiveAnimation === "stack" ? 0.93 : 0.88,
|
|
16257
|
+
farScale: effectiveAnimation === "stack" ? 0.86 : 0.76,
|
|
16258
|
+
sideOpacity: effectiveAnimation === "stack" ? 0.74 : 0.78,
|
|
16259
|
+
farOpacity: effectiveAnimation === "stack" ? 0.42 : 0.38,
|
|
16260
|
+
sideOffset: effectiveAnimation === "stack" ? 20 : 28,
|
|
16261
|
+
rotate: 24,
|
|
16262
|
+
depthStep: effectiveAnimation === "stack" ? 60 : 90,
|
|
16263
|
+
blur: 1.5,
|
|
16264
|
+
stackOffset: 20,
|
|
16265
|
+
stackLift: 12,
|
|
16266
|
+
...presetEffectOptions,
|
|
16267
|
+
...effectOptions
|
|
16268
|
+
}),
|
|
16269
|
+
[effectOptions, effectiveAnimation, presetEffectOptions]
|
|
16270
|
+
);
|
|
16199
16271
|
const scrollPrev = React42.useCallback(() => {
|
|
16200
16272
|
setCurrentIndex((prev) => {
|
|
16201
16273
|
if (prev === 0) {
|
|
@@ -16218,8 +16290,8 @@ function Carousel({
|
|
|
16218
16290
|
},
|
|
16219
16291
|
[maxIndex]
|
|
16220
16292
|
);
|
|
16221
|
-
React42.
|
|
16222
|
-
|
|
16293
|
+
const handleKeyDown = React42.useCallback(
|
|
16294
|
+
(e) => {
|
|
16223
16295
|
if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
|
|
16224
16296
|
e.preventDefault();
|
|
16225
16297
|
scrollPrev();
|
|
@@ -16233,13 +16305,9 @@ function Carousel({
|
|
|
16233
16305
|
e.preventDefault();
|
|
16234
16306
|
scrollTo(maxIndex);
|
|
16235
16307
|
}
|
|
16236
|
-
}
|
|
16237
|
-
|
|
16238
|
-
|
|
16239
|
-
carousel.addEventListener("keydown", handleKeyDown);
|
|
16240
|
-
return () => carousel.removeEventListener("keydown", handleKeyDown);
|
|
16241
|
-
}
|
|
16242
|
-
}, [scrollPrev, scrollNext, scrollTo, maxIndex]);
|
|
16308
|
+
},
|
|
16309
|
+
[scrollPrev, scrollNext, scrollTo, maxIndex]
|
|
16310
|
+
);
|
|
16243
16311
|
React42.useEffect(() => {
|
|
16244
16312
|
const stop = () => {
|
|
16245
16313
|
if (rafRef.current != null) {
|
|
@@ -16248,7 +16316,7 @@ function Carousel({
|
|
|
16248
16316
|
}
|
|
16249
16317
|
if (progressElRef.current) progressElRef.current.style.width = "0%";
|
|
16250
16318
|
};
|
|
16251
|
-
if (!autoScroll || isPaused || totalSlides <=
|
|
16319
|
+
if (!autoScroll || isPaused || totalSlides <= effectiveSlidesToShow) {
|
|
16252
16320
|
stop();
|
|
16253
16321
|
return;
|
|
16254
16322
|
}
|
|
@@ -16267,7 +16335,7 @@ function Carousel({
|
|
|
16267
16335
|
};
|
|
16268
16336
|
rafRef.current = requestAnimationFrame(tick);
|
|
16269
16337
|
return stop;
|
|
16270
|
-
}, [autoScroll, isPaused, totalSlides,
|
|
16338
|
+
}, [autoScroll, isPaused, totalSlides, effectiveSlidesToShow, autoScrollInterval, scrollNext]);
|
|
16271
16339
|
const getPositionX = (event) => {
|
|
16272
16340
|
return event.type.includes("mouse") ? event.pageX : event.touches[0].clientX;
|
|
16273
16341
|
};
|
|
@@ -16275,60 +16343,100 @@ function Carousel({
|
|
|
16275
16343
|
return event.type.includes("mouse") ? event.pageY : event.touches[0].clientY;
|
|
16276
16344
|
};
|
|
16277
16345
|
const touchStart = (event) => {
|
|
16278
|
-
|
|
16346
|
+
isDraggingRef.current = true;
|
|
16279
16347
|
const pos = isHorizontal ? getPositionX(event.nativeEvent) : getPositionY(event.nativeEvent);
|
|
16280
|
-
|
|
16281
|
-
|
|
16348
|
+
startPosRef.current = pos;
|
|
16349
|
+
lastDragPositionRef.current = pos;
|
|
16282
16350
|
};
|
|
16283
16351
|
const touchMove = (event) => {
|
|
16284
|
-
if (!
|
|
16352
|
+
if (!isDraggingRef.current) return;
|
|
16285
16353
|
const pos = isHorizontal ? getPositionX(event.nativeEvent) : getPositionY(event.nativeEvent);
|
|
16286
|
-
|
|
16287
|
-
setCurrentTranslate(prevTranslate + currentPosition - startPos);
|
|
16354
|
+
lastDragPositionRef.current = pos;
|
|
16288
16355
|
};
|
|
16289
16356
|
const touchEnd = () => {
|
|
16290
|
-
if (!
|
|
16291
|
-
|
|
16292
|
-
const movedBy =
|
|
16357
|
+
if (!isDraggingRef.current) return;
|
|
16358
|
+
isDraggingRef.current = false;
|
|
16359
|
+
const movedBy = lastDragPositionRef.current - startPosRef.current;
|
|
16293
16360
|
const threshold = 50;
|
|
16294
|
-
if (movedBy < -threshold
|
|
16361
|
+
if (movedBy < -threshold) {
|
|
16295
16362
|
scrollNext();
|
|
16296
|
-
} else if (movedBy > threshold
|
|
16363
|
+
} else if (movedBy > threshold) {
|
|
16297
16364
|
scrollPrev();
|
|
16298
16365
|
}
|
|
16299
|
-
|
|
16300
|
-
|
|
16366
|
+
startPosRef.current = 0;
|
|
16367
|
+
lastDragPositionRef.current = 0;
|
|
16301
16368
|
};
|
|
16302
16369
|
React42.useEffect(() => {
|
|
16303
16370
|
onSlideChange?.(currentIndex);
|
|
16304
16371
|
}, [currentIndex, onSlideChange]);
|
|
16305
16372
|
const getAnimationStyles2 = () => {
|
|
16306
|
-
|
|
16307
|
-
|
|
16308
|
-
return {
|
|
16309
|
-
transition: "opacity 500ms ease-in-out"
|
|
16310
|
-
};
|
|
16311
|
-
}
|
|
16312
|
-
if (animation === "scale") {
|
|
16313
|
-
return {
|
|
16314
|
-
transform: baseTransform,
|
|
16315
|
-
transition: "transform 500ms ease-in-out, scale 500ms ease-in-out"
|
|
16316
|
-
};
|
|
16373
|
+
if (effectiveAnimation !== "slide") {
|
|
16374
|
+
return {};
|
|
16317
16375
|
}
|
|
16376
|
+
const baseTransform = isHorizontal ? `translateX(-${currentIndex * (100 / effectiveSlidesToShow)}%)` : `translateY(-${currentIndex * (100 / effectiveSlidesToShow)}%)`;
|
|
16318
16377
|
return {
|
|
16319
16378
|
transform: baseTransform,
|
|
16320
|
-
transition:
|
|
16379
|
+
transition: "transform 500ms ease-in-out"
|
|
16321
16380
|
};
|
|
16322
16381
|
};
|
|
16323
|
-
const slideWidth = 100 /
|
|
16382
|
+
const slideWidth = 100 / effectiveSlidesToShow;
|
|
16383
|
+
const getLoopDistance = React42.useCallback(
|
|
16384
|
+
(index) => {
|
|
16385
|
+
if (totalSlides <= 0) return 0;
|
|
16386
|
+
const forward = index - currentIndex;
|
|
16387
|
+
if (!loop) return forward;
|
|
16388
|
+
const altForward = forward - totalSlides;
|
|
16389
|
+
const altBackward = forward + totalSlides;
|
|
16390
|
+
const candidates = [forward, altForward, altBackward];
|
|
16391
|
+
return candidates.reduce((best, candidate) => Math.abs(candidate) < Math.abs(best) ? candidate : best, candidates[0] ?? 0);
|
|
16392
|
+
},
|
|
16393
|
+
[currentIndex, loop, totalSlides]
|
|
16394
|
+
);
|
|
16395
|
+
const getDeckSlideStyles = React42.useCallback(
|
|
16396
|
+
(index) => {
|
|
16397
|
+
const distance = getLoopDistance(index);
|
|
16398
|
+
const absDistance = Math.abs(distance);
|
|
16399
|
+
const hidden = absDistance > 2;
|
|
16400
|
+
if (hidden) {
|
|
16401
|
+
return {
|
|
16402
|
+
opacity: 0,
|
|
16403
|
+
pointerEvents: "none",
|
|
16404
|
+
transform: `translate3d(0, 0, -${mergedEffectOptions.depthStep * 2}px) scale(${mergedEffectOptions.farScale})`,
|
|
16405
|
+
filter: `blur(${mergedEffectOptions.blur * 1.4}px)`
|
|
16406
|
+
};
|
|
16407
|
+
}
|
|
16408
|
+
if (effectiveAnimation === "stack") {
|
|
16409
|
+
const xOffset2 = distance * mergedEffectOptions.stackOffset;
|
|
16410
|
+
const yOffset = absDistance * mergedEffectOptions.stackLift;
|
|
16411
|
+
const scale2 = distance === 0 ? mergedEffectOptions.mainScale : distance === 1 || distance === -1 ? mergedEffectOptions.sideScale : mergedEffectOptions.farScale;
|
|
16412
|
+
return {
|
|
16413
|
+
opacity: distance === 0 ? 1 : distance === 1 || distance === -1 ? mergedEffectOptions.sideOpacity : mergedEffectOptions.farOpacity,
|
|
16414
|
+
transform: `translate3d(${xOffset2}px, ${yOffset}px, -${absDistance * mergedEffectOptions.depthStep}px) scale(${scale2})`,
|
|
16415
|
+
filter: distance === 0 ? "blur(0px)" : `blur(${Math.min(absDistance, 2) * mergedEffectOptions.blur}px)`,
|
|
16416
|
+
pointerEvents: distance === 0 ? "auto" : "none"
|
|
16417
|
+
};
|
|
16418
|
+
}
|
|
16419
|
+
const xOffset = distance * mergedEffectOptions.sideOffset;
|
|
16420
|
+
const rotateY = distance * -mergedEffectOptions.rotate;
|
|
16421
|
+
const scale = distance === 0 ? mergedEffectOptions.mainScale : distance === 1 || distance === -1 ? mergedEffectOptions.sideScale : mergedEffectOptions.farScale;
|
|
16422
|
+
return {
|
|
16423
|
+
opacity: distance === 0 ? 1 : distance === 1 || distance === -1 ? mergedEffectOptions.sideOpacity : mergedEffectOptions.farOpacity,
|
|
16424
|
+
transform: `translate3d(${xOffset}%, 0, -${absDistance * mergedEffectOptions.depthStep}px) rotateY(${rotateY}deg) scale(${scale})`,
|
|
16425
|
+
filter: distance === 0 ? "blur(0px)" : `blur(${Math.min(absDistance, 2) * mergedEffectOptions.blur}px)`,
|
|
16426
|
+
pointerEvents: distance === 0 ? "auto" : "none"
|
|
16427
|
+
};
|
|
16428
|
+
},
|
|
16429
|
+
[effectiveAnimation, getLoopDistance, mergedEffectOptions]
|
|
16430
|
+
);
|
|
16324
16431
|
return /* @__PURE__ */ jsxs41(
|
|
16325
16432
|
"div",
|
|
16326
16433
|
{
|
|
16327
16434
|
ref: carouselRef,
|
|
16328
16435
|
className: cn(
|
|
16329
|
-
"relative w-full overflow-hidden focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 rounded-
|
|
16436
|
+
"relative w-full overflow-hidden focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 rounded-xl md:rounded-3xl",
|
|
16330
16437
|
className
|
|
16331
16438
|
),
|
|
16439
|
+
onKeyDown: handleKeyDown,
|
|
16332
16440
|
onMouseEnter: () => setIsPaused(true),
|
|
16333
16441
|
onMouseLeave: () => setIsPaused(false),
|
|
16334
16442
|
role: "region",
|
|
@@ -16340,8 +16448,14 @@ function Carousel({
|
|
|
16340
16448
|
/* @__PURE__ */ jsx49(
|
|
16341
16449
|
"div",
|
|
16342
16450
|
{
|
|
16343
|
-
className: cn(
|
|
16344
|
-
|
|
16451
|
+
className: cn(
|
|
16452
|
+
effectiveAnimation === "slide" ? "flex" : "grid",
|
|
16453
|
+
effectiveAnimation === "slide" && (isHorizontal ? "flex-row" : "flex-col"),
|
|
16454
|
+
isDeckAnimation && "place-items-center [transform-style:preserve-3d]",
|
|
16455
|
+
isHorizontal ? "touch-pan-y" : "touch-pan-x",
|
|
16456
|
+
containerClassName
|
|
16457
|
+
),
|
|
16458
|
+
style: isDeckAnimation ? { perspective: "1400px" } : getAnimationStyles2(),
|
|
16345
16459
|
onTouchStart: touchStart,
|
|
16346
16460
|
onTouchMove: touchMove,
|
|
16347
16461
|
onTouchEnd: touchEnd,
|
|
@@ -16352,30 +16466,30 @@ function Carousel({
|
|
|
16352
16466
|
role: "group",
|
|
16353
16467
|
"aria-atomic": "false",
|
|
16354
16468
|
"aria-live": autoScroll ? "off" : "polite",
|
|
16355
|
-
children:
|
|
16469
|
+
children: slides.map((child, idx) => /* @__PURE__ */ jsx49(
|
|
16356
16470
|
"div",
|
|
16357
16471
|
{
|
|
16358
16472
|
className: cn(
|
|
16359
16473
|
"shrink-0",
|
|
16360
|
-
isHorizontal ? "h-full" : "w-full",
|
|
16361
|
-
|
|
16362
|
-
|
|
16474
|
+
effectiveAnimation === "slide" ? isHorizontal ? "h-full" : "w-full" : "col-start-1 row-start-1",
|
|
16475
|
+
effectiveAnimation === "fade" && (idx === currentIndex ? "opacity-100 z-10" : "opacity-0 pointer-events-none z-0"),
|
|
16476
|
+
effectiveAnimation === "scale" && (idx === currentIndex ? "opacity-100 scale-100 z-10" : "opacity-0 scale-95 pointer-events-none z-0"),
|
|
16477
|
+
isDeckAnimation && "w-full max-w-[78%] md:max-w-[72%] transition-[opacity,transform] duration-500 ease-out",
|
|
16478
|
+
effectiveAnimation !== "slide" && "transition-[opacity,transform] duration-500 ease-in-out",
|
|
16363
16479
|
slideClassName
|
|
16364
16480
|
),
|
|
16365
|
-
style: {
|
|
16366
|
-
[isHorizontal ? "width" : "height"]: `${slideWidth}%`
|
|
16367
|
-
},
|
|
16481
|
+
style: effectiveAnimation === "slide" ? { [isHorizontal ? "width" : "height"]: `${slideWidth}%` } : isDeckAnimation ? getDeckSlideStyles(idx) : void 0,
|
|
16368
16482
|
role: "group",
|
|
16369
16483
|
"aria-roledescription": "slide",
|
|
16370
16484
|
"aria-label": `${idx + 1} of ${totalSlides}`,
|
|
16371
|
-
"aria-hidden": idx < currentIndex || idx >= currentIndex + slidesToShow,
|
|
16485
|
+
"aria-hidden": effectiveAnimation === "slide" ? idx < currentIndex || idx >= currentIndex + slidesToShow : idx !== currentIndex,
|
|
16372
16486
|
children: child
|
|
16373
16487
|
},
|
|
16374
|
-
idx
|
|
16488
|
+
React42.isValidElement(child) && child.key || idx
|
|
16375
16489
|
))
|
|
16376
16490
|
}
|
|
16377
16491
|
),
|
|
16378
|
-
showArrows && totalSlides >
|
|
16492
|
+
showArrows && totalSlides > effectiveSlidesToShow && /* @__PURE__ */ jsxs41(Fragment17, { children: [
|
|
16379
16493
|
/* @__PURE__ */ jsx49(
|
|
16380
16494
|
Button_default,
|
|
16381
16495
|
{
|
|
@@ -16387,7 +16501,8 @@ function Carousel({
|
|
|
16387
16501
|
disabled: !loop && currentIndex === 0,
|
|
16388
16502
|
className: cn(
|
|
16389
16503
|
"absolute top-1/2 -translate-y-1/2 hover:-translate-y-1/2 active:-translate-y-1/2 z-10 rounded-full will-change-transform backdrop-blur-0 hover:backdrop-blur-0 hover:bg-transparent border-0",
|
|
16390
|
-
|
|
16504
|
+
"max-md:h-8 max-md:w-8 max-md:border max-md:border-border/60 max-md:bg-background/75 max-md:backdrop-blur-sm max-md:shadow-sm",
|
|
16505
|
+
isHorizontal ? "left-4 max-md:left-2" : "top-4 left-1/2 -translate-x-1/2 rotate-90 max-md:top-2"
|
|
16391
16506
|
),
|
|
16392
16507
|
"aria-label": "Previous slide"
|
|
16393
16508
|
}
|
|
@@ -16403,18 +16518,19 @@ function Carousel({
|
|
|
16403
16518
|
disabled: !loop && currentIndex >= maxIndex,
|
|
16404
16519
|
className: cn(
|
|
16405
16520
|
"absolute top-1/2 -translate-y-1/2 hover:-translate-y-1/2 active:-translate-y-1/2 z-10 rounded-full will-change-transform backdrop-blur-0 hover:backdrop-blur-0 hover:bg-transparent border-0",
|
|
16406
|
-
|
|
16521
|
+
"max-md:h-8 max-md:w-8 max-md:border max-md:border-border/60 max-md:bg-background/75 max-md:backdrop-blur-sm max-md:shadow-sm",
|
|
16522
|
+
isHorizontal ? "right-4 max-md:right-2" : "bottom-4 left-1/2 -translate-x-1/2 rotate-90 max-md:bottom-2"
|
|
16407
16523
|
),
|
|
16408
16524
|
"aria-label": "Next slide"
|
|
16409
16525
|
}
|
|
16410
16526
|
)
|
|
16411
16527
|
] }),
|
|
16412
|
-
showDots && totalSlides >
|
|
16528
|
+
showDots && totalSlides > effectiveSlidesToShow && /* @__PURE__ */ jsx49(
|
|
16413
16529
|
"div",
|
|
16414
16530
|
{
|
|
16415
16531
|
className: cn(
|
|
16416
16532
|
"absolute flex gap-2 z-10",
|
|
16417
|
-
isHorizontal ? "bottom-4 left-1/2 -translate-x-1/2 flex-row" : "right-4 top-1/2 -translate-y-1/2 flex-col"
|
|
16533
|
+
isHorizontal ? "bottom-4 left-1/2 -translate-x-1/2 flex-row max-md:bottom-2" : "right-4 top-1/2 -translate-y-1/2 flex-col max-md:right-2"
|
|
16418
16534
|
),
|
|
16419
16535
|
role: "tablist",
|
|
16420
16536
|
"aria-label": "Carousel pagination",
|
|
@@ -16424,8 +16540,9 @@ function Carousel({
|
|
|
16424
16540
|
onClick: () => scrollTo(idx),
|
|
16425
16541
|
className: cn(
|
|
16426
16542
|
"rounded-full transition-all focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2",
|
|
16543
|
+
"max-md:w-1.5 max-md:h-1.5",
|
|
16427
16544
|
isHorizontal ? "w-2 h-2" : "w-2 h-2",
|
|
16428
|
-
idx === currentIndex ? `bg-primary ${isHorizontal ? "w-6" : "h-6"}` : "bg-muted-foreground/50 hover:bg-muted-foreground/75"
|
|
16545
|
+
idx === currentIndex ? `bg-primary ${isHorizontal ? "w-6 max-md:w-4" : "h-6 max-md:h-4"}` : "bg-muted-foreground/50 hover:bg-muted-foreground/75"
|
|
16429
16546
|
),
|
|
16430
16547
|
"aria-label": `Go to slide ${idx + 1}`,
|
|
16431
16548
|
"aria-selected": idx === currentIndex,
|
|
@@ -16435,11 +16552,12 @@ function Carousel({
|
|
|
16435
16552
|
))
|
|
16436
16553
|
}
|
|
16437
16554
|
),
|
|
16438
|
-
showThumbnails && totalSlides >
|
|
16555
|
+
showThumbnails && totalSlides > effectiveSlidesToShow && /* @__PURE__ */ jsx49(
|
|
16439
16556
|
"div",
|
|
16440
16557
|
{
|
|
16441
16558
|
className: cn(
|
|
16442
16559
|
"absolute bottom-0 left-0 right-0 flex gap-2 p-4 bg-linear-to-t from-black/50 to-transparent overflow-x-auto",
|
|
16560
|
+
"max-md:gap-1.5 max-md:p-2",
|
|
16443
16561
|
isHorizontal ? "flex-row" : "flex-col"
|
|
16444
16562
|
),
|
|
16445
16563
|
children: React42.Children.map(children, (child, idx) => /* @__PURE__ */ jsx49(
|
|
@@ -16448,7 +16566,8 @@ function Carousel({
|
|
|
16448
16566
|
onClick: () => scrollTo(idx),
|
|
16449
16567
|
className: cn(
|
|
16450
16568
|
"shrink-0 w-16 h-16 rounded-lg overflow-hidden border-2 transition-all focus:outline-none focus:ring-2 focus:ring-primary",
|
|
16451
|
-
|
|
16569
|
+
"max-md:w-12 max-md:h-12",
|
|
16570
|
+
idx === currentIndex ? "border-primary md:scale-110" : "border-transparent opacity-70 hover:opacity-100"
|
|
16452
16571
|
),
|
|
16453
16572
|
"aria-label": `Thumbnail ${idx + 1}`,
|
|
16454
16573
|
children: thumbnailRenderer ? thumbnailRenderer(child, idx) : child
|
|
@@ -20791,7 +20910,7 @@ function useLocale() {
|
|
|
20791
20910
|
}
|
|
20792
20911
|
|
|
20793
20912
|
// src/components/UEditor/UEditor.tsx
|
|
20794
|
-
import React71, { useEffect as useEffect34, useImperativeHandle as useImperativeHandle3, useMemo as
|
|
20913
|
+
import React71, { useEffect as useEffect34, useImperativeHandle as useImperativeHandle3, useMemo as useMemo23, useRef as useRef30 } from "react";
|
|
20795
20914
|
import { useEditor, EditorContent } from "@tiptap/react";
|
|
20796
20915
|
|
|
20797
20916
|
// src/components/UEditor/extensions.ts
|
|
@@ -22605,12 +22724,12 @@ import {
|
|
|
22605
22724
|
} from "lucide-react";
|
|
22606
22725
|
|
|
22607
22726
|
// src/components/UEditor/colors.tsx
|
|
22608
|
-
import { useMemo as
|
|
22727
|
+
import { useMemo as useMemo20 } from "react";
|
|
22609
22728
|
import { X as X17 } from "lucide-react";
|
|
22610
22729
|
import { jsx as jsx74, jsxs as jsxs64 } from "react/jsx-runtime";
|
|
22611
22730
|
var useEditorColors = () => {
|
|
22612
22731
|
const t = useSmartTranslations("UEditor");
|
|
22613
|
-
const textColors =
|
|
22732
|
+
const textColors = useMemo20(
|
|
22614
22733
|
() => [
|
|
22615
22734
|
{ name: t("colors.default"), color: "inherit", cssClass: "text-foreground" },
|
|
22616
22735
|
{ name: t("colors.muted"), color: "var(--muted-foreground)", cssClass: "text-muted-foreground" },
|
|
@@ -22623,7 +22742,7 @@ var useEditorColors = () => {
|
|
|
22623
22742
|
],
|
|
22624
22743
|
[t]
|
|
22625
22744
|
);
|
|
22626
|
-
const highlightColors =
|
|
22745
|
+
const highlightColors = useMemo20(
|
|
22627
22746
|
() => [
|
|
22628
22747
|
{ name: t("colors.default"), color: "", cssClass: "" },
|
|
22629
22748
|
{ name: t("colors.muted"), color: "var(--muted)", cssClass: "bg-muted" },
|
|
@@ -22769,7 +22888,7 @@ var ImageInput = ({ onSubmit, onCancel }) => {
|
|
|
22769
22888
|
};
|
|
22770
22889
|
|
|
22771
22890
|
// src/components/UEditor/emoji-picker.tsx
|
|
22772
|
-
import { useState as useState43, useMemo as
|
|
22891
|
+
import { useState as useState43, useMemo as useMemo21, useRef as useRef27, useEffect as useEffect32 } from "react";
|
|
22773
22892
|
import { Search as Search6, X as X19, Smile as Smile2, Leaf, Utensils, Dumbbell, Lightbulb, Hash, Flag } from "lucide-react";
|
|
22774
22893
|
import { jsx as jsx76, jsxs as jsxs66 } from "react/jsx-runtime";
|
|
22775
22894
|
var CATEGORY_ICONS = {
|
|
@@ -22788,7 +22907,7 @@ var EmojiPicker = ({ onSelect, onClose }) => {
|
|
|
22788
22907
|
const scrollContainerRef = useRef27(null);
|
|
22789
22908
|
const categoryRefs = useRef27({});
|
|
22790
22909
|
const isUserScrolling = useRef27(false);
|
|
22791
|
-
const filteredCategories =
|
|
22910
|
+
const filteredCategories = useMemo21(() => {
|
|
22792
22911
|
if (!search.trim()) return EMOJI_LIST;
|
|
22793
22912
|
const query = search.toLowerCase();
|
|
22794
22913
|
return EMOJI_LIST.map((category) => ({
|
|
@@ -23450,7 +23569,7 @@ var EditorToolbar = ({
|
|
|
23450
23569
|
};
|
|
23451
23570
|
|
|
23452
23571
|
// src/components/UEditor/menus.tsx
|
|
23453
|
-
import React70, { useCallback as useCallback17, useEffect as useEffect33, useMemo as
|
|
23572
|
+
import React70, { useCallback as useCallback17, useEffect as useEffect33, useMemo as useMemo22, useRef as useRef29, useState as useState45 } from "react";
|
|
23454
23573
|
import { createPortal as createPortal8 } from "react-dom";
|
|
23455
23574
|
import {
|
|
23456
23575
|
Bold as BoldIcon2,
|
|
@@ -23494,7 +23613,7 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
|
|
|
23494
23613
|
const t = useSmartTranslations("UEditor");
|
|
23495
23614
|
const [selectedIndex, setSelectedIndex] = useResettingIndex4(filterText);
|
|
23496
23615
|
const menuRef = useRef29(null);
|
|
23497
|
-
const allCommands =
|
|
23616
|
+
const allCommands = useMemo22(
|
|
23498
23617
|
() => [
|
|
23499
23618
|
{
|
|
23500
23619
|
icon: Type3,
|
|
@@ -23565,7 +23684,7 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
|
|
|
23565
23684
|
],
|
|
23566
23685
|
[editor, t]
|
|
23567
23686
|
);
|
|
23568
|
-
const commands =
|
|
23687
|
+
const commands = useMemo22(() => {
|
|
23569
23688
|
if (!filterText) return allCommands;
|
|
23570
23689
|
const lowerFilter = filterText.toLowerCase();
|
|
23571
23690
|
return allCommands.filter((cmd) => cmd.label.toLowerCase().includes(lowerFilter) || cmd.description.toLowerCase().includes(lowerFilter));
|
|
@@ -24201,7 +24320,7 @@ var UEditor = React71.forwardRef(({
|
|
|
24201
24320
|
const t = useSmartTranslations("UEditor");
|
|
24202
24321
|
const effectivePlaceholder = placeholder ?? t("placeholder");
|
|
24203
24322
|
const inFlightPrepareRef = useRef30(null);
|
|
24204
|
-
const extensions =
|
|
24323
|
+
const extensions = useMemo23(
|
|
24205
24324
|
() => buildUEditorExtensions({ placeholder: effectivePlaceholder, translate: t, maxCharacters, uploadImage, imageInsertMode, editable }),
|
|
24206
24325
|
[effectivePlaceholder, t, maxCharacters, uploadImage, imageInsertMode, editable]
|
|
24207
24326
|
);
|