fix: hover behaviour on table cells (#1557)

* edit button focus fix

* cell feedback fix

* using theme prop

* isHovered prop drill

* edit button component

* refactor editable cell

* import fix

* index fix (merge issue)

front/src/modules/ui/table/editable-cell/components/EditableCellEditButton.tsx

@@ -0,0 +1,29 @@
+import styled from '@emotion/styled';
+import { motion } from 'framer-motion';
+
+import { FloatingIconButton } from '@/ui/button/components/FloatingIconButton';
+import { IconPencil } from '@/ui/icon';
+
+const StyledEditButtonContainer = styled(motion.div)`
+  position: absolute;
+  right: 5px;
+`;
+
+type EditableCellEditButtonProps = {
+  onClick?: () => void;
+};
+
+export function EditableCellEditButton({
+  onClick,
+}: EditableCellEditButtonProps) {
+  return (
+    <StyledEditButtonContainer
+      initial={{ opacity: 0 }}
+      animate={{ opacity: 1 }}
+      transition={{ duration: 0.1 }}
+      whileHover={{ scale: 1.04 }}
+    >
+      <FloatingIconButton size="small" onClick={onClick} Icon={IconPencil} />
+    </StyledEditButtonContainer>
+  );
+}