refactor(utils): restructure react related utils

gcornut · gcornut · commit fe61379c002b · 2025-02-04T18:00:42.000+01:00
diff --git a/packages/lumx-react/src/components/autocomplete/Autocomplete.tsx b/packages/lumx-react/src/components/autocomplete/Autocomplete.tsx
@@ -7,7 +7,7 @@ import { Dropdown, DropdownProps, IconButtonProps, Offset, Placement, TextField,
 import { GenericProps, HasTheme } from '@lumx/react/utils/type';
 import { getRootClassName } from '@lumx/react/utils/className';
 import { useFocus } from '@lumx/react/hooks/useFocus';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
diff --git a/packages/lumx-react/src/components/button/ButtonRoot.tsx b/packages/lumx-react/src/components/button/ButtonRoot.tsx
@@ -8,7 +8,7 @@ import { ColorPalette, Emphasis, Size, Theme } from '@lumx/react';
 import { CSS_PREFIX } from '@lumx/react/constants';
 import { GenericProps, HasTheme } from '@lumx/react/utils/type';
 import { handleBasicClasses } from '@lumx/react/utils/className';
-import { renderLink } from '@lumx/react/utils/renderLink';
+import { renderLink } from '@lumx/react/utils/react/renderLink';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
 type HTMLButtonProps = DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
diff --git a/packages/lumx-react/src/components/checkbox/Checkbox.tsx b/packages/lumx-react/src/components/checkbox/Checkbox.tsx
@@ -8,7 +8,7 @@ import { Icon, InputHelper, InputLabel, Theme } from '@lumx/react';
 import { GenericProps, HasTheme } from '@lumx/react/utils/type';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
 import { useId } from '@lumx/react/hooks/useId';
-import { useMergeRefs } from '@lumx/react/utils/mergeRefs';
+import { useMergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
diff --git a/packages/lumx-react/src/components/dialog/Dialog.tsx b/packages/lumx-react/src/components/dialog/Dialog.tsx
@@ -14,7 +14,7 @@ import { GenericProps, isComponent } from '@lumx/react/utils/type';
 import { partitionMulti } from '@lumx/react/utils/partitionMulti';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
 import { ClickAwayProvider } from '@lumx/react/utils/ClickAwayProvider';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
 import { useDisableBodyScroll } from '@lumx/react/hooks/useDisableBodyScroll';
diff --git a/packages/lumx-react/src/components/image-lightbox/ImageLightbox.tsx b/packages/lumx-react/src/components/image-lightbox/ImageLightbox.tsx
@@ -4,7 +4,7 @@ import classNames from 'classnames';
 
 import { Lightbox } from '@lumx/react';
 import { ClickAwayProvider } from '@lumx/react/utils';
-import { useMergeRefs } from '@lumx/react/utils/mergeRefs';
+import { useMergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
 import { ImageSlideshow } from './internal/ImageSlideshow';
diff --git a/packages/lumx-react/src/components/image-lightbox/internal/ImageSlide.tsx b/packages/lumx-react/src/components/image-lightbox/internal/ImageSlide.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 
 import { SlideshowItem, Thumbnail } from '@lumx/react';
-import { useMergeRefs } from '@lumx/react/utils/mergeRefs';
+import { useMergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { useSizeOnWindowResize } from '@lumx/react/hooks/useSizeOnWindowResize';
 import { useImageSize } from '@lumx/react/hooks/useImageSize';
 import { isReducedMotion } from '@lumx/react/utils/browser/isReducedMotion';
diff --git a/packages/lumx-react/src/components/image-lightbox/internal/ImageSlideshow.tsx b/packages/lumx-react/src/components/image-lightbox/internal/ImageSlideshow.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 
 import { mdiMagnifyMinusOutline, mdiMagnifyPlusOutline } from '@lumx/icons';
 import { FlexBox, IconButton, Slides, SlideshowControls } from '@lumx/react';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 
 import memoize from 'lodash/memoize';
 import { ImageCaption } from '../../image-block/ImageCaption';
diff --git a/packages/lumx-react/src/components/lightbox/Lightbox.tsx b/packages/lumx-react/src/components/lightbox/Lightbox.tsx
@@ -12,7 +12,7 @@ import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/classNam
 import { useFocusTrap } from '@lumx/react/hooks/useFocusTrap';
 import { useDisableBodyScroll } from '@lumx/react/hooks/useDisableBodyScroll';
 import { ClickAwayProvider } from '@lumx/react/utils/ClickAwayProvider';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { useCallbackOnEscape } from '@lumx/react/hooks/useCallbackOnEscape';
 import { useTransitionVisibility } from '@lumx/react/hooks/useTransitionVisibility';
 import { ThemeProvider } from '@lumx/react/utils/theme/ThemeContext';
diff --git a/packages/lumx-react/src/components/link/Link.tsx b/packages/lumx-react/src/components/link/Link.tsx
@@ -7,7 +7,7 @@ import classNames from 'classnames';
 import { ColorPalette, ColorVariant, Icon, Size, Typography } from '@lumx/react';
 import { GenericProps } from '@lumx/react/utils/type';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
-import { renderLink } from '@lumx/react/utils/renderLink';
+import { renderLink } from '@lumx/react/utils/react/renderLink';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
 type HTMLAnchorProps = React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;
diff --git a/packages/lumx-react/src/components/list/List.tsx b/packages/lumx-react/src/components/list/List.tsx
@@ -6,7 +6,7 @@ import { Size } from '@lumx/react';
 import { useKeyboardListNavigation } from '@lumx/react/hooks/useKeyboardListNavigation';
 import { GenericProps } from '@lumx/react/utils/type';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
 import { useInteractiveList } from './useInteractiveList';
diff --git a/packages/lumx-react/src/components/list/ListItem.tsx b/packages/lumx-react/src/components/list/ListItem.tsx
@@ -7,7 +7,7 @@ import { ListProps, Size } from '@lumx/react';
 import { GenericProps } from '@lumx/react/utils/type';
 import { onEnterPressed, onButtonPressed } from '@lumx/react/utils/browser/event';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
-import { renderLink } from '@lumx/react/utils/renderLink';
+import { renderLink } from '@lumx/react/utils/react/renderLink';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
 export type ListItemSize = Extract<Size, 'tiny' | 'regular' | 'big' | 'huge'>;
diff --git a/packages/lumx-react/src/components/list/useInteractiveList.tsx b/packages/lumx-react/src/components/list/useInteractiveList.tsx
@@ -2,8 +2,8 @@ import { ListItemProps } from '@lumx/react';
 import { isClickable } from '@lumx/react/components/list/ListItem';
 
 import { isComponent } from '@lumx/react/utils/type';
-import { flattenChildren } from '@lumx/react/utils/flattenChildren';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { flattenChildren } from '@lumx/react/utils/react/flattenChildren';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import get from 'lodash/get';
 import {
     cloneElement,
diff --git a/packages/lumx-react/src/components/notification/Notification.tsx b/packages/lumx-react/src/components/notification/Notification.tsx
@@ -10,7 +10,7 @@ import { NOTIFICATION_CONFIGURATION } from '@lumx/react/components/notification/
 import { GenericProps, HasTheme } from '@lumx/react/utils/type';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
 import { useTransitionVisibility } from '@lumx/react/hooks/useTransitionVisibility';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
diff --git a/packages/lumx-react/src/components/popover/Popover.tsx b/packages/lumx-react/src/components/popover/Popover.tsx
@@ -9,9 +9,9 @@ import { ClickAwayProvider } from '@lumx/react/utils/ClickAwayProvider';
 import { DOCUMENT } from '@lumx/react/constants';
 import { Comp, GenericProps, HasTheme } from '@lumx/react/utils/type';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
-import { useMergeRefs } from '@lumx/react/utils/mergeRefs';
+import { useMergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { useFocusTrap } from '@lumx/react/hooks/useFocusTrap';
-import { skipRender } from '@lumx/react/utils/skipRender';
+import { skipRender } from '@lumx/react/utils/react/skipRender';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
 import { ThemeProvider } from '@lumx/react/utils/theme/ThemeContext';
diff --git a/packages/lumx-react/src/components/popover/useRestoreFocusOnClose.tsx b/packages/lumx-react/src/components/popover/useRestoreFocusOnClose.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { getFirstAndLastFocusable } from '@lumx/react/utils/browser/focus/getFirstAndLastFocusable';
-import { OnBeforeUnmount } from '@lumx/react/utils/OnBeforeUnmount';
+import { OnBeforeUnmount } from '@lumx/react/utils/react/OnBeforeUnmount';
 import type { PopoverProps } from './Popover';
 
 /**
diff --git a/packages/lumx-react/src/components/progress-tracker/ProgressTracker.tsx b/packages/lumx-react/src/components/progress-tracker/ProgressTracker.tsx
@@ -4,7 +4,7 @@ import classNames from 'classnames';
 
 import { GenericProps } from '@lumx/react/utils/type';
 import { getRootClassName } from '@lumx/react/utils/className';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
 import { useRovingTabIndex } from '../../hooks/useRovingTabIndex';
diff --git a/packages/lumx-react/src/components/select/Select.tsx b/packages/lumx-react/src/components/select/Select.tsx
@@ -10,7 +10,7 @@ import { Chip } from '@lumx/react/components/chip/Chip';
 import { Icon } from '@lumx/react/components/icon/Icon';
 import { InputLabel } from '@lumx/react/components/input-label/InputLabel';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
 import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
diff --git a/packages/lumx-react/src/components/select/SelectMultiple.tsx b/packages/lumx-react/src/components/select/SelectMultiple.tsx
@@ -8,7 +8,7 @@ import { Chip } from '@lumx/react/components/chip/Chip';
 import { Icon } from '@lumx/react/components/icon/Icon';
 import { InputLabel } from '@lumx/react/components/input-label/InputLabel';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
diff --git a/packages/lumx-react/src/components/select/WithSelectContext.tsx b/packages/lumx-react/src/components/select/WithSelectContext.tsx
@@ -8,7 +8,7 @@ import { InputHelper } from '@lumx/react/components/input-helper/InputHelper';
 import { useFocusTrap } from '@lumx/react/hooks/useFocusTrap';
 import { useListenFocus } from '@lumx/react/hooks/useListenFocus';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 
 import { useId } from '@lumx/react/hooks/useId';
 import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
diff --git a/packages/lumx-react/src/components/side-navigation/SideNavigationItem.tsx b/packages/lumx-react/src/components/side-navigation/SideNavigationItem.tsx
@@ -7,8 +7,8 @@ import { mdiChevronDown, mdiChevronUp } from '@lumx/icons';
 import { Emphasis, Icon, Size, IconButton, IconButtonProps } from '@lumx/react';
 import { GenericProps, HasCloseMode, isComponent } from '@lumx/react/utils/type';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
-import { renderLink } from '@lumx/react/utils/renderLink';
-import { renderButtonOrLink } from '@lumx/react/utils/renderButtonOrLink';
+import { renderLink } from '@lumx/react/utils/react/renderLink';
+import { renderButtonOrLink } from '@lumx/react/utils/react/renderButtonOrLink';
 import { useId } from '@lumx/react/hooks/useId';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
diff --git a/packages/lumx-react/src/components/slideshow/Slideshow.tsx b/packages/lumx-react/src/components/slideshow/Slideshow.tsx
@@ -4,7 +4,7 @@ import { SlideshowControls, SlideshowControlsProps, Theme, Slides, SlidesProps }
 import { DEFAULT_OPTIONS } from '@lumx/react/hooks/useSlideshowControls';
 import { GenericProps } from '@lumx/react/utils/type';
 import { useFocusWithin } from '@lumx/react/hooks/useFocusWithin';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
diff --git a/packages/lumx-react/src/components/slideshow/SlideshowItemGroup.tsx b/packages/lumx-react/src/components/slideshow/SlideshowItemGroup.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 
 import classNames from 'classnames';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { GenericProps } from '@lumx/react/utils/type';
 import { getRootClassName } from '@lumx/react/utils/className';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
diff --git a/packages/lumx-react/src/components/tabs/TabList.tsx b/packages/lumx-react/src/components/tabs/TabList.tsx
@@ -6,7 +6,7 @@ import { Alignment, Theme } from '@lumx/react';
 import { CSS_PREFIX } from '@lumx/react/constants';
 import { GenericProps, HasTheme } from '@lumx/react/utils/type';
 import { handleBasicClasses } from '@lumx/react/utils/className';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
 
diff --git a/packages/lumx-react/src/components/text-field/TextField.tsx b/packages/lumx-react/src/components/text-field/TextField.tsx
@@ -18,7 +18,7 @@ import {
 } from '@lumx/react';
 import { GenericProps, HasTheme } from '@lumx/react/utils/type';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { useId } from '@lumx/react/hooks/useId';
 import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
diff --git a/packages/lumx-react/src/components/text/Text.tsx b/packages/lumx-react/src/components/text/Text.tsx
@@ -11,7 +11,7 @@ import {
     getTypographyClassName,
 } from '@lumx/react/utils/className';
 import { useOverflowTooltipLabel } from '@lumx/react/hooks/useOverflowTooltipLabel';
-import { useMergeRefs } from '@lumx/react/utils/mergeRefs';
+import { useMergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { forwardRef } from '@lumx/react/utils/react/forwardRef';
 
 /**
diff --git a/packages/lumx-react/src/components/thumbnail/Thumbnail.tsx b/packages/lumx-react/src/components/thumbnail/Thumbnail.tsx
@@ -15,7 +15,7 @@ import { AspectRatio, HorizontalAlignment, Icon, Size, Theme, ThumbnailObjectFit
 import { Falsy, GenericProps, HasTheme } from '@lumx/react/utils/type';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
 import { mdiImageBroken } from '@lumx/icons';
-import { useMergeRefs } from '@lumx/react/utils/mergeRefs';
+import { useMergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { useImageLoad } from '@lumx/react/components/thumbnail/useImageLoad';
 import { useFocusPointStyle } from '@lumx/react/components/thumbnail/useFocusPointStyle';
 import { useTheme } from '@lumx/react/utils/theme/ThemeContext';
diff --git a/packages/lumx-react/src/components/tooltip/Tooltip.tsx b/packages/lumx-react/src/components/tooltip/Tooltip.tsx
@@ -7,7 +7,7 @@ import classNames from 'classnames';
 import { DOCUMENT, VISUALLY_HIDDEN } from '@lumx/react/constants';
 import { GenericProps, HasCloseMode } from '@lumx/react/utils/type';
 import { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';
-import { useMergeRefs } from '@lumx/react/utils/mergeRefs';
+import { useMergeRefs } from '@lumx/react/utils/react/mergeRefs';
 import { Placement } from '@lumx/react/components/popover';
 import { TooltipContextProvider } from '@lumx/react/components/tooltip/context';
 import { useId } from '@lumx/react/hooks/useId';
diff --git a/packages/lumx-react/src/components/tooltip/useInjectTooltipRef.tsx b/packages/lumx-react/src/components/tooltip/useInjectTooltipRef.tsx
@@ -1,6 +1,6 @@
 import React, { cloneElement, ReactNode, useMemo } from 'react';
 
-import { mergeRefs } from '@lumx/react/utils/mergeRefs';
+import { mergeRefs } from '@lumx/react/utils/react/mergeRefs';
 
 interface Options {
     /** Original tooltip anchor */
diff --git a/packages/lumx-react/src/utils/react/OnBeforeUnmount.tsx b/packages/lumx-react/src/utils/react/OnBeforeUnmount.tsx
diff --git a/packages/lumx-react/src/utils/react/flattenChildren.ts b/packages/lumx-react/src/utils/react/flattenChildren.ts
diff --git a/packages/lumx-react/src/utils/react/mergeRefs.ts b/packages/lumx-react/src/utils/react/mergeRefs.ts
diff --git a/packages/lumx-react/src/utils/react/renderButtonOrLink.tsx b/packages/lumx-react/src/utils/react/renderButtonOrLink.tsx
@@ -1,5 +1,5 @@
 import React, { ReactElement, ReactNode } from 'react';
-import { renderLink } from '@lumx/react/utils/renderLink';
+import { renderLink } from './renderLink';
 
 interface Props {
     linkAs?: any;
diff --git a/packages/lumx-react/src/utils/react/renderLink.tsx b/packages/lumx-react/src/utils/react/renderLink.tsx
diff --git a/packages/lumx-react/src/utils/react/skipRender.tsx b/packages/lumx-react/src/utils/react/skipRender.tsx
@@ -1,5 +1,5 @@
 import { DOCUMENT } from '@lumx/react/constants';
-import { Comp } from '@lumx/react/utils/type';
+import type { Comp } from '@lumx/react/utils/type';
 import React from 'react';
 
 /**
