fix: fixed lint and format

atls · Aug 18, 2023 · b196024 · b196024
1 parent cff9e06
commit b196024
Show file tree

Hide file tree

Showing 10 changed files with 74 additions and 67 deletions.
diff --git a/ui-parts/tooltip/src/container/container.interfaces.ts b/ui-parts/tooltip/src/container/container.interfaces.ts
@@ -1,4 +1,5 @@
-import { LayerSide, UseLayerArrowProps } from "react-laag"
+import { LayerSide }          from 'react-laag'
+import { UseLayerArrowProps } from 'react-laag'
 
 export interface ArrowOptions {
   angle?: number | undefined

diff --git a/ui-parts/tooltip/src/container/default-container.component.tsx b/ui-parts/tooltip/src/container/default-container.component.tsx
@@ -1,15 +1,16 @@
 import React                     from 'react'
-import { forwardRef }            from 'react'
 import { Arrow }                 from 'react-laag'
+import { forwardRef }            from 'react'
 
 import { Container }             from './container.component'
 import { DefaultContainerProps } from './container.interfaces'
 
-export const DefaultContainer = forwardRef<HTMLDivElement, DefaultContainerProps>(
-  ({ text, showArrow, arrowOptions, arrowProps, layerSide, ...props }, ref) => (
-    <Container ref={ref} {...props}>
-      {text}
-      {showArrow && <Arrow {...layerSide} {...arrowOptions} {...arrowProps} />}
-    </Container>
-  )
-)
+export const DefaultContainer = forwardRef<HTMLDivElement, DefaultContainerProps>((
+  { text, showArrow, arrowOptions, arrowProps, layerSide, ...props },
+  ref
+) => (
+  <Container ref={ref} {...props}>
+    {text}
+    {showArrow && <Arrow {...layerSide} {...arrowOptions} {...arrowProps} />}
+  </Container>
+))
diff --git a/ui-parts/tooltip/src/tooltip.component.tsx b/ui-parts/tooltip/src/tooltip.component.tsx
@@ -1,8 +1,8 @@
 import React                 from 'react'
 import { Children }          from 'react'
-import { cloneElement }      from 'react'
 import { FC }                from 'react'
 import { PropsWithChildren } from 'react'
+import { cloneElement }      from 'react'
 
 import { DefaultContainer }  from './container'
 import { TooltipProps }      from './tooltip.interfaces'
@@ -13,7 +13,7 @@ export const Tooltip: FC<PropsWithChildren<TooltipProps>> = ({
   children,
   ...props
 }) => {
-  const { isOpen, triggerProps, render } = useTooltip({ ...props })
+  const { isOpen, close, triggerProps, render } = useTooltip({ ...props })
 
   const renderChildren = () => {
     if (typeof children === 'function') return children(isOpen, close)

diff --git a/ui-parts/tooltip/src/use-tooltip.hook.tsx b/ui-parts/tooltip/src/use-tooltip.hook.tsx
@@ -1,17 +1,19 @@
 import React                 from 'react'
 import { AnimatePresence }   from 'framer-motion'
-import { cloneElement }      from 'react'
 import { ReactElement }      from 'react'
-import { useLayer }          from 'react-laag'
+import { cloneElement }      from 'react'
 import { useMemo }           from 'react'
+import { useLayer }          from 'react-laag'
 
 import { DefaultContainer }  from './container'
+import { UseTooltipOptions } from './tooltip.interfaces'
 import { useClick }          from './hooks'
 import { useContextMenu }    from './hooks'
 import { useHover }          from './hooks'
-import { UseTooltipOptions } from './tooltip.interfaces'
 
-const doNothing = () => {}
+const doNothing = () => {
+  /** do nothing */
+}
 
 export const useTooltip = ({
   anchor = 'top-center',
@@ -56,6 +58,8 @@ export const useTooltip = ({
     }
 
     return triggerValues
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [trigger, isOpen, isContextMenu, isClicked, isOver])
 
   const { arrowProps, triggerProps, layerProps, layerSide, renderLayer } = useLayer({

diff --git a/ui-proto/popover/src/container/container.component.tsx b/ui-proto/popover/src/container/container.component.tsx
@@ -13,12 +13,13 @@ import { baseContainerStyles }     from './container.styles'
 
 const StyledContainer = styled(ContainerElement)(baseContainerStyles)
 
-export const Container = forwardRef<HTMLDivElement, ContainerComponentProps>(
-  ({ content, showArrow, arrowOptions, arrowProps, layerSide, title, ...props }, ref) => (
-    <StyledContainer ref={ref} {...props}>
-      {title && <ContainerTitle>{title}</ContainerTitle>}
-      {content && <ContainerInner>{content}</ContainerInner>}
-      {showArrow && <Arrow {...layerSide} {...arrowOptions} {...arrowProps} />}
-    </StyledContainer>
-  )
-)
+export const Container = forwardRef<HTMLDivElement, ContainerComponentProps>((
+  { content, showArrow, arrowOptions, arrowProps, layerSide, title, ...props },
+  ref
+) => (
+  <StyledContainer ref={ref} {...props}>
+    {title && <ContainerTitle>{title}</ContainerTitle>}
+    {content && <ContainerInner>{content}</ContainerInner>}
+    {showArrow && <Arrow {...layerSide} {...arrowOptions} {...arrowProps} />}
+  </StyledContainer>
+))
diff --git a/ui-proto/popover/src/container/container.element.tsx b/ui-proto/popover/src/container/container.element.tsx
@@ -4,15 +4,16 @@ import { forwardRef }            from 'react'
 
 import { ContainerElementProps } from './container.interfaces'
 
-export const ContainerElement = forwardRef<HTMLDivElement, ContainerElementProps>(
-  ({ animate, ...props }, ref) => (
-    <motion.div
-      initial={animate ? { opacity: 0, scale: 0.8 } : {}}
-      animate={animate ? { opacity: 1, scale: 1, y: 0 } : {}}
-      exit={animate ? { opacity: 0, scale: 0.8 } : {}}
-      transition={{ type: 'spring', damping: 30, stiffness: 500 }}
-      ref={ref}
-      {...props}
-    />
-  )
-)
+export const ContainerElement = forwardRef<HTMLDivElement, ContainerElementProps>((
+  { animate, ...props },
+  ref
+) => (
+  <motion.div
+    initial={animate ? { opacity: 0, scale: 0.8 } : {}}
+    animate={animate ? { opacity: 1, scale: 1, y: 0 } : {}}
+    exit={animate ? { opacity: 0, scale: 0.8 } : {}}
+    transition={{ type: 'spring', damping: 30, stiffness: 500 }}
+    ref={ref}
+    {...props}
+  />
+))
diff --git a/ui-proto/popover/src/container/container.interfaces.ts b/ui-proto/popover/src/container/container.interfaces.ts
@@ -1,4 +1,5 @@
-import { LayerSide, UseLayerArrowProps } from "react-laag"
+import { LayerSide }          from 'react-laag'
+import { UseLayerArrowProps } from 'react-laag'
 
 export interface ArrowOptions {
   angle?: number | undefined

diff --git a/ui-proto/popover/src/popover.component.tsx b/ui-proto/popover/src/popover.component.tsx
@@ -1,13 +1,14 @@
-import React, { Children, cloneElement, PropsWithChildren }            from 'react'
-import { FC }           from 'react'
+import React                 from 'react'
+import { Children }          from 'react'
+import { PropsWithChildren } from 'react'
+import { FC }                from 'react'
+import { cloneElement }      from 'react'
 
-import { PopoverProps } from './popover.interfaces'
-import { usePopover } from './use-popover.hook'
+import { PopoverProps }      from './popover.interfaces'
+import { usePopover }        from './use-popover.hook'
 
-const Popover: FC<PropsWithChildren<PopoverProps>> = ({
-  title, content, children, ...props
-}) => {
-  const { isOpen, triggerProps, render } = usePopover({ ...props })
+const Popover: FC<PropsWithChildren<PopoverProps>> = ({ title, content, children, ...props }) => {
+  const { isOpen, close, triggerProps, render } = usePopover({ ...props })
 
   const renderChildren = () => {
     if (typeof children === 'function') return children(isOpen, close)

diff --git a/ui-proto/popover/src/popover.stories.tsx b/ui-proto/popover/src/popover.stories.tsx
@@ -39,30 +39,27 @@ const CloseButton = styled.div({
   color: '#1890ff',
 })
 
-const TestContent = ({ onClick = () => {} }) => (
+const TestContent = ({ onClick }) => (
   <div>
     <div>Content</div>
     <CloseButton onClick={onClick}>Close</CloseButton>
   </div>
 )
 
-export const Base = () => {
-  return (
-    <Column height={200}>
-      <Layout minHeight={400} width={1000} pt={100} pl={150}>
-        <Popover
-          title='Title'
-          trigger='click'
-          showArrow={false}
-          closeOnOutsideClick={false}
-          content={<div>Content</div>}
-        >
-          <TestButton>Base</TestButton>
-        </Popover>
-      </Layout>
-    </Column>
-  )
-}
+export const Base = () => (
+  <Column height={200}>
+    <Layout minHeight={400} width={1000} pt={100} pl={150}>
+      <Popover
+        title="Title"
+        trigger="click"
+        showArrow={false}
+        closeOnOutsideClick={false}
+        content={<div>Content</div>}>
+        <TestButton>Base</TestButton>
+      </Popover>
+    </Layout>
+  </Column>
+)
 
 Base.story = {
   name: 'Базовый',
@@ -83,4 +80,4 @@ export const Hook = () => {
 
 Hook.story = {
   name: 'Хук',
-}
+}
diff --git a/ui-proto/popover/src/use-popover.hook.tsx b/ui-proto/popover/src/use-popover.hook.tsx
@@ -1,7 +1,7 @@
 import React                 from 'react'
 
-import { useTooltip }        from '@atls-ui-parts/tooltip'
 import { UseTooltipOptions } from '@atls-ui-parts/tooltip'
+import { useTooltip }        from '@atls-ui-parts/tooltip'
 
 import { Container }         from './container'
 
@@ -34,4 +34,4 @@ const usePopover = ({
   }
 }
 
-export { usePopover }
+export { usePopover }