@razorpay/blade/build/lib/native/components/Input/TextInput/TextInput.js

The Design System that powers Razorpay

import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
import React__default, { useState, useRef, useEffect } from 'react';
import { BaseInput } from '../BaseInput/BaseInput.js';
import { getKeyboardAndAutocompleteProps } from '../BaseInput/utils.js';
import { useTaggedInput } from '../BaseInput/useTaggedInput.js';
import { useFormattedInput } from './useFormattedInput.js';
import isEmpty from '../../../utils/lodashButBetter/isEmpty.js';
import '../../Icons/AcceptPaymentsFilledIcon/AcceptPaymentsFilledIcon.js';
import '../../Icons/AcceptPaymentsIcon/AcceptPaymentsIcon.js';
import '../../Icons/ActivityIcon/ActivityIcon.js';
import '../../Icons/AddressBookIcon/AddressBookIcon.js';
import '../../Icons/AffordabilityFilledIcon/AffordabilityFilledIcon.js';
import '../../Icons/AffordabilityIcon/AffordabilityIcon.js';
import '../../Icons/AirplayIcon/AirplayIcon.js';
import '../../Icons/AlertCircleIcon/AlertCircleIcon.js';
import '../../Icons/AlertOctagonIcon/AlertOctagonIcon.js';
import '../../Icons/AlertOnlyIcon/AlertOnlyIcon.js';
import '../../Icons/AlertTriangleIcon/AlertTriangleIcon.js';
import '../../Icons/AlignCenterIcon/AlignCenterIcon.js';
import '../../Icons/AlignJustifyIcon/AlignJustifyIcon.js';
import '../../Icons/AlignLeftIcon/AlignLeftIcon.js';
import '../../Icons/AlignRightIcon/AlignRightIcon.js';
import '../../Icons/AnchorIcon/AnchorIcon.js';
import '../../Icons/AndroidIcon/AndroidIcon.js';
import '../../Icons/AnnouncementIcon/AnnouncementIcon.js';
import '../../Icons/ApertureIcon/ApertureIcon.js';
import '../../Icons/AppStoreIcon/AppStoreIcon.js';
import '../../Icons/AppleIcon/AppleIcon.js';
import '../../Icons/ArrowDownIcon/ArrowDownIcon.js';
import '../../Icons/ArrowDownLeftIcon/ArrowDownLeftIcon.js';
import '../../Icons/ArrowDownRightIcon/ArrowDownRightIcon.js';
import '../../Icons/ArrowLeftIcon/ArrowLeftIcon.js';
import '../../Icons/ArrowRightIcon/ArrowRightIcon.js';
import '../../Icons/ArrowSquareDownIcon/ArrowSquareDownIcon.js';
import '../../Icons/ArrowSquareDownLeftIcon/ArrowSquareDownLeftIcon.js';
import '../../Icons/ArrowSquareDownRightIcon/ArrowSquareDownRightIcon.js';
import '../../Icons/ArrowSquareLeftIcon/ArrowSquareLeftIcon.js';
import '../../Icons/ArrowSquareRightIcon/ArrowSquareRightIcon.js';
import '../../Icons/ArrowSquareUpIcon/ArrowSquareUpIcon.js';
import '../../Icons/ArrowSquareUpLeftIcon/ArrowSquareUpLeftIcon.js';
import '../../Icons/ArrowSquareUpRightIcon/ArrowSquareUpRightIcon.js';
import '../../Icons/ArrowUpIcon/ArrowUpIcon.js';
import '../../Icons/ArrowUpLeftIcon/ArrowUpLeftIcon.js';
import '../../Icons/ArrowUpRightIcon/ArrowUpRightIcon.js';
import '../../Icons/AtSignIcon/AtSignIcon.js';
import '../../Icons/AttachmentIcon/AttachmentIcon.js';
import '../../Icons/AutomateAccountingIcon/AutomateAccountingIcon.js';
import '../../Icons/AutomatePayrollFilledIcon/AutomatePayrollFilledIcon.js';
import '../../Icons/AutomatePayrollIcon/AutomatePayrollIcon.js';
import '../../Icons/AwardIcon/AwardIcon.js';
import '../../Icons/BankAccountVerificationFilledIcon/BankAccountVerificationFilledIcon.js';
import '../../Icons/BankAccountVerificationIcon/BankAccountVerificationIcon.js';
import '../../Icons/BankIcon/BankIcon.js';
import '../../Icons/BarChartAltIcon/BarChartAltIcon.js';
import '../../Icons/BarChartIcon/BarChartIcon.js';
import '../../Icons/BarCodeIcon/BarCodeIcon.js';
import '../../Icons/Battery100PercentIcon/Battery100PercentIcon.js';
import '../../Icons/Battery20PercentIcon/Battery20PercentIcon.js';
import '../../Icons/Battery40PercentIcon/Battery40PercentIcon.js';
import '../../Icons/Battery60PercentIcon/Battery60PercentIcon.js';
import '../../Icons/Battery80PercentIcon/Battery80PercentIcon.js';
import '../../Icons/BatteryChargingIcon/BatteryChargingIcon.js';
import '../../Icons/BatteryIcon/BatteryIcon.js';
import '../../Icons/BellIcon/BellIcon.js';
import '../../Icons/BellOffIcon/BellOffIcon.js';
import '../../Icons/BfsiFilledIcon/BfsiFilledIcon.js';
import '../../Icons/BfsiIcon/BfsiIcon.js';
import '../../Icons/BillIcon/BillIcon.js';
import '../../Icons/BillMeFilledIcon/BillMeFilledIcon.js';
import '../../Icons/BillMeIcon/BillMeIcon.js';
import '../../Icons/BluetoothIcon/BluetoothIcon.js';
import '../../Icons/BoldIcon/BoldIcon.js';
import '../../Icons/BookIcon/BookIcon.js';
import '../../Icons/BookmarkIcon/BookmarkIcon.js';
import '../../Icons/BoxIcon/BoxIcon.js';
import '../../Icons/BriefcaseIcon/BriefcaseIcon.js';
import '../../Icons/BugIcon/BugIcon.js';
import '../../Icons/BuildingIcon/BuildingIcon.js';
import '../../Icons/BulkPayoutsFilledIcon/BulkPayoutsFilledIcon.js';
import '../../Icons/BulkPayoutsIcon/BulkPayoutsIcon.js';
import '../../Icons/BusinessBankingIcon/BusinessBankingIcon.js';
import '../../Icons/BusinessSpendManagementFilledIcon/BusinessSpendManagementFilledIcon.js';
import '../../Icons/BusinessSpendManagementIcon/BusinessSpendManagementIcon.js';
import '../../Icons/CalendarIcon/CalendarIcon.js';
import '../../Icons/CameraIcon/CameraIcon.js';
import '../../Icons/CameraOffIcon/CameraOffIcon.js';
import '../../Icons/CashIcon/CashIcon.js';
import '../../Icons/CastIcon/CastIcon.js';
import '../../Icons/CheckCircle2Icon/CheckCircle2Icon.js';
import '../../Icons/CheckCircleIcon/CheckCircleIcon.js';
import '../../Icons/CheckIcon/CheckIcon.js';
import '../../Icons/CheckSquareIcon/CheckSquareIcon.js';
import '../../Icons/ChevronDownIcon/ChevronDownIcon.js';
import '../../Icons/ChevronLeftIcon/ChevronLeftIcon.js';
import '../../Icons/ChevronRightIcon/ChevronRightIcon.js';
import '../../Icons/ChevronUpDownIcon/ChevronUpDownIcon.js';
import '../../Icons/ChevronUpIcon/ChevronUpIcon.js';
import '../../Icons/ChevronsDownIcon/ChevronsDownIcon.js';
import '../../Icons/ChevronsLeftIcon/ChevronsLeftIcon.js';
import '../../Icons/ChevronsRightIcon/ChevronsRightIcon.js';
import '../../Icons/ChevronsUpIcon/ChevronsUpIcon.js';
import '../../Icons/ChromeIcon/ChromeIcon.js';
import '../../Icons/CircleIcon/CircleIcon.js';
import '../../Icons/ClipboardIcon/ClipboardIcon.js';
import '../../Icons/ClockIcon/ClockIcon.js';
import CloseIcon from '../../Icons/CloseIcon/CloseIcon.js';
import '../../Icons/ClosedCaptioningIcon/ClosedCaptioningIcon.js';
import '../../Icons/CloudDrizzleIcon/CloudDrizzleIcon.js';
import '../../Icons/CloudIcon/CloudIcon.js';
import '../../Icons/CloudLightningIcon/CloudLightningIcon.js';
import '../../Icons/CloudOffIcon/CloudOffIcon.js';
import '../../Icons/CloudRainIcon/CloudRainIcon.js';
import '../../Icons/CloudSnowIcon/CloudSnowIcon.js';
import '../../Icons/CodeSnippetIcon/CodeSnippetIcon.js';
import '../../Icons/CodepenIcon/CodepenIcon.js';
import '../../Icons/CoinIcon/CoinIcon.js';
import '../../Icons/CoinsIcon/CoinsIcon.js';
import '../../Icons/CommandIcon/CommandIcon.js';
import '../../Icons/CompanyRegistrationFilledIcon/CompanyRegistrationFilledIcon.js';
import '../../Icons/CompanyRegistrationIcon/CompanyRegistrationIcon.js';
import '../../Icons/CompassIcon/CompassIcon.js';
import '../../Icons/ConfettiIcon/ConfettiIcon.js';
import '../../Icons/ContactlessPaymentIcon/ContactlessPaymentIcon.js';
import '../../Icons/CookieIcon/CookieIcon.js';
import '../../Icons/CopyIcon/CopyIcon.js';
import '../../Icons/CopyrightIcon/CopyrightIcon.js';
import '../../Icons/CornerDownLeftIcon/CornerDownLeftIcon.js';
import '../../Icons/CornerDownRightIcon/CornerDownRightIcon.js';
import '../../Icons/CornerLeftDownIcon/CornerLeftDownIcon.js';
import '../../Icons/CornerLeftUpIcon/CornerLeftUpIcon.js';
import '../../Icons/CornerRightDownIcon/CornerRightDownIcon.js';
import '../../Icons/CornerRightUpIcon/CornerRightUpIcon.js';
import '../../Icons/CornerUpLeftIcon/CornerUpLeftIcon.js';
import '../../Icons/CornerUpRightIcon/CornerUpRightIcon.js';
import '../../Icons/CpuIcon/CpuIcon.js';
import '../../Icons/CreditCardIcon/CreditCardIcon.js';
import '../../Icons/CreditsAndLoansFilledIcon/CreditsAndLoansFilledIcon.js';
import '../../Icons/CreditsAndLoansIcon/CreditsAndLoansIcon.js';
import '../../Icons/CropIcon/CropIcon.js';
import '../../Icons/CrosshairIcon/CrosshairIcon.js';
import '../../Icons/CurrentAccountFilledIcon/CurrentAccountFilledIcon.js';
import '../../Icons/CurrentAccountIcon/CurrentAccountIcon.js';
import '../../Icons/CustomersIcon/CustomersIcon.js';
import '../../Icons/CutIcon/CutIcon.js';
import '../../Icons/DashboardIcon/DashboardIcon.js';
import '../../Icons/DeleteIcon/DeleteIcon.js';
import '../../Icons/DigitalLendingFilledIcon/DigitalLendingFilledIcon.js';
import '../../Icons/DigitalLendingIcon/DigitalLendingIcon.js';
import '../../Icons/DisbursePaymentsFilledIcon/DisbursePaymentsFilledIcon.js';
import '../../Icons/DisbursePaymentsIcon/DisbursePaymentsIcon.js';
import '../../Icons/DiscIcon/DiscIcon.js';
import '../../Icons/DollarIcon/DollarIcon.js';
import '../../Icons/DollarsIcon/DollarsIcon.js';
import '../../Icons/DotIcon/DotIcon.js';
import '../../Icons/DownloadCloudIcon/DownloadCloudIcon.js';
import '../../Icons/DownloadIcon/DownloadIcon.js';
import '../../Icons/DragHandleIcon/DragHandleIcon.js';
import '../../Icons/DropletIcon/DropletIcon.js';
import '../../Icons/EcommerceFilledIcon/EcommerceFilledIcon.js';
import '../../Icons/EcommerceIcon/EcommerceIcon.js';
import '../../Icons/EditComposeIcon/EditComposeIcon.js';
import '../../Icons/EditIcon/EditIcon.js';
import '../../Icons/EditInlineIcon/EditInlineIcon.js';
import '../../Icons/EducationFilledIcon/EducationFilledIcon.js';
import '../../Icons/EducationIcon/EducationIcon.js';
import '../../Icons/EngageFilledIcon/EngageFilledIcon.js';
import '../../Icons/EngageIcon/EngageIcon.js';
import '../../Icons/EqualsIcon/EqualsIcon.js';
import '../../Icons/EscrowAccountFilledIcon/EscrowAccountFilledIcon.js';
import '../../Icons/EscrowAccountIcon/EscrowAccountIcon.js';
import '../../Icons/ExportIcon/ExportIcon.js';
import '../../Icons/ExternalLinkIcon/ExternalLinkIcon.js';
import '../../Icons/EyeIcon/EyeIcon.js';
import '../../Icons/EyeOffIcon/EyeOffIcon.js';
import '../../Icons/FacebookIcon/FacebookIcon.js';
import '../../Icons/FastForwardIcon/FastForwardIcon.js';
import '../../Icons/FeatherIcon/FeatherIcon.js';
import '../../Icons/FigmaIcon/FigmaIcon.js';
import '../../Icons/FileIcon/FileIcon.js';
import '../../Icons/FileMinusIcon/FileMinusIcon.js';
import '../../Icons/FilePlusIcon/FilePlusIcon.js';
import '../../Icons/FileTextIcon/FileTextIcon.js';
import '../../Icons/FileZipIcon/FileZipIcon.js';
import '../../Icons/FilmIcon/FilmIcon.js';
import '../../Icons/FilterIcon/FilterIcon.js';
import '../../Icons/FlagIcon/FlagIcon.js';
import '../../Icons/FlaskIcon/FlaskIcon.js';
import '../../Icons/FolderIcon/FolderIcon.js';
import '../../Icons/ForexManagementFilledIcon/ForexManagementFilledIcon.js';
import '../../Icons/ForexManagementIcon/ForexManagementIcon.js';
import '../../Icons/FreelanceFilledIcon/FreelanceFilledIcon.js';
import '../../Icons/FreelanceIcon/FreelanceIcon.js';
import '../../Icons/FullScreenEnterIcon/FullScreenEnterIcon.js';
import '../../Icons/FullScreenExitIcon/FullScreenExitIcon.js';
import '../../Icons/GithubIcon/GithubIcon.js';
import '../../Icons/GitlabIcon/GitlabIcon.js';
import '../../Icons/GlobeIcon/GlobeIcon.js';
import '../../Icons/GridIcon/GridIcon.js';
import '../../Icons/HashIcon/HashIcon.js';
import '../../Icons/HeadphoneIcon/HeadphoneIcon.js';
import '../../Icons/HeadphonesIcon/HeadphonesIcon.js';
import '../../Icons/HeadsetIcon/HeadsetIcon.js';
import '../../Icons/HeartIcon/HeartIcon.js';
import '../../Icons/HelpCircleIcon/HelpCircleIcon.js';
import '../../Icons/HistoryIcon/HistoryIcon.js';
import '../../Icons/HomeIcon/HomeIcon.js';
import '../../Icons/ImageIcon/ImageIcon.js';
import '../../Icons/InboxIcon/InboxIcon.js';
import '../../Icons/IndiaFlagIcon/IndiaFlagIcon.js';
import '../../Icons/InfoIcon/InfoIcon.js';
import '../../Icons/InstagramIcon/InstagramIcon.js';
import '../../Icons/InstantSettlementFilledIcon/InstantSettlementFilledIcon.js';
import '../../Icons/InstantSettlementIcon/InstantSettlementIcon.js';
import '../../Icons/InternationalPaymentsFilledIcon/InternationalPaymentsFilledIcon.js';
import '../../Icons/InternationalPaymentsIcon/InternationalPaymentsIcon.js';
import '../../Icons/InvoicesFilledIcon/InvoicesFilledIcon.js';
import '../../Icons/InvoicesIcon/InvoicesIcon.js';
import '../../Icons/ItalicIcon/ItalicIcon.js';
import '../../Icons/KeyIcon/KeyIcon.js';
import '../../Icons/KeyboardIcon/KeyboardIcon.js';
import '../../Icons/LayersIcon/LayersIcon.js';
import '../../Icons/LayoutIcon/LayoutIcon.js';
import '../../Icons/LeftCircularCornerIcon/LeftCircularCornerIcon.js';
import '../../Icons/LifeBuoyIcon/LifeBuoyIcon.js';
import '../../Icons/LinkIcon/LinkIcon.js';
import '../../Icons/ListIcon/ListIcon.js';
import '../../Icons/ListSearchIcon/ListSearchIcon.js';
import '../../Icons/LoaderIcon/LoaderIcon.js';
import '../../Icons/LoansForBusinessesFilledIcon/LoansForBusinessesFilledIcon.js';
import '../../Icons/LoansForBusinessesIcon/LoansForBusinessesIcon.js';
import '../../Icons/LockIcon/LockIcon.js';
import '../../Icons/LogInIcon/LogInIcon.js';
import '../../Icons/LogOutIcon/LogOutIcon.js';
import '../../Icons/MagicCheckoutFilledIcon/MagicCheckoutFilledIcon.js';
import '../../Icons/MagicCheckoutIcon/MagicCheckoutIcon.js';
import '../../Icons/MagicKonnectFilledIcon/MagicKonnectFilledIcon.js';
import '../../Icons/MagicKonnectIcon/MagicKonnectIcon.js';
import '../../Icons/MailIcon/MailIcon.js';
import '../../Icons/MailOpenIcon/MailOpenIcon.js';
import '../../Icons/MapIcon/MapIcon.js';
import '../../Icons/MapPinIcon/MapPinIcon.js';
import '../../Icons/MaximizeIcon/MaximizeIcon.js';
import '../../Icons/MenuDotsIcon/MenuDotsIcon.js';
import '../../Icons/MenuIcon/MenuIcon.js';
import '../../Icons/MessageCircleIcon/MessageCircleIcon.js';
import '../../Icons/MessageSquareIcon/MessageSquareIcon.js';
import '../../Icons/MicIcon/MicIcon.js';
import '../../Icons/MicOffIcon/MicOffIcon.js';
import '../../Icons/MinimizeIcon/MinimizeIcon.js';
import '../../Icons/MinusCircleIcon/MinusCircleIcon.js';
import '../../Icons/MinusIcon/MinusIcon.js';
import '../../Icons/MinusSquareIcon/MinusSquareIcon.js';
import '../../Icons/MobileAppFilledIcon/MobileAppFilledIcon.js';
import '../../Icons/MobileAppIcon/MobileAppIcon.js';
import '../../Icons/MonitorIcon/MonitorIcon.js';
import '../../Icons/MoonIcon/MoonIcon.js';
import '../../Icons/MoreFilledIcon/MoreFilledIcon.js';
import '../../Icons/MoreHorizontalIcon/MoreHorizontalIcon.js';
import '../../Icons/MoreIcon/MoreIcon.js';
import '../../Icons/MoreVerticalIcon/MoreVerticalIcon.js';
import '../../Icons/MoveIcon/MoveIcon.js';
import '../../Icons/MusicIcon/MusicIcon.js';
import '../../Icons/MyAccountIcon/MyAccountIcon.js';
import '../../Icons/NavigationIcon/NavigationIcon.js';
import '../../Icons/NoSignalIcon/NoSignalIcon.js';
import '../../Icons/OctagonIcon/OctagonIcon.js';
import '../../Icons/OffersIcon/OffersIcon.js';
import '../../Icons/OptimizerFilledIcon/OptimizerFilledIcon.js';
import '../../Icons/OptimizerIcon/OptimizerIcon.js';
import '../../Icons/PackageIcon/PackageIcon.js';
import '../../Icons/PaperclipIcon/PaperclipIcon.js';
import '../../Icons/PauseCircleIcon/PauseCircleIcon.js';
import '../../Icons/PauseIcon/PauseIcon.js';
import '../../Icons/PaymentButtonFilledIcon/PaymentButtonFilledIcon.js';
import '../../Icons/PaymentButtonIcon/PaymentButtonIcon.js';
import '../../Icons/PaymentButtonsIcon/PaymentButtonsIcon.js';
import '../../Icons/PaymentGatewayFilledIcon/PaymentGatewayFilledIcon.js';
import '../../Icons/PaymentGatewayIcon/PaymentGatewayIcon.js';
import '../../Icons/PaymentLinkFilledIcon/PaymentLinkFilledIcon.js';
import '../../Icons/PaymentLinkIcon/PaymentLinkIcon.js';
import '../../Icons/PaymentLinksIcon/PaymentLinksIcon.js';
import '../../Icons/PaymentPagesFilledIcon/PaymentPagesFilledIcon.js';
import '../../Icons/PaymentPagesIcon/PaymentPagesIcon.js';
import '../../Icons/PayoutLinkIcon/PayoutLinkIcon.js';
import '../../Icons/PayrollAddonsFilledIcon/PayrollAddonsFilledIcon.js';
import '../../Icons/PayrollAddonsIcon/PayrollAddonsIcon.js';
import '../../Icons/PayrollForCaFilledIcon/PayrollForCaFilledIcon.js';
import '../../Icons/PayrollForCaIcon/PayrollForCaIcon.js';
import '../../Icons/PayrollForStartupOrSmeFilledIcon/PayrollForStartupOrSmeFilledIcon.js';
import '../../Icons/PayrollForStartupOrSmeIcon/PayrollForStartupOrSmeIcon.js';
import '../../Icons/PercentIcon/PercentIcon.js';
import '../../Icons/PettyCashBudgetFilledIcon/PettyCashBudgetFilledIcon.js';
import '../../Icons/PettyCashBudgetIcon/PettyCashBudgetIcon.js';
import '../../Icons/PhoneCallIcon/PhoneCallIcon.js';
import '../../Icons/PhoneForwardedIcon/PhoneForwardedIcon.js';
import '../../Icons/PhoneIcon/PhoneIcon.js';
import '../../Icons/PhoneIncomingIcon/PhoneIncomingIcon.js';
import '../../Icons/PhoneMissedIcon/PhoneMissedIcon.js';
import '../../Icons/PhoneOffIcon/PhoneOffIcon.js';
import '../../Icons/PhoneOutgoingIcon/PhoneOutgoingIcon.js';
import '../../Icons/PictureInPictureIcon/PictureInPictureIcon.js';
import '../../Icons/PieChartIcon/PieChartIcon.js';
import '../../Icons/PinIcon/PinIcon.js';
import '../../Icons/PlayCircleIcon/PlayCircleIcon.js';
import '../../Icons/PlayIcon/PlayIcon.js';
import '../../Icons/PlusCircleIcon/PlusCircleIcon.js';
import '../../Icons/PlusIcon/PlusIcon.js';
import '../../Icons/PlusSquareIcon/PlusSquareIcon.js';
import '../../Icons/PocketIcon/PocketIcon.js';
import '../../Icons/PosFilledIcon/PosFilledIcon.js';
import '../../Icons/PosIcon/PosIcon.js';
import '../../Icons/PowerIcon/PowerIcon.js';
import '../../Icons/PrinterIcon/PrinterIcon.js';
import '../../Icons/PromptIcon/PromptIcon.js';
import '../../Icons/QRCodeIcon/QRCodeIcon.js';
import '../../Icons/RadioIcon/RadioIcon.js';
import '../../Icons/RayIcon/RayIcon.js';
import '../../Icons/RazorpayIcon/RazorpayIcon.js';
import '../../Icons/RazorpayXIcon/RazorpayXIcon.js';
import '../../Icons/RazorpayxPayrollFilledIcon/RazorpayxPayrollFilledIcon.js';
import '../../Icons/RazorpayxPayrollIcon/RazorpayxPayrollIcon.js';
import '../../Icons/RefreshIcon/RefreshIcon.js';
import '../../Icons/RepeatIcon/RepeatIcon.js';
import '../../Icons/ReportsIcon/ReportsIcon.js';
import '../../Icons/ResizerIcon/ResizerIcon.js';
import '../../Icons/ReticleIcon/ReticleIcon.js';
import '../../Icons/RewindIcon/RewindIcon.js';
import '../../Icons/RotateClockWiseIcon/RotateClockWiseIcon.js';
import '../../Icons/RotateCounterClockWiseIcon/RotateCounterClockWiseIcon.js';
import '../../Icons/RouteFilledIcon/RouteFilledIcon.js';
import '../../Icons/RouteIcon/RouteIcon.js';
import '../../Icons/RoutesIcon/RoutesIcon.js';
import '../../Icons/RupeeIcon/RupeeIcon.js';
import '../../Icons/RupeesIcon/RupeesIcon.js';
import '../../Icons/SaasFilledIcon/SaasFilledIcon.js';
import '../../Icons/SaasIcon/SaasIcon.js';
import '../../Icons/SaveIcon/SaveIcon.js';
import '../../Icons/ScissorsIcon/ScissorsIcon.js';
import '../../Icons/SearchIcon/SearchIcon.js';
import '../../Icons/SendIcon/SendIcon.js';
import '../../Icons/ServerIcon/ServerIcon.js';
import '../../Icons/SettingsIcon/SettingsIcon.js';
import '../../Icons/SettlementsIcon/SettlementsIcon.js';
import '../../Icons/ShareIcon/ShareIcon.js';
import '../../Icons/ShieldIcon/ShieldIcon.js';
import '../../Icons/ShoppingBagIcon/ShoppingBagIcon.js';
import '../../Icons/ShoppingCartIcon/ShoppingCartIcon.js';
import '../../Icons/ShuffleIcon/ShuffleIcon.js';
import '../../Icons/SidebarIcon/SidebarIcon.js';
import '../../Icons/Signal1BarIcon/Signal1BarIcon.js';
import '../../Icons/Signal2BarIcon/Signal2BarIcon.js';
import '../../Icons/Signal3BarIcon/Signal3BarIcon.js';
import '../../Icons/Signal4BarIcon/Signal4BarIcon.js';
import '../../Icons/SignalIcon/SignalIcon.js';
import '../../Icons/SimCardIcon/SimCardIcon.js';
import '../../Icons/SkipBackIcon/SkipBackIcon.js';
import '../../Icons/SkipForwardIcon/SkipForwardIcon.js';
import '../../Icons/SlackIcon/SlackIcon.js';
import '../../Icons/SlashIcon/SlashIcon.js';
import '../../Icons/SlidersIcon/SlidersIcon.js';
import '../../Icons/SmartCollectFilledIcon/SmartCollectFilledIcon.js';
import '../../Icons/SmartCollectIcon/SmartCollectIcon.js';
import '../../Icons/SmartphoneIcon/SmartphoneIcon.js';
import '../../Icons/SolutionsFilledIcon/SolutionsFilledIcon.js';
import '../../Icons/SolutionsIcon/SolutionsIcon.js';
import '../../Icons/SortIcon/SortIcon.js';
import '../../Icons/SourceToPayFilledIcon/SourceToPayFilledIcon.js';
import '../../Icons/SourceToPayIcon/SourceToPayIcon.js';
import '../../Icons/SparklesIcon/SparklesIcon.js';
import '../../Icons/SpeakerIcon/SpeakerIcon.js';
import '../../Icons/SquareIcon/SquareIcon.js';
import '../../Icons/StampIcon/StampIcon.js';
import '../../Icons/StarIcon/StarIcon.js';
import '../../Icons/StopCircleIcon/StopCircleIcon.js';
import '../../Icons/StorefrontIcon/StorefrontIcon.js';
import '../../Icons/SubscriptionsFilledIcon/SubscriptionsFilledIcon.js';
import '../../Icons/SubscriptionsIcon/SubscriptionsIcon.js';
import '../../Icons/SunIcon/SunIcon.js';
import '../../Icons/SunriseIcon/SunriseIcon.js';
import '../../Icons/SunsetIcon/SunsetIcon.js';
import '../../Icons/TabletIcon/TabletIcon.js';
import '../../Icons/TagIcon/TagIcon.js';
import '../../Icons/TargetIcon/TargetIcon.js';
import '../../Icons/TaxPaymentsFilledIcon/TaxPaymentsFilledIcon.js';
import '../../Icons/TaxPaymentsIcon/TaxPaymentsIcon.js';
import '../../Icons/TestIcon/TestIcon.js';
import '../../Icons/ThermometerIcon/ThermometerIcon.js';
import '../../Icons/ThumbsDownIcon/ThumbsDownIcon.js';
import '../../Icons/ThumbsUpIcon/ThumbsUpIcon.js';
import '../../Icons/TicketIcon/TicketIcon.js';
import '../../Icons/ToggleLeftIcon/ToggleLeftIcon.js';
import '../../Icons/ToggleRightIcon/ToggleRightIcon.js';
import '../../Icons/TokenHqFilledIcon/TokenHqFilledIcon.js';
import '../../Icons/TokenHqIcon/TokenHqIcon.js';
import '../../Icons/TopLeftRoundedCornerIcon/TopLeftRoundedCornerIcon.js';
import '../../Icons/TopLeftSharpCornerIcon/TopLeftSharpCornerIcon.js';
import '../../Icons/TrademarkIcon/TrademarkIcon.js';
import '../../Icons/TrademarkRegisteredIcon/TrademarkRegisteredIcon.js';
import '../../Icons/TransactionsIcon/TransactionsIcon.js';
import '../../Icons/TranslateIcon/TranslateIcon.js';
import '../../Icons/TrashIcon/TrashIcon.js';
import '../../Icons/TrendingDownIcon/TrendingDownIcon.js';
import '../../Icons/TrendingUpIcon/TrendingUpIcon.js';
import '../../Icons/TriangleIcon/TriangleIcon.js';
import '../../Icons/TvIcon/TvIcon.js';
import '../../Icons/TwitterIcon/TwitterIcon.js';
import '../../Icons/TypeIcon/TypeIcon.js';
import '../../Icons/UmbrellaIcon/UmbrellaIcon.js';
import '../../Icons/UnderlineIcon/UnderlineIcon.js';
import '../../Icons/UnlockIcon/UnlockIcon.js';
import '../../Icons/UpiAutopayFilledIcon/UpiAutopayFilledIcon.js';
import '../../Icons/UpiAutopayIcon/UpiAutopayIcon.js';
import '../../Icons/UpiIcon/UpiIcon.js';
import '../../Icons/UploadCloudIcon/UploadCloudIcon.js';
import '../../Icons/UploadIcon/UploadIcon.js';
import '../../Icons/UserCheckIcon/UserCheckIcon.js';
import '../../Icons/UserIcon/UserIcon.js';
import '../../Icons/UserMinusIcon/UserMinusIcon.js';
import '../../Icons/UserPlusIcon/UserPlusIcon.js';
import '../../Icons/UserXIcon/UserXIcon.js';
import '../../Icons/UsersIcon/UsersIcon.js';
import '../../Icons/VendorPaymentsFilledIcon/VendorPaymentsFilledIcon.js';
import '../../Icons/VendorPaymentsIcon/VendorPaymentsIcon.js';
import '../../Icons/VideoIcon/VideoIcon.js';
import '../../Icons/VideoOffIcon/VideoOffIcon.js';
import '../../Icons/ViewLiveDemoFilledIcon/ViewLiveDemoFilledIcon.js';
import '../../Icons/ViewLiveDemoIcon/ViewLiveDemoIcon.js';
import '../../Icons/VoicemailIcon/VoicemailIcon.js';
import '../../Icons/VolumeHighIcon/VolumeHighIcon.js';
import '../../Icons/VolumeIcon/VolumeIcon.js';
import '../../Icons/VolumeLowIcon/VolumeLowIcon.js';
import '../../Icons/VolumeMuteIcon/VolumeMuteIcon.js';
import '../../Icons/VolumeOffIcon/VolumeOffIcon.js';
import '../../Icons/VolumeOnIcon/VolumeOnIcon.js';
import '../../Icons/WalletIcon/WalletIcon.js';
import '../../Icons/WatchIcon/WatchIcon.js';
import '../../Icons/WhatsAppIcon/WhatsAppIcon.js';
import '../../Icons/WifiIcon/WifiIcon.js';
import '../../Icons/WifiOffIcon/WifiOffIcon.js';
import '../../Icons/WindIcon/WindIcon.js';
import '../../Icons/WorldwideIcon/WorldwideIcon.js';
import '../../Icons/XCircleIcon/XCircleIcon.js';
import '../../Icons/XSquareIcon/XSquareIcon.js';
import '../../Icons/YoutubeIcon/YoutubeIcon.js';
import '../../Icons/ZapIcon/ZapIcon.js';
import '../../Icons/ZoomInIcon/ZoomInIcon.js';
import '../../Icons/ZoomOutIcon/ZoomOutIcon.js';
import { IconButton } from '../../Button/IconButton/IconButton.js';
import '@babel/runtime/helpers/defineProperty';
import { MetaConstants } from '../../../utils/metaAttribute/metaConstants.js';
import { CharacterCounter } from '../../Form/CharacterCounter/CharacterCounter.js';
import { BaseBox } from '../../Box/BaseBox/BaseBox.native.js';
import { Spinner } from '../../Spinner/Spinner/Spinner.js';
import { assignWithoutSideEffects } from '../../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
import 'react-native';
import { getPlatformType } from '../../../utils/getPlatformType/getPlatformType.js';
import '../../../tokens/global/typography.js';
import '../../../tokens/global/motion.js';
import '../../BladeProvider/useTheme.js';
import { useMergeRefs } from '../../../utils/useMergeRefs.js';
import { hintMarginTop } from '../../Form/formTokens.js';
import { Divider } from '../../Divider/Divider.js';
import { getComponentId } from '../../../utils/isValidAllowedChildren/isValidAllowedChildren.js';
import '../../Dropdown/Dropdown.js';
import { DropdownOverlay } from '../../Dropdown/DropdownOverlay.native.js';
import '../../Dropdown/DropdownButton.js';
import '../../Dropdown/DropdownLink.js';
import '../../Dropdown/DropdownIconButton.js';
import '../../Dropdown/DropdownHeaderFooter.js';
import { jsx, jsxs } from 'react/jsx-runtime';
import { dropdownComponentIds } from '../../Dropdown/dropdownComponentIds.js';
import { isIconComponent } from '../../../utils/isIconComponent/isIconComponent.js';
import { useDatePickerContext } from '../../DatePicker/DatePickerContext.js';

var _excluded=["label","accessibilityLabel","labelPosition","placeholder","type","defaultValue","name","value","maxCharacters","format","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","icon","prefix","showClearButton","onClearButtonClick","isLoading","suffix","autoFocus","keyboardReturnKeyType","autoCompleteSuggestionType","autoCapitalize","testID","size","leadingIcon","trailingIcon","isTaggedInput","tags","onTagChange","trailing","leading","labelSuffix","labelTrailing","onKeyDown"];var isReactNative=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var _TextInput=function _TextInput(_ref,ref){var _ref4;var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,placeholder=_ref.placeholder,_ref$type=_ref.type,type=_ref$type===void 0?'text':_ref$type,defaultValue=_ref.defaultValue,name=_ref.name,value=_ref.value,maxCharacters=_ref.maxCharacters,format=_ref.format,onChange=_ref.onChange,onClick=_ref.onClick,_onFocus=_ref.onFocus,_onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,isDisabled=_ref.isDisabled,necessityIndicator=_ref.necessityIndicator,validationState=_ref.validationState,errorText=_ref.errorText,helpText=_ref.helpText,successText=_ref.successText,isRequired=_ref.isRequired,icon=_ref.icon,prefix=_ref.prefix,showClearButton=_ref.showClearButton,onClearButtonClick=_ref.onClearButtonClick,isLoading=_ref.isLoading,suffix=_ref.suffix,autoFocus=_ref.autoFocus,keyboardReturnKeyType=_ref.keyboardReturnKeyType,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType,autoCapitalize=_ref.autoCapitalize,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,leadingIcon=_ref.leadingIcon,trailingIcon=_ref.trailingIcon,isTaggedInput=_ref.isTaggedInput,tags=_ref.tags,onTagChange=_ref.onTagChange,trailing=_ref.trailing,leading=_ref.leading,labelSuffix=_ref.labelSuffix,labelTrailing=_ref.labelTrailing,_onKeyDown=_ref.onKeyDown,rest=_objectWithoutProperties(_ref,_excluded);var textInputRef=React__default.useRef(null);var mergedRef=useMergeRefs(ref,textInputRef);var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldShowClearButton=_useState2[0],setShouldShowClearButton=_useState2[1];var _useState3=useState(autoFocus!=null?autoFocus:false),_useState4=_slicedToArray(_useState3,2),isInputFocussed=_useState4[0],setIsInputFocussed=_useState4[1];var context=useDatePickerContext();var isDatePickerBodyOpen=context==null?void 0:context.isDatePickerBodyOpen;if(__DEV__){if(format){var hasAlphanumeric=/[a-zA-Z0-9]/.test(format);if(hasAlphanumeric){throw new Error(`[Blade: TextInput] Invalid format "${format}". Only # and special characters allowed, no letters/numbers.`);}}}var formattingResult=useFormattedInput({format:format,onChange:onChange,value:value,defaultValue:defaultValue});var inputValue=format?formattingResult.formattedValue:value;var effectiveMaxCharacters=format?formattingResult.maxLength:maxCharacters;var handleOnChange=React__default.useCallback(function(_ref2){var name=_ref2.name,inputValue=_ref2.value;if(format){formattingResult.handleChange({name:name,value:inputValue});}else {onChange==null?void 0:onChange({name:name,value:inputValue});}},[format,formattingResult.handleChange,onChange]);var _useTaggedInput=useTaggedInput({isTaggedInput:isTaggedInput,tags:tags,onTagChange:onTagChange,isDisabled:isDisabled,onChange:handleOnChange,name:name,value:inputValue,inputRef:textInputRef}),activeTagIndex=_useTaggedInput.activeTagIndex,setActiveTagIndex=_useTaggedInput.setActiveTagIndex,getTags=_useTaggedInput.getTags,handleTaggedInputKeydown=_useTaggedInput.handleTaggedInputKeydown,handleTaggedInputChange=_useTaggedInput.handleTaggedInputChange,handleTagsClear=_useTaggedInput.handleTagsClear;var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isTrailingDropDownOpen=_React$useState2[0],setIsTrailingDropDownOpen=_React$useState2[1];var _React$useState3=React__default.useState(false),_React$useState4=_slicedToArray(_React$useState3,2),isLeadingDropDownOpen=_React$useState4[0],setIsLeadingDropDownOpen=_React$useState4[1];var textInputWrapperRef=useRef(null);useEffect(function(){if(isTrailingDropDownOpen&&isLeadingDropDownOpen||isDatePickerBodyOpen&&isLeadingDropDownOpen){setIsLeadingDropDownOpen(false);}},[isTrailingDropDownOpen,isDatePickerBodyOpen]);useEffect(function(){if(isLeadingDropDownOpen&&isTrailingDropDownOpen){setIsTrailingDropDownOpen(false);}},[isLeadingDropDownOpen]);var leadingDropDown=leading&&getComponentId(leading)==='Dropdown'?leading:null;var trailingDropdown=trailing&&getComponentId(trailing)==='Dropdown'?trailing:null;var _leadingIcon=isIconComponent(leading)?leading:undefined;var _trailingIcon=isIconComponent(trailing)?trailing:undefined;var hasLeadingInteractionElement=!_leadingIcon&&!leadingDropDown&&leading;var hasTrailingInteractionElement=!_trailingIcon&&!trailingDropdown&&trailing;var renderDropdown=function renderDropdown(dropdown,isOpen,setIsOpen,defaultPlacement){if(!dropdown){return null;}return React__default.cloneElement(dropdown,{selectionType:'single',isOpen:isOpen,height:'100%',onOpenChange:function onOpenChange(isOpen){setIsOpen(isOpen);},children:React__default.Children.map(dropdown.props.children,function(child){if(child.type===DropdownOverlay){return React__default.cloneElement(child,{referenceRef:textInputWrapperRef,_isNestedDropdown:true,defaultPlacement:defaultPlacement});}if(getComponentId(child)===dropdownComponentIds.triggers.InputDropdownButton){return React__default.cloneElement(child,{size:size});}return child;})});};var renderLeadingDropDown=renderDropdown(leadingDropDown,isLeadingDropDownOpen,setIsLeadingDropDownOpen,'bottom-start');var renderTrailingDropDown=renderDropdown(trailingDropdown,isTrailingDropDownOpen,setIsTrailingDropDownOpen,'bottom-end');React__default.useEffect(function(){setShouldShowClearButton(Boolean(showClearButton&&(defaultValue!=null?defaultValue:inputValue)));},[showClearButton,defaultValue,inputValue]);var renderClearButton=function renderClearButton(){return jsx(IconButton,{size:"medium",icon:CloseIcon,onClick:function onClick(){var _textInputRef$current;if(isEmpty(inputValue)&&textInputRef.current){if(isReactNative(textInputRef.current)){textInputRef.current.clear();textInputRef.current.focus();}else if(textInputRef.current instanceof HTMLInputElement){textInputRef.current.value='';textInputRef.current.focus();}}handleTagsClear();onClearButtonClick==null?void 0:onClearButtonClick();textInputRef==null?void 0:(_textInputRef$current=textInputRef.current)==null?void 0:_textInputRef$current.focus();setShouldShowClearButton(false);},isDisabled:isDisabled,accessibilityLabel:"Clear Input Content"});};var hasTrailingDropDown=Boolean(trailingDropdown);var renderInteractionElement=function renderInteractionElement(){if(isLoading){return jsx(Spinner,{accessibilityLabel:"Loading Content",color:"primary"});}if(shouldShowClearButton&&hasTrailingDropDown){return jsxs(BaseBox,{display:"flex",gap:"spacing.3",children:[renderClearButton()," ",jsx(Divider,{orientation:"vertical"})]});}if(showClearButton&&hasTrailingInteractionElement){return jsxs(BaseBox,{display:"flex",gap:"spacing.3",children:[renderClearButton()," ",jsx(Divider,{orientation:"vertical"})," ",trailing]});}if(shouldShowClearButton){return renderClearButton();}if(hasTrailingInteractionElement){return trailing;}return null;};return jsx(BaseInput,Object.assign({id:"textinput",componentName:MetaConstants.TextInput,ref:mergedRef,setInputWrapperRef:function setInputWrapperRef(wrapperNode){textInputWrapperRef.current=wrapperNode;},label:label,labelSuffix:labelSuffix,labelTrailing:labelTrailing,accessibilityLabel:accessibilityLabel,hideLabelText:!Boolean(label),labelPosition:labelPosition,placeholder:placeholder,defaultValue:format?value!==undefined&&defaultValue!==undefined?defaultValue:undefined:defaultValue,value:format?inputValue:value,name:name,maxCharacters:effectiveMaxCharacters,isDropdownTrigger:isTaggedInput,tags:isTaggedInput?getTags({size:size}):undefined,showAllTags:isInputFocussed,maxTagRows:"single",activeTagIndex:activeTagIndex,setActiveTagIndex:setActiveTagIndex,leadingDropDown:renderLeadingDropDown,trailingDropDown:renderTrailingDropDown,leadingInteractionElement:hasLeadingInteractionElement?leading:null,onChange:function onChange(_ref3){var name=_ref3.name,value=_ref3.value;if(showClearButton&&value!=null&&value.length){setShouldShowClearButton(true);}if(shouldShowClearButton&&!(value!=null&&value.length)){setShouldShowClearButton(false);}handleTaggedInputChange({name:name,value:value});handleOnChange({name:name,value:value});},onClick:onClick,onFocus:function onFocus(e){setIsInputFocussed(true);_onFocus==null?void 0:_onFocus(e);},onBlur:function onBlur(e){setIsInputFocussed(false);_onBlur==null?void 0:_onBlur(e);},onKeyDown:function onKeyDown(e){handleTaggedInputKeydown(e);_onKeyDown==null?void 0:_onKeyDown(e);if(format){formattingResult.handleKeyDown(e.event);}},onSubmit:onSubmit,isDisabled:isDisabled,necessityIndicator:necessityIndicator,isRequired:isRequired,leadingIcon:(_ref4=_leadingIcon!=null?_leadingIcon:leadingIcon)!=null?_ref4:icon,prefix:prefix,trailingInteractionElement:renderInteractionElement(),trailingIcon:_trailingIcon!=null?_trailingIcon:trailingIcon,suffix:suffix,validationState:validationState,errorText:errorText,helpText:helpText,successText:successText,trailingFooterSlot:function trailingFooterSlot(value){var _value$length;return format?null:effectiveMaxCharacters?jsx(BaseBox,{marginTop:hintMarginTop[size],marginRight:"spacing.1",children:jsx(CharacterCounter,{currentCount:(_value$length=value==null?void 0:value.length)!=null?_value$length:0,maxCount:effectiveMaxCharacters,size:size})}):null;},autoFocus:autoFocus,testID:testID},getKeyboardAndAutocompleteProps({type:type,keyboardReturnKeyType:keyboardReturnKeyType,autoCompleteSuggestionType:autoCompleteSuggestionType,autoCapitalize:autoCapitalize}),{size:size},rest));};var TextInput=assignWithoutSideEffects(React__default.forwardRef(_TextInput),{displayName:'TextInput'});

export { TextInput };
//# sourceMappingURL=TextInput.js.map