From 08c9f528695adb6205f1e5e658f867086d765f1b Mon Sep 17 00:00:00 2001
From: AtsushiM <at.mizoue@gmail.com>
Date: Mon, 27 Jan 2025 13:33:25 +0900
Subject: [PATCH] =?UTF-8?q?chore:=20SingleComboBox=E3=81=AEdecorators?=
 =?UTF-8?q?=E3=81=AE=E6=89=B1=E3=81=84=E3=82=92=E6=9C=80=E9=81=A9=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ComboBox/SingleComboBox/SingleComboBox.tsx   | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/packages/smarthr-ui/src/components/ComboBox/SingleComboBox/SingleComboBox.tsx b/packages/smarthr-ui/src/components/ComboBox/SingleComboBox/SingleComboBox.tsx
index 548b4f56cb..5304b4447d 100644
--- a/packages/smarthr-ui/src/components/ComboBox/SingleComboBox/SingleComboBox.tsx
+++ b/packages/smarthr-ui/src/components/ComboBox/SingleComboBox/SingleComboBox.tsx
@@ -17,7 +17,7 @@ import innerText from 'react-innertext'
 import { tv } from 'tailwind-variants'
 
 import { useClick } from '../../../hooks/useClick'
-import { type DecoratorsType } from '../../../hooks/useDecorators'
+import { type DecoratorsType, useDecorators } from '../../../hooks/useDecorators'
 import { genericsForwardRef } from '../../../libs/util'
 import { textColor } from '../../../themes'
 import { UnstyledButton } from '../../Button'
@@ -65,14 +65,16 @@ type Props<T> = BaseProps<T> & {
   /**
    * コンポーネント内のテキストを変更する関数/
    */
-  decorators?: DecoratorsType<'noResultText'> & {
-    destroyButtonIconAlt?: (text: string) => string
-  }
+  decorators?: DecoratorsType<DecoratorKeyTypes>
 }
 
 type ElementProps = Omit<ComponentPropsWithoutRef<'input'>, keyof Props<unknown>>
 
-const DESTROY_BUTTON_TEXT = '削除'
+const DECORATOR_DEFAULT_TEXTS = {
+  destroyButtonIconAlt: '削除',
+} as const
+type DecoratorKeyTypes = keyof typeof DECORATOR_DEFAULT_TEXTS
+
 const NOOP = () => undefined
 
 const singleCombobox = tv({
@@ -373,6 +375,8 @@ const ActualSingleComboBox = <T,>(
     }
   }, [notSelected, disabled, className])
 
+  const decorated = useDecorators<DecoratorKeyTypes>(DECORATOR_DEFAULT_TEXTS, decorators)
+
   return (
     <div className={styles.wrapper} style={wrapperStyleAttr} ref={outerRef}>
       <Input
@@ -396,7 +400,7 @@ const ActualSingleComboBox = <T,>(
             >
               <FaCircleXmarkIcon
                 color="TEXT_BLACK"
-                alt={decorators?.destroyButtonIconAlt?.(DESTROY_BUTTON_TEXT) || DESTROY_BUTTON_TEXT}
+                alt={decorated.destroyButtonIconAlt}
                 className={styles.clearButtonIcon}
               />
             </UnstyledButton>