feat: an (optional) prefix can be added to the inputCurrency variant

dd3tech · Mar 22, 2023 · a44c99b · a44c99b
1 parent 83e3fbd
commit a44c99b
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 4 deletions.
diff --git a/src/components/Form/Input/CurrencyInput.test.tsx b/src/components/Form/Input/CurrencyInput.test.tsx
@@ -6,7 +6,7 @@ describe('<CurrencyInput />', () => {
   it('formats input value as currency', () => {
     const onChange = vi.fn()
     const { getByTestId } = render(
-      <CurrencyInput data-testid="input" onChange={onChange} />
+      <CurrencyInput data-testid="input" onChange={onChange} prefix="$" />
     )
     const input = getByTestId('input') as HTMLInputElement
 

diff --git a/src/components/Form/Input/CurrencyInput.tsx b/src/components/Form/Input/CurrencyInput.tsx
@@ -3,7 +3,7 @@ import { getValueWithDecimalFormat, unFormatCurrency } from 'dd360-utils'
 import BaseInput, { InputProps } from './BaseInput'
 
 function CurrencyInput(props: InputProps) {
-  const { onChange, value } = props
+  const { onChange, value, prefix = '' } = props
   const [localValue, setLocalValue] = useState(
     getValueWithDecimalFormat(String(value))
   )
@@ -23,7 +23,7 @@ function CurrencyInput(props: InputProps) {
   }, [value])
 
   return (
-    <BaseInput {...props} onChange={handleChange} value={'$' + localValue} />
+    <BaseInput {...props} onChange={handleChange} value={prefix + localValue} />
   )
 }
 

diff --git a/src/stories/Input.stories.tsx b/src/stories/Input.stories.tsx
@@ -44,7 +44,8 @@ InputCurrency.args = {
   endAdornment: '$',
   startAdornment: '%',
   className: 'w-full',
-  type: 'currency'
+  type: 'currency',
+  prefix: '$'
 }
 export const InputPassword = Template.bind({})
 InputPassword.args = {