@lumx/react 3.8.1-alpha.0 → 3.8.1

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.
Files changed (31) hide show
  1. package/index.d.ts +6 -63
  2. package/index.js +559 -1292
  3. package/index.js.map +1 -1
  4. package/package.json +3 -3
  5. package/src/components/image-block/ImageBlock.test.tsx +28 -0
  6. package/src/components/image-block/ImageBlock.tsx +5 -1
  7. package/src/components/image-block/ImageCaption.tsx +54 -8
  8. package/src/components/thumbnail/useFocusPointStyle.tsx +4 -3
  9. package/src/index.ts +0 -1
  10. package/src/utils/type.ts +0 -15
  11. package/src/components/image-lightbox/ImageLightbox.stories.tsx +0 -165
  12. package/src/components/image-lightbox/ImageLightbox.test.tsx +0 -253
  13. package/src/components/image-lightbox/ImageLightbox.tsx +0 -72
  14. package/src/components/image-lightbox/constants.ts +0 -11
  15. package/src/components/image-lightbox/index.ts +0 -2
  16. package/src/components/image-lightbox/internal/ImageSlide.tsx +0 -107
  17. package/src/components/image-lightbox/internal/ImageSlideshow.tsx +0 -173
  18. package/src/components/image-lightbox/internal/useAnimateScroll.ts +0 -55
  19. package/src/components/image-lightbox/internal/usePointerZoom.ts +0 -148
  20. package/src/components/image-lightbox/types.ts +0 -50
  21. package/src/components/image-lightbox/useImageLightbox.tsx +0 -130
  22. package/src/hooks/useElementSizeDependentOfWindowSize.ts +0 -32
  23. package/src/hooks/useImageSize.ts +0 -17
  24. package/src/stories/generated/ImageLightbox/Demos.stories.tsx +0 -6
  25. package/src/utils/DOM/findImage.tsx +0 -3
  26. package/src/utils/DOM/startViewTransition.ts +0 -56
  27. package/src/utils/browser/getPrefersReducedMotion.ts +0 -6
  28. package/src/utils/object/isEqual.test.ts +0 -25
  29. package/src/utils/object/isEqual.ts +0 -11
  30. package/src/utils/react/unref.ts +0 -7
  31. package/src/utils/unref.ts +0 -0
package/index.d.ts CHANGED
@@ -1323,13 +1323,18 @@ interface ThumbnailProps extends GenericProps, HasTheme {
1323
1323
  */
1324
1324
  declare const Thumbnail: Comp<ThumbnailProps>;
1325
1325
 
1326
+ type ForwardedTextProps = Omit<TextProps, 'as' | 'typography' | 'color' | 'colorVariant'>;
1326
1327
  type ImageCaptionMetadata = {
1327
1328
  /** Image title to display in the caption. */
1328
1329
  title?: string;
1330
+ /** Props to pass to the title. */
1331
+ titleProps?: ForwardedTextProps;
1329
1332
  /** Image description. Can be either a string, or sanitized html. */
1330
1333
  description?: string | {
1331
1334
  __html: string;
1332
1335
  };
1336
+ /** Props to pass to the title. */
1337
+ descriptionProps?: ForwardedTextProps;
1333
1338
  /** Tag content. */
1334
1339
  tags?: ReactNode;
1335
1340
  /** Caption custom CSS style. */
@@ -1378,68 +1383,6 @@ interface ImageBlockProps extends GenericProps, HasTheme, ImageCaptionMetadata {
1378
1383
  */
1379
1384
  declare const ImageBlock: Comp<ImageBlockProps, HTMLDivElement>;
1380
1385
 
1381
- type InheritedSlideShowProps = Pick<SlideshowProps, 'slideshowControlsProps' | 'slideGroupLabel'>;
1382
- interface ZoomButtonProps {
1383
- /** Zoom in button props */
1384
- zoomInButtonProps?: IconButtonProps;
1385
- /** Zoom out button props */
1386
- zoomOutButtonProps?: IconButtonProps;
1387
- }
1388
- type InheritedThumbnailProps = Pick<ThumbnailProps, 'image' | 'alt' | 'imgProps' | 'imgRef' | 'loadingPlaceholderImageRef'>;
1389
- type InheritedImageMetadata = Pick<ImageCaptionMetadata, 'title' | 'description' | 'tags'>;
1390
- type ImageProps = InheritedThumbnailProps & InheritedImageMetadata;
1391
- interface ImagesProps {
1392
- /** Index of the active image to show on open */
1393
- activeImageIndex?: number;
1394
- /** List of images to display */
1395
- images: Array<ImageProps>;
1396
- /** Ref of the active image when the lightbox is open */
1397
- activeImageRef?: React.Ref<HTMLImageElement>;
1398
- }
1399
- type InheritedLightboxProps = Pick<LightboxProps, 'isOpen' | 'parentElement' | 'onClose' | 'closeButtonProps' | 'aria-label' | 'aria-labelledby'>;
1400
- type ForwardedProps = React.ComponentPropsWithoutRef<'div'>;
1401
- /**
1402
- * ImageLightbox component props
1403
- */
1404
- interface ImageLightboxProps extends HasClassName, ZoomButtonProps, ImagesProps, InheritedSlideShowProps, InheritedLightboxProps, ForwardedProps {
1405
- }
1406
-
1407
- /** Subset of the ImageLightboxProps managed by the useImageLightbox hook */
1408
- type ManagedProps = Pick<ImageLightboxProps, 'isOpen' | 'images' | 'parentElement' | 'activeImageRef' | 'onClose' | 'activeImageIndex'>;
1409
- type TriggerOptions = Pick<ImageLightboxProps, 'activeImageIndex'>;
1410
- /**
1411
- * Set up an ImageLightbox with images and triggers.
1412
- *
1413
- * - Associate a trigger with the lightbox to properly focus the trigger on close
1414
- * - Associate a trigger with an image to display on open
1415
- * - Automatically provide a view transition between an image trigger and the displayed image on open & close
1416
- *
1417
- * @param initialProps Images to display in the image lightbox
1418
- */
1419
- declare function useImageLightbox<P extends Partial<ImageLightboxProps>>(initialProps: P): {
1420
- /**
1421
- * Generates trigger props
1422
- * @param index Provide an index to choose which image to display when the image lightbox opens.
1423
- * */
1424
- getTriggerProps: (options?: TriggerOptions) => {
1425
- onClick: React.MouseEventHandler;
1426
- ref: React.Ref<any>;
1427
- };
1428
- /** Props to forward to the ImageLightbox */
1429
- imageLightboxProps: ManagedProps & P;
1430
- };
1431
-
1432
- /**
1433
- * ImageLightbox component.
1434
- *
1435
- * @param props Component props.
1436
- * @param ref Component ref.
1437
- * @return React element.
1438
- */
1439
- declare const ImageLightbox: Comp<ImageLightboxProps, HTMLDivElement> & {
1440
- useImageLightbox: typeof useImageLightbox;
1441
- };
1442
-
1443
1386
  /**
1444
1387
  * Defines the props of the component.
1445
1388
  */
@@ -2979,4 +2922,4 @@ interface UserBlockProps extends GenericProps, HasTheme {
2979
2922
  */
2980
2923
  declare const UserBlock: Comp<UserBlockProps, HTMLDivElement>;
2981
2924
 
2982
- export { AlertDialog, AlertDialogProps, Autocomplete, AutocompleteMultiple, AutocompleteMultipleProps, AutocompleteProps, Avatar, AvatarProps, AvatarSize, Badge, BadgeProps, BaseButtonProps, Button, ButtonEmphasis, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, Checkbox, CheckboxProps, Chip, ChipGroup, ChipGroupProps, ChipProps, CommentBlock, CommentBlockProps, CommentBlockVariant, DatePicker, DatePickerControlled, DatePickerControlledProps, DatePickerField, DatePickerFieldProps, DatePickerProps, Dialog, DialogProps, DialogSizes, Divider, DividerProps, DragHandle, DragHandleProps, Dropdown, DropdownProps, Elevation, ExpansionPanel, ExpansionPanelProps, Flag, FlagProps, FlexBox, FlexBoxProps, FlexHorizontalAlignment, FlexVerticalAlignment, GapSize, GenericBlock, GenericBlockGapSize, GenericBlockProps, Grid, GridColumn, GridColumnGapSize, GridColumnProps, GridItem, GridItemProps, GridProps, Heading, HeadingLevelProvider, HeadingLevelProviderProps, HeadingProps, Icon, IconButton, IconButtonProps, IconProps, IconSizes, ImageBlock, ImageBlockCaptionPosition, ImageBlockProps, ImageBlockSize, ImageLightbox, ImageLightboxProps, InlineList, InlineListProps, InputHelper, InputHelperProps, InputLabel, InputLabelProps, Lightbox, LightboxProps, Link, LinkPreview, LinkPreviewProps, LinkProps, List, ListDivider, ListDividerProps, ListItem, ListItemProps, ListItemSize, ListProps, ListSubheader, ListSubheaderProps, MarginAutoAlignment, Message, MessageProps, Mosaic, MosaicProps, Navigation, NavigationProps, Notification, NotificationProps, Offset, Placement, Popover, PopoverDialog, PopoverDialogProps, PopoverProps, PostBlock, PostBlockProps, Progress, ProgressCircular, ProgressCircularProps, ProgressCircularSize, ProgressLinear, ProgressLinearProps, ProgressProps, ProgressTracker, ProgressTrackerProps, ProgressTrackerProvider, ProgressTrackerProviderProps, ProgressTrackerStep, ProgressTrackerStepPanel, ProgressTrackerStepPanelProps, ProgressTrackerStepProps, ProgressVariant, RadioButton, RadioButtonProps, RadioGroup, RadioGroupProps, Select, SelectMultiple, SelectMultipleField, SelectMultipleProps, SelectProps, SelectVariant, SideNavigation, SideNavigationItem, SideNavigationItemProps, SideNavigationProps, SkeletonCircle, SkeletonCircleProps, SkeletonRectangle, SkeletonRectangleProps, SkeletonRectangleVariant, SkeletonTypography, SkeletonTypographyProps, Slider, SliderProps, Slides, SlidesProps, Slideshow, SlideshowControls, SlideshowControlsProps, SlideshowItem, SlideshowItemProps, SlideshowProps, Switch, SwitchProps, Tab, TabList, TabListLayout, TabListProps, TabPanel, TabPanelProps, TabProps, TabProvider, TabProviderProps, Table, TableBody, TableBodyProps, TableCell, TableCellProps, TableCellVariant, TableHeader, TableHeaderProps, TableProps, TableRow, TableRowProps, Text, TextField, TextFieldProps, TextProps, ThOrder, Thumbnail, ThumbnailProps, Toolbar, ToolbarProps, Tooltip, TooltipPlacement, TooltipProps, Uploader, UploaderProps, UploaderSize, UploaderVariant, UserBlock, UserBlockProps, UserBlockSize, clamp, isClickable, useFocusPointStyle, useHeadingLevel };
2925
+ export { AlertDialog, AlertDialogProps, Autocomplete, AutocompleteMultiple, AutocompleteMultipleProps, AutocompleteProps, Avatar, AvatarProps, AvatarSize, Badge, BadgeProps, BaseButtonProps, Button, ButtonEmphasis, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, Checkbox, CheckboxProps, Chip, ChipGroup, ChipGroupProps, ChipProps, CommentBlock, CommentBlockProps, CommentBlockVariant, DatePicker, DatePickerControlled, DatePickerControlledProps, DatePickerField, DatePickerFieldProps, DatePickerProps, Dialog, DialogProps, DialogSizes, Divider, DividerProps, DragHandle, DragHandleProps, Dropdown, DropdownProps, Elevation, ExpansionPanel, ExpansionPanelProps, Flag, FlagProps, FlexBox, FlexBoxProps, FlexHorizontalAlignment, FlexVerticalAlignment, GapSize, GenericBlock, GenericBlockGapSize, GenericBlockProps, Grid, GridColumn, GridColumnGapSize, GridColumnProps, GridItem, GridItemProps, GridProps, Heading, HeadingLevelProvider, HeadingLevelProviderProps, HeadingProps, Icon, IconButton, IconButtonProps, IconProps, IconSizes, ImageBlock, ImageBlockCaptionPosition, ImageBlockProps, ImageBlockSize, InlineList, InlineListProps, InputHelper, InputHelperProps, InputLabel, InputLabelProps, Lightbox, LightboxProps, Link, LinkPreview, LinkPreviewProps, LinkProps, List, ListDivider, ListDividerProps, ListItem, ListItemProps, ListItemSize, ListProps, ListSubheader, ListSubheaderProps, MarginAutoAlignment, Message, MessageProps, Mosaic, MosaicProps, Navigation, NavigationProps, Notification, NotificationProps, Offset, Placement, Popover, PopoverDialog, PopoverDialogProps, PopoverProps, PostBlock, PostBlockProps, Progress, ProgressCircular, ProgressCircularProps, ProgressCircularSize, ProgressLinear, ProgressLinearProps, ProgressProps, ProgressTracker, ProgressTrackerProps, ProgressTrackerProvider, ProgressTrackerProviderProps, ProgressTrackerStep, ProgressTrackerStepPanel, ProgressTrackerStepPanelProps, ProgressTrackerStepProps, ProgressVariant, RadioButton, RadioButtonProps, RadioGroup, RadioGroupProps, Select, SelectMultiple, SelectMultipleField, SelectMultipleProps, SelectProps, SelectVariant, SideNavigation, SideNavigationItem, SideNavigationItemProps, SideNavigationProps, SkeletonCircle, SkeletonCircleProps, SkeletonRectangle, SkeletonRectangleProps, SkeletonRectangleVariant, SkeletonTypography, SkeletonTypographyProps, Slider, SliderProps, Slides, SlidesProps, Slideshow, SlideshowControls, SlideshowControlsProps, SlideshowItem, SlideshowItemProps, SlideshowProps, Switch, SwitchProps, Tab, TabList, TabListLayout, TabListProps, TabPanel, TabPanelProps, TabProps, TabProvider, TabProviderProps, Table, TableBody, TableBodyProps, TableCell, TableCellProps, TableCellVariant, TableHeader, TableHeaderProps, TableProps, TableRow, TableRowProps, Text, TextField, TextFieldProps, TextProps, ThOrder, Thumbnail, ThumbnailProps, Toolbar, ToolbarProps, Tooltip, TooltipPlacement, TooltipProps, Uploader, UploaderProps, UploaderSize, UploaderVariant, UserBlock, UserBlockProps, UserBlockSize, clamp, isClickable, useFocusPointStyle, useHeadingLevel };