Format code style

hotel-management/src/components/ButtonIcon/index.tsx

@@ -1,92 +1,5 @@
-import { COLOR, SIZE } from '@constant/styles';
 import { ReactNode } from 'react';
-import styled, { css } from 'styled-components';
-
-interface IStyledButtonIcon {
-  isHaveChildren: boolean;
-  style?: {
-    fontSize?: string;
-    backgroundColor?: string;
-    color?: string;
-  };
-  iconStyle?: {
-    color?: string;
-    size?: string;
-  };
-}
-
-const StyledButtonIcon = styled.button<IStyledButtonIcon>`
-  background: none;
-
-  padding: 10px;
-  transition: all 0.2s;
-
-  border: none;
-
-  ${(props) =>
-    props.style?.fontSize &&
-    css`
-      font-size: ${props.style.fontSize};
-    `}
-
-  ${(props) =>
-    props.style?.fontSize &&
-    css`
-      font-size: ${props.style.fontSize};
-    `}
-
-  ${(props) =>
-    props.color &&
-    css`
-      font-size: ${props.color};
-    `}
-
-  ${(props) =>
-    props.isHaveChildren
-      ? css`
-          display: flex;
-          align-items: center;
-          gap: 10px;
-
-          text-align: left;
-          width: 100%;
-        `
-      : css`
-          border-radius: var(--radius-md);
-        `}
-
-  &:hover {
-    background-color: var(--hover-background-color);
-  }
-
-  & svg {
-    ${(props) =>
-      props.iconStyle?.size &&
-      css`
-        width: ${props.iconStyle.size};
-        height: ${props.iconStyle.size};
-      `}
-
-    ${(props) =>
-      props.iconStyle?.color &&
-      css`
-        color: ${props.iconStyle.color};
-      `}
-    transition: all 0.3s;
-  }
-`;
-
-StyledButtonIcon.defaultProps = {
-  style: {
-    fontSize: SIZE.DEFAULT,
-    backgroundColor: COLOR.DEFAULT,
-    color: COLOR.BLACK,
-  },
-  iconStyle: {
-    color: COLOR.BLACK,
-    size: SIZE.DEFAULT,
-  },
-};
+import { StyledButtonIcon } from './styled';
 
 interface IButtonIcon {
   icon: ReactNode;