mirror of
https://github.com/invoke-ai/InvokeAI
synced 2024-08-30 20:32:17 +00:00
fix(ui): fix typing issues
This commit is contained in:
parent
56527da73e
commit
300805a25a
@ -16,7 +16,8 @@ import type { MenuButtonProps, MenuProps, PortalProps } from '@chakra-ui/react';
|
||||
import { Portal, useEventListener } from '@chakra-ui/react';
|
||||
import { InvMenu, InvMenuButton } from 'common/components/InvMenu/wrapper';
|
||||
import { useGlobalMenuCloseTrigger } from 'common/hooks/useGlobalMenuCloseTrigger';
|
||||
import { memo, useCallback, useEffect, useRef, useState } from 'react';
|
||||
import { typedMemo } from 'common/util/typedMemo';
|
||||
import { useCallback, useEffect, useRef, useState } from 'react';
|
||||
|
||||
export interface InvContextMenuProps<T extends HTMLElement = HTMLDivElement> {
|
||||
renderMenu: () => JSX.Element | null;
|
||||
@ -26,7 +27,7 @@ export interface InvContextMenuProps<T extends HTMLElement = HTMLDivElement> {
|
||||
menuButtonProps?: MenuButtonProps;
|
||||
}
|
||||
|
||||
export const InvContextMenu = memo(
|
||||
export const InvContextMenu = typedMemo(
|
||||
<T extends HTMLElement = HTMLElement>(props: InvContextMenuProps<T>) => {
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const [isRendered, setIsRendered] = useState(false);
|
||||
@ -113,4 +114,6 @@ export const InvContextMenu = memo(
|
||||
}
|
||||
);
|
||||
|
||||
InvContextMenu.displayName = 'InvContextMenu';
|
||||
Object.assign(InvContextMenu, {
|
||||
displayName: 'InvContextMenu',
|
||||
});
|
||||
|
@ -4,7 +4,7 @@ import {
|
||||
keyframes,
|
||||
MenuItem as ChakraMenuItem,
|
||||
} from '@chakra-ui/react';
|
||||
import {memo} from'react'
|
||||
import { memo } from 'react';
|
||||
|
||||
import type { InvMenuItemProps } from './types';
|
||||
|
||||
|
@ -1,4 +1,5 @@
|
||||
import {
|
||||
forwardRef,
|
||||
RangeSlider as ChakraRangeSlider,
|
||||
RangeSliderFilledTrack as ChakraRangeSliderFilledTrack,
|
||||
RangeSliderThumb as ChakraRangeSliderThumb,
|
||||
@ -16,7 +17,7 @@ import { InvRangeSliderMark } from './InvRangeSliderMark';
|
||||
import type { InvRangeSliderProps } from './types';
|
||||
|
||||
export const InvRangeSlider = memo(
|
||||
forwardRef<InvRangeSliderProps, ChakraRangeSlider>(
|
||||
forwardRef<InvRangeSliderProps, typeof ChakraRangeSlider>(
|
||||
(props: InvRangeSliderProps, ref) => {
|
||||
const {
|
||||
value,
|
||||
|
6
invokeai/frontend/web/src/common/util/typedMemo.ts
Normal file
6
invokeai/frontend/web/src/common/util/typedMemo.ts
Normal file
@ -0,0 +1,6 @@
|
||||
import { memo } from 'react';
|
||||
|
||||
/**
|
||||
* A typed version of React.memo, useful for components that take generics.
|
||||
*/
|
||||
export const typedMemo: <T>(c: T) => T = memo;
|
@ -12,5 +12,5 @@ export default meta;
|
||||
type Story = StoryObj<typeof QueueControls>;
|
||||
|
||||
export const Default: Story = {
|
||||
render: QueueControls,
|
||||
render: () => <QueueControls />,
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user