Spark TextInput for Currency values

In my project, I wanted to have an spark TextInput to show currency values.
While formatting it should show unformatted number.
The way I did it is by creating a new CurrencyTextInput class extending spark TextInput.
Code for the component is (CurrencyTextInput.as):

package com.abcd.component
{
    import flash.events.Event;
    import flash.events.FocusEvent;
 
    import spark.components.TextInput;
    import spark.formatters.CurrencyFormatter;
 
    public class CurrencyTextInput extends TextInput
    {
        public function CurrencyTextInput()
        {
            super();
            formatter = new CurrencyFormatter();
            formatter.currencySymbol = "£";
            formatter.fractionalDigits = 2;
            formatter.useGrouping = true;
            formatter.useCurrencySymbol = true;
            formatter.negativeCurrencyFormat = 1;
            formatter.trailingZeros = true;
        }
 
        public var formatter:CurrencyFormatter = null;
 
        public var formatterRegExp:RegExp = /[,£ ]/g;
 
        [Inspectable(category = "General", defaultValue = "")]
        override public function get text():String
        {
            return super.text.replace(formatterRegExp, "");
        }
 
        [Bindable("change")]
        [Bindable("textChanged")]
        [CollapseWhiteSpace] // Compiler will strip leading and trailing whitespace from text string.
        override public function set text(value:String):void
        {
            super.text = formatter.format(value);
 
            // Trigger bindings to textChanged.
            dispatchEvent(new Event("textChanged"));
        }
 
        /**
         * Flush out [,] and currency symbol characters before getting focus
         * @param    event
         */
        override protected function focusInHandler(event:FocusEvent):void
        {
            super.focusInHandler(event);
            if (this.focusEnabled)
                super.text = text.replace(formatterRegExp, "");
        }
 
        /**
         * Format data before lost focus event happen
         * @param    event
         */
        override protected function focusOutHandler(event:FocusEvent):void
        {
            super.focusOutHandler(event);
            super.text = formatter.format(text);
        }
    }
}

The way to use this component is:

<fx:declarations>
    <s:currencyformatter
        currencysymbol="{resourceManager.getString(ApplicationConstants.RESOURCE_BUNDLE_NAME, 'currency.symbol')}"
        fractionaldigits="2"
        id="currencyFormatter"
        negativecurrencyformat="1"
        trailingzeros="true"
        usecurrencysymbol="true"
        usegrouping="true"/>
</fx:declarations>
<fx:Script>
   <![CDATA[
   [Bindable]
       public var currencyFormatterRegExp:RegExp = new RegExp('[,' + resourceManager.getString(ApplicationConstants.RESOURCE_BUNDLE_NAME, 'currency.symbol') + ' ]', 'g');
   ]]>
</fx:Script>
   
<component:CurrencyTextInput
    width="217"
    fontWeight="bold"
    textAlign="right"
    text="@{billingValue}"
    formatterRegExp="{currencyFormatterRegExp}"
    formatter="{currencyFormatter}" restrict="0-9"/>