@razorpay/blade 11.17.0 → 11.18.0

package/build/types/components/index.native.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import * as React$1 from 'react';
-import React__default, { ReactNode, ReactElement, ReactChild, SyntheticEvent, KeyboardEvent } from 'react';
-import { View, ViewStyle, ImageSourcePropType, AccessibilityRole, GestureResponderEvent, PressableProps } from 'react-native';
+import React__default, { ReactNode, ReactElement, ReactChild, SyntheticEvent, ImgHTMLAttributes, HTMLAttributeReferrerPolicy, KeyboardEvent } from 'react';
+import { View, ViewStyle, TouchableOpacity, ImageSourcePropType, AccessibilityRole, GestureResponderEvent, PressableProps } from 'react-native';
 import { CSSObject } from 'styled-components';
 import { ReactDOMAttributes } from '@use-gesture/react/dist/declarations/src/types';
 import { CurrencyCodeType } from '@razorpay/i18nify-js/currency';
@@ -2666,6 +2666,10 @@ type ActionListItemProps = {
     onClick?: (clickProps: {
         name: string;
         value?: boolean;
+        event: Platform.Select<{
+            web: React__default.MouseEvent;
+            native: React__default.TouchEvent<TouchableOpacity>;
+        }>;
     }) => void;
     /**
      * value that you get from `onChange` event on SelectInput or in form submissions.
@@ -3164,6 +3168,242 @@ type AmountCommonProps = {
 type AmountProps = AmountTypeProps & AmountCommonProps;
 declare const Amount: ({ value, suffix, type, size, weight, isAffixSubtle, isStrikethrough, color, currencyIndicator, currency, testID, ...styledProps }: AmountProps) => ReactElement;
 
+type BaseLinkCommonProps = {
+    color?: 'primary' | 'white' | 'positive' | 'negative' | 'notice' | 'information' | 'neutral';
+    icon?: IconComponent;
+    iconPosition?: 'left' | 'right';
+    onClick?: (event: SyntheticEvent) => void;
+    onBlur?: Platform.Select<{
+        native: (event: GestureResponderEvent) => void;
+        web: (event: React__default.FocusEvent<HTMLButtonElement>) => void;
+    }>;
+    onMouseLeave?: Platform.Select<{
+        native: (event: GestureResponderEvent) => void;
+        web: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
+    }>;
+    onKeyDown?: Platform.Select<{
+        native: (event: GestureResponderEvent) => void;
+        web: (event: React__default.KeyboardEvent<HTMLButtonElement>) => void;
+    }>;
+    accessibilityProps?: Partial<AccessibilityProps>;
+    /**
+     * Sets the size of the link
+     *
+     * @default medium
+     */
+    size?: Extract<BaseTextSizes, 'xsmall' | 'small' | 'medium' | 'large'>;
+    /**
+     * Defines how far your touch can start away from the link. This is a react-native only prop and has no effect on web.
+     */
+    hitSlop?: {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    } | number;
+    /**
+     * The title of the link which is displayed as a tooltip. This is a web only prop and has no effect on react-native.
+     */
+    htmlTitle?: string;
+    opacity?: number;
+} & TestID & StyledPropsBlade & Omit<BladeCommonEvents, 'onBlur' | 'onMouseLeave'>;
+type BaseLinkWithoutIconProps = BaseLinkCommonProps & {
+    icon?: undefined;
+    children: StringChildrenType;
+};
+type BaseLinkWithIconProps = BaseLinkCommonProps & {
+    icon: IconComponent;
+    children?: StringChildrenType;
+};
+type BaseLinkPropsWithOrWithoutIcon = BaseLinkWithIconProps | BaseLinkWithoutIconProps;
+type BaseLinkAnchorVariantProps = BaseLinkPropsWithOrWithoutIcon & {
+    variant?: 'anchor';
+    href?: string;
+    target?: string;
+    rel?: string;
+    isDisabled?: undefined;
+};
+type BaseLinkButtonVariantProps = BaseLinkPropsWithOrWithoutIcon & {
+    variant?: 'button';
+    isDisabled?: boolean;
+    href?: undefined;
+    target?: undefined;
+    rel?: undefined;
+};
+type BaseLinkProps = BaseLinkAnchorVariantProps | BaseLinkButtonVariantProps;
+
+type BaseButtonCommonProps = {
+    href?: BaseLinkProps['href'];
+    target?: BaseLinkProps['target'];
+    rel?: BaseLinkProps['rel'];
+    size?: 'xsmall' | 'small' | 'medium' | 'large';
+    iconPosition?: 'left' | 'right';
+    isDisabled?: boolean;
+    isFullWidth?: boolean;
+    onKeyDown?: Platform.Select<{
+        native: (event: GestureResponderEvent) => void;
+        web: (event: React__default.KeyboardEvent<HTMLButtonElement>) => void;
+    }>;
+    onClick?: Platform.Select<{
+        native: (event: GestureResponderEvent) => void;
+        web: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
+    }>;
+    type?: 'button' | 'reset' | 'submit';
+    isLoading?: boolean;
+    accessibilityProps?: Partial<AccessibilityProps>;
+    variant?: 'primary' | 'secondary' | 'tertiary';
+    color?: 'primary' | 'white' | 'positive' | 'negative' | 'notice' | 'information' | 'neutral';
+} & TestID & StyledPropsBlade & BladeCommonEvents;
+type BaseButtonWithoutIconProps = BaseButtonCommonProps & {
+    icon?: undefined;
+    children: StringChildrenType;
+};
+type BaseButtonWithIconProps = BaseButtonCommonProps & {
+    icon: IconComponent;
+    children?: StringChildrenType;
+};
+type BaseButtonProps = BaseButtonWithIconProps | BaseButtonWithoutIconProps;
+
+type ButtonCommonProps = {
+    /**
+     * Automatically renders button with `a` tag with `href` on web
+     */
+    href?: BaseButtonProps['href'];
+    /**
+     * anchor target attribute
+     *
+     * Should only be used alongside `href`
+     */
+    target?: BaseButtonProps['target'];
+    /**
+     * anchor rel attribute
+     *
+     * Should only be used alongside `href`
+     */
+    rel?: BaseButtonProps['rel'];
+    variant?: 'primary' | 'secondary' | 'tertiary';
+    color?: 'primary' | 'white' | 'positive' | 'negative';
+    size?: 'xsmall' | 'small' | 'medium' | 'large';
+    iconPosition?: 'left' | 'right';
+    isDisabled?: boolean;
+    isFullWidth?: boolean;
+    isLoading?: boolean;
+    accessibilityLabel?: string;
+    type?: 'button' | 'reset' | 'submit';
+    /**
+     * It is exposed for internal usage with tooltip.
+     *
+     * @private
+     */
+    'aria-describedby'?: string;
+    onClick?: Platform.Select<{
+        native: (event: GestureResponderEvent) => void;
+        web: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
+    }>;
+} & TestID & StyledPropsBlade & BladeCommonEvents;
+type ButtonWithoutIconProps = ButtonCommonProps & {
+    icon?: undefined;
+    children: StringChildrenType;
+};
+type ButtonWithIconProps = ButtonCommonProps & {
+    icon: IconComponent;
+    children?: StringChildrenType;
+};
+type ButtonProps = ButtonWithoutIconProps | ButtonWithIconProps;
+declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<BladeElementRef>>;
+
+type AvatarSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+type AvatarImgProps = {
+    /**
+     * Custom image source
+     */
+    src?: string;
+    /**
+     * The `alt` attribute for the `img` element
+     */
+    alt?: string;
+    /**
+     * The `srcSet` attribute for the `img` element, useful for responsive images.
+     */
+    srcSet?: string;
+    /**
+     * CORS settings attributes
+     */
+    crossOrigin?: ImgHTMLAttributes<''>['crossOrigin'];
+    /**
+     * Defines which referrer is sent when fetching the resource.
+     */
+    referrerPolicy?: HTMLAttributeReferrerPolicy;
+};
+type AvatarGroupProps = {
+    /**
+     * Children elements representing the avatars to stack.
+     */
+    children: React__default.ReactNode;
+    /**
+     * The size of each avatar within the group. Propagates to all avatars.
+     * @default "medium"
+     */
+    size?: AvatarSize;
+    /**
+     * The maximum number of avatars to display before truncating.
+     */
+    maxCount?: number;
+    testID?: string;
+};
+type AvatarCommonProps = {
+    /**
+     * The size of the avatar.
+     * @default "medium"
+     */
+    size?: AvatarSize;
+    /**
+     * The visual variant of the avatar.
+     * @default "circle"
+     */
+    variant?: 'circle' | 'square';
+    /**
+     * The color theme of the avatar.
+     * @default "neutral"
+     */
+    color?: 'primary' | FeedbackColors;
+    /**
+     * Custom icon component to use as the avatar.
+     */
+    icon?: IconComponent;
+    /**
+     * The name of the avatar, used to generate initials.
+     * If src has loaded, the name will be used as the alt attribute of the img. If src is not loaded, the name will be used to create the initials.
+     */
+    name?: string;
+    /**
+     * Automatically renders button with `a` tag with `href` on web
+     */
+    href?: ButtonProps['href'];
+    /**
+     * anchor target attribute
+     *
+     * Should only be used alongside `href`
+     */
+    target?: ButtonProps['target'];
+    /**
+     * anchor rel attribute
+     *
+     * Should only be used alongside `href`
+     */
+    rel?: ButtonProps['rel'];
+    /**
+     * Click handler for the avatar.
+     */
+    onClick?: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
+    testID?: string;
+};
+type AvatarProps = AvatarCommonProps & AvatarImgProps;
+
+declare const Avatar: (_props: AvatarProps) => React.ReactElement;
+
+declare const AvatarGroup: (_props: AvatarGroupProps) => React.ReactElement;
+
 type SnapPoints = [number, number, number];
 
 type BaseFooterProps = {
@@ -3241,70 +3481,6 @@ declare const BottomSheetFooter: ({ children }: BottomSheetFooterProps) => React
 
 declare const BottomSheet: ({ children, snapPoints, isOpen, onDismiss, initialFocusRef, zIndex, }: BottomSheetProps) => React__default.ReactElement;
 
-type BaseLinkCommonProps = {
-    color?: 'primary' | 'white' | 'positive' | 'negative' | 'notice' | 'information' | 'neutral';
-    icon?: IconComponent;
-    iconPosition?: 'left' | 'right';
-    onClick?: (event: SyntheticEvent) => void;
-    onBlur?: Platform.Select<{
-        native: (event: GestureResponderEvent) => void;
-        web: (event: React__default.FocusEvent<HTMLButtonElement>) => void;
-    }>;
-    onMouseLeave?: Platform.Select<{
-        native: (event: GestureResponderEvent) => void;
-        web: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
-    }>;
-    onKeyDown?: Platform.Select<{
-        native: (event: GestureResponderEvent) => void;
-        web: (event: React__default.KeyboardEvent<HTMLButtonElement>) => void;
-    }>;
-    accessibilityProps?: Partial<AccessibilityProps>;
-    /**
-     * Sets the size of the link
-     *
-     * @default medium
-     */
-    size?: Extract<BaseTextSizes, 'xsmall' | 'small' | 'medium' | 'large'>;
-    /**
-     * Defines how far your touch can start away from the link. This is a react-native only prop and has no effect on web.
-     */
-    hitSlop?: {
-        top?: number;
-        right?: number;
-        bottom?: number;
-        left?: number;
-    } | number;
-    /**
-     * The title of the link which is displayed as a tooltip. This is a web only prop and has no effect on react-native.
-     */
-    htmlTitle?: string;
-    opacity?: number;
-} & TestID & StyledPropsBlade & Omit<BladeCommonEvents, 'onBlur' | 'onMouseLeave'>;
-type BaseLinkWithoutIconProps = BaseLinkCommonProps & {
-    icon?: undefined;
-    children: StringChildrenType;
-};
-type BaseLinkWithIconProps = BaseLinkCommonProps & {
-    icon: IconComponent;
-    children?: StringChildrenType;
-};
-type BaseLinkPropsWithOrWithoutIcon = BaseLinkWithIconProps | BaseLinkWithoutIconProps;
-type BaseLinkAnchorVariantProps = BaseLinkPropsWithOrWithoutIcon & {
-    variant?: 'anchor';
-    href?: string;
-    target?: string;
-    rel?: string;
-    isDisabled?: undefined;
-};
-type BaseLinkButtonVariantProps = BaseLinkPropsWithOrWithoutIcon & {
-    variant?: 'button';
-    isDisabled?: boolean;
-    href?: undefined;
-    target?: undefined;
-    rel?: undefined;
-};
-type BaseLinkProps = BaseLinkAnchorVariantProps | BaseLinkButtonVariantProps;
-
 type LinkCommonProps = {
     variant?: 'anchor' | 'button';
     icon?: IconComponent;
@@ -3442,86 +3618,6 @@ declare const Breadcrumb: (_: BreadcrumbProps) => React.ReactElement;
 
 declare const BreadcrumbItem: (_: BreadcrumbItemProps) => React.ReactElement;
 
-type BaseButtonCommonProps = {
-    href?: BaseLinkProps['href'];
-    target?: BaseLinkProps['target'];
-    rel?: BaseLinkProps['rel'];
-    size?: 'xsmall' | 'small' | 'medium' | 'large';
-    iconPosition?: 'left' | 'right';
-    isDisabled?: boolean;
-    isFullWidth?: boolean;
-    onKeyDown?: Platform.Select<{
-        native: (event: GestureResponderEvent) => void;
-        web: (event: React__default.KeyboardEvent<HTMLButtonElement>) => void;
-    }>;
-    onClick?: Platform.Select<{
-        native: (event: GestureResponderEvent) => void;
-        web: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
-    }>;
-    type?: 'button' | 'reset' | 'submit';
-    isLoading?: boolean;
-    accessibilityProps?: Partial<AccessibilityProps>;
-    variant?: 'primary' | 'secondary' | 'tertiary';
-    color?: 'primary' | 'white' | 'positive' | 'negative' | 'notice' | 'information' | 'neutral';
-} & TestID & StyledPropsBlade & BladeCommonEvents;
-type BaseButtonWithoutIconProps = BaseButtonCommonProps & {
-    icon?: undefined;
-    children: StringChildrenType;
-};
-type BaseButtonWithIconProps = BaseButtonCommonProps & {
-    icon: IconComponent;
-    children?: StringChildrenType;
-};
-type BaseButtonProps = BaseButtonWithIconProps | BaseButtonWithoutIconProps;
-
-type ButtonCommonProps = {
-    /**
-     * Automatically renders button with `a` tag with `href` on web
-     */
-    href?: BaseButtonProps['href'];
-    /**
-     * anchor target attribute
-     *
-     * Should only be used alongside `href`
-     */
-    target?: BaseButtonProps['target'];
-    /**
-     * anchor rel attribute
-     *
-     * Should only be used alongside `href`
-     */
-    rel?: BaseButtonProps['rel'];
-    variant?: 'primary' | 'secondary' | 'tertiary';
-    color?: 'primary' | 'white' | 'positive' | 'negative';
-    size?: 'xsmall' | 'small' | 'medium' | 'large';
-    iconPosition?: 'left' | 'right';
-    isDisabled?: boolean;
-    isFullWidth?: boolean;
-    isLoading?: boolean;
-    accessibilityLabel?: string;
-    type?: 'button' | 'reset' | 'submit';
-    /**
-     * It is exposed for internal usage with tooltip.
-     *
-     * @private
-     */
-    'aria-describedby'?: string;
-    onClick?: Platform.Select<{
-        native: (event: GestureResponderEvent) => void;
-        web: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
-    }>;
-} & TestID & StyledPropsBlade & BladeCommonEvents;
-type ButtonWithoutIconProps = ButtonCommonProps & {
-    icon?: undefined;
-    children: StringChildrenType;
-};
-type ButtonWithIconProps = ButtonCommonProps & {
-    icon: IconComponent;
-    children?: StringChildrenType;
-};
-type ButtonProps = ButtonWithoutIconProps | ButtonWithIconProps;
-declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<BladeElementRef>>;
-
 type IconButtonProps = {
     /**
      * Icon component to be rendered, eg. `CloseIcon`
@@ -6382,6 +6478,45 @@ type TextInputPropsWithLabel = {
 type TextInputProps = (TextInputPropsWithA11yLabel | TextInputPropsWithLabel) & TextInputCommonProps;
 declare const TextInput: React__default.ForwardRefExoticComponent<TextInputProps & React__default.RefAttributes<BladeElementRef>>;
 
+type SearchInputCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'helpText' | 'placeholder' | 'defaultValue' | 'name' | 'onChange' | 'onFocus' | 'onBlur' | 'value' | 'isDisabled' | 'autoFocus' | 'onSubmit' | 'autoCapitalize' | 'testID' | 'onClick' | 'size'> & {
+    /**
+     * Event handler to handle the onClick event for clear button.
+     */
+    onClearButtonClick?: () => void;
+    /**
+     * Decides whether to show a loading spinner for the input field.
+     */
+    isLoading?: boolean;
+    /**
+     * Toggle the visibility of the search icon.
+     *
+     * @default true
+     */
+    showSearchIcon?: boolean;
+} & StyledPropsBlade;
+type SearchInputPropsWithA11yLabel = {
+    /**
+     * Label to be shown for the input field
+     */
+    label?: undefined;
+    /**
+     * Accessibility label for the input
+     */
+    accessibilityLabel: string;
+};
+type SearchInputPropsWithLabel = {
+    /**
+     * Label to be shown for the input field
+     */
+    label: string;
+    /**
+     * Accessibility label for the input
+     */
+    accessibilityLabel?: string;
+};
+type SearchInputProps = (SearchInputPropsWithA11yLabel | SearchInputPropsWithLabel) & SearchInputCommonProps;
+declare const SearchInput: React__default.ForwardRefExoticComponent<SearchInputProps & React__default.RefAttributes<BladeElementRef>>;
+
 type CommonProps = Pick<BaseInputProps, 'size' | 'label' | 'labelPosition' | 'name' | 'validationState' | 'errorText' | 'successText' | 'helpText' | 'defaultValue' | 'necessityIndicator' | 'isRequired' | 'isDisabled' | 'onFocus' | 'onBlur' | 'onClick' | 'leadingIcon' | 'trailingIcon' | 'accessibilityLabel' | 'autoFocus' | 'testID' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType'>;
 type PhoneNumberInputProps = StyledPropsBlade & CommonProps & {
     /**
@@ -8557,4 +8692,4 @@ declare const VisuallyHidden: ({ children, testID }: VisuallyHiddenProps) => Rea
  */
 declare const screenReaderStyles: CSSObject;
 
-export { AcceptPaymentsIcon, Accordion, AccordionItem, AccordionItemBody, AccordionItemHeader, AccordionItemProps, AccordionProps, ActionList, ActionListItem, ActionListItemAsset, ActionListItemAssetProps, ActionListItemBadge, ActionListItemBadgeGroup, ActionListItemIcon, ActionListItemProps, ActionListItemText, ActionListProps, ActionListSection, ActionListSectionProps, ActivityIcon, AddressBookIcon, AffordabilityIcon, AirplayIcon, Alert, AlertCircleIcon, AlertOctagonIcon, AlertOnlyIcon, AlertProps, AlertTriangleIcon, AlignCenterIcon, AlignJustifyIcon, AlignLeftIcon, AlignRightIcon, Amount, AmountProps, AnchorIcon, AnnouncementIcon, ApertureIcon, AppStoreIcon, ArrowDownIcon, ArrowDownLeftIcon, ArrowDownRightIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpLeftIcon, ArrowUpRightIcon, AtSignIcon, AttachmentIcon, AutoComplete, AutoCompleteProps, AutomateAccountingIcon, AutomatePayrollIcon, AwardIcon, Badge, BadgeProps, BankAccountVerificationIcon, BankIcon, BarChartAltIcon, BarChartIcon, BarCodeIcon, BatteryChargingIcon, BatteryIcon, BellIcon, BellOffIcon, BfsiIcon, BillIcon, BladeCommonEvents, BladeProvider, BladeProviderProps, BluetoothIcon, BoldIcon, BookIcon, BookmarkIcon, BottomSheet, BottomSheetBody, BottomSheetBodyProps, BottomSheetFooter, BottomSheetFooterProps, BottomSheetHeader, BottomSheetHeaderProps, BottomSheetProps, Box, BoxIcon, BoxProps, BoxRefType, Breadcrumb, BreadcrumbItem, BreadcrumbItemProps, BreadcrumbProps, BriefcaseIcon, BugIcon, BuildingIcon, BulkPayoutsIcon, BusinessBankingIcon, BusinessSpendManagementIcon, Button, ButtonGroup, ButtonProps, CalendarIcon, CameraIcon, CameraOffIcon, Card, CardBody, CardFooter, CardFooterAction, CardFooterLeading, CardFooterTrailing, CardHeader, CardHeaderAmount, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing, CardProps, Carousel, CarouselItem, CarouselProps, CashIcon, CastIcon, CheckCircle2Icon, CheckCircleIcon, CheckIcon, CheckSquareIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsDownIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpIcon, Chip, ChipGroup, ChipGroupProps, ChipProps, ChromeIcon, CircleIcon, ClipboardIcon, ClockIcon, CloseIcon, ClosedCaptioningIcon, CloudDrizzleIcon, CloudIcon, CloudLightningIcon, CloudOffIcon, CloudRainIcon, CloudSnowIcon, Code, CodeProps, CodeSnippetIcon, CodepenIcon, CoinIcon, CoinsIcon, Collapsible, CollapsibleBody, CollapsibleBodyProps, CollapsibleButton, CollapsibleButtonProps, CollapsibleLink, CollapsibleLinkProps, CollapsibleProps, CommandIcon, CompanyRegistrationIcon, CompassIcon, ComponentIds, ConfettiIcon, ContactlessPaymentIcon, CookieIcon, CopyIcon, CopyrightIcon, CornerDownLeftIcon, CornerDownRightIcon, CornerLeftDownIcon, CornerLeftUpIcon, CornerRightDownIcon, CornerRightUpIcon, CornerUpLeftIcon, CornerUpRightIcon, Counter, CounterProps, CpuIcon, CreditCardIcon, CreditsAndLoansIcon, CropIcon, CrosshairIcon, CurrentAccountIcon, CustomersIcon, CutIcon, DashboardIcon, DeleteIcon, DigitalLendingIcon, DisbursePaymentsIcon, DiscIcon, Display, DisplayProps, Divider, DividerProps, DollarIcon, DollarsIcon, DotIcon, DownloadCloudIcon, DownloadIcon, Drawer, DrawerBody, DrawerHeader, DrawerHeaderProps, DrawerProps, Dropdown, DropdownButton, DropdownFooter, DropdownHeader, DropdownLink, DropdownOverlay, DropdownOverlayProps, DropdownProps, DropletIcon, EcommerceIcon, EditComposeIcon, EditIcon, EditInlineIcon, EducationIcon, EscrowAccountIcon, ExportIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FacebookIcon, FastForwardIcon, FeatherIcon, FigmaIcon, FileIcon, FileMinusIcon, FilePlusIcon, FileTextIcon, FileUpload, FileZipIcon, FilmIcon, FilterIcon, FlagIcon, FolderIcon, ForexManagementIcon, FreelanceIcon, FullScreenEnterIcon, FullScreenExitIcon, GithubIcon, GitlabIcon, GlobeIcon, GridIcon, HashIcon, Heading, HeadingProps, HeadphoneIcon, HeadphonesIcon, HeadsetIcon, HeartIcon, HelpCircleIcon, HistoryIcon, HomeIcon, IconButton, IconButtonProps, IconColors, IconComponent, IconProps, IconSize, Identifier, ImageIcon, InboxIcon, Indicator, IndicatorProps, InfoIcon, InstagramIcon, InstantSettlementIcon, InternationalPaymentsIcon, InvoicesIcon, ItalicIcon, LayersIcon, LayoutIcon, LifeBuoyIcon, Link, LinkButtonVariantProps, LinkIcon, LinkProps, List, ListIcon, ListItem, ListItemCode, ListItemCodeProps, ListItemLink, ListItemLinkProps, ListItemProps, ListItemText, ListItemTextProps, ListProps, LoaderIcon, LoansForBusinessesIcon, LockIcon, LogInIcon, LogOutIcon, MagicCheckoutIcon, MailIcon, MailOpenIcon, MapIcon, MapPinIcon, MaximizeIcon, MenuDotsIcon, MenuIcon, MessageCircleIcon, MessageSquareIcon, MicIcon, MicOffIcon, MinimizeIcon, MinusCircleIcon, MinusIcon, MinusSquareIcon, MobileAppIcon, Modal, ModalBody, ModalBodyProps, ModalFooter, ModalFooterProps, ModalHeader, ModalHeaderProps, ModalProps, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoreIcon, MoreVerticalIcon, MoveIcon, MusicIcon, MyAccountIcon, NavigationIcon, OTPInput, OTPInputCommonProps, OTPInputProps, OctagonIcon, OffersIcon, OptimizerIcon, PackageIcon, PaperclipIcon, PasswordInput, PasswordInputProps, PauseCircleIcon, PauseIcon, PaymentButtonIcon, PaymentButtonsIcon, PaymentGatewayIcon, PaymentLinkIcon, PaymentLinksIcon, PaymentPagesIcon, PayoutLinkIcon, PayrollAddonsIcon, PayrollForCaIcon, PayrollForStartupOrSmeIcon, PercentIcon, PhoneCallIcon, PhoneForwardedIcon, PhoneIcon, PhoneIncomingIcon, PhoneMissedIcon, PhoneNumberInput, PhoneNumberInputProps, PhoneOffIcon, PhoneOutgoingIcon, PictureInPictureIcon, PieChartIcon, PinIcon, PlayCircleIcon, PlayIcon, PlusCircleIcon, PlusIcon, PlusSquareIcon, PocketIcon, Popover, PopoverInteractiveWrapper, PopoverProps, PopoverTriggerProps, PosIcon, PowerIcon, PrinterIcon, ProgressBar, ProgressBarProps, ProgressBarVariant, QRCodeIcon, Radio, RadioGroup, RadioGroupProps, RadioIcon, RadioProps, RazorpayIcon, RazorpayXIcon, RazorpayxPayrollIcon, RefreshIcon, RepeatIcon, ReportsIcon, ResizerIcon, RewindIcon, RotateClockWiseIcon, RotateCounterClockWiseIcon, RouteIcon, RoutesIcon, RupeeIcon, RupeesIcon, SaasIcon, SaveIcon, ScissorsIcon, SearchIcon, SelectInput, SelectInputProps, SendIcon, ServerIcon, SettingsIcon, SettlementsIcon, ShareIcon, ShieldIcon, ShoppingBagIcon, ShoppingCartIcon, ShuffleIcon, SidebarIcon, Skeleton, SkeletonProps, SkipBackIcon, SkipForwardIcon, SkipNavContent, SkipNavLink, SlackIcon, SlashIcon, SlidersIcon, SmartCollectIcon, SmartphoneIcon, SolutionsIcon, SourceToPayIcon, SparklesIcon, SpeakerIcon, Spinner, SpinnerProps, SpotlightPopoverStepRenderProps, SpotlightPopoverTourFooter, SpotlightPopoverTourProps, SpotlightPopoverTourStep, SpotlightPopoverTourSteps, SquareIcon, StampIcon, StarIcon, StepGroup, StepGroupProps, StepItem, StepItemIcon, StepItemIndicator, StepItemProps, StopCircleIcon, StorefrontIcon, SubscriptionsIcon, SunIcon, SunriseIcon, SunsetIcon, Switch, SwitchProps, TabItem, TabItemProps, TabList, TabPanel, TabPanelProps, Table, TableBackgroundColors, TableBody, TableBodyProps, TableCell, TableCellProps, TableData, TableFooter, TableFooterCell, TableFooterCellProps, TableFooterProps, TableFooterRow, TableFooterRowProps, TableHeader, TableHeaderCell, TableHeaderCellProps, TableHeaderProps, TableHeaderRow, TableHeaderRowProps, TableNode, TablePagination, TablePaginationCommonProps, TablePaginationProps$1 as TablePaginationProps, TablePaginationType, TableProps, TableRow, TableRowProps, TableToolbar, TableToolbarActions, TableToolbarActionsProps, TableToolbarProps, TabletIcon, Tabs, TabsProps, Tag, TagIcon, TagProps, TargetIcon, TaxPaymentsIcon, TestIcon, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, ThermometerIcon, ThumbsDownIcon, ThumbsUpIcon, TicketIcon, ToastContainer, ToastProps, ToggleLeftIcon, ToggleRightIcon, TokenHqIcon, Tooltip, TooltipInteractiveWrapper, TooltipProps, Tour, TrademarkIcon, TrademarkRegisteredIcon, TransactionsIcon, TrashIcon, TrendingDownIcon, TrendingUpIcon, TriangleIcon, TvIcon, TwitterIcon, TypeIcon, UmbrellaIcon, UnderlineIcon, UnlockIcon, UpiAutopayIcon, UploadCloudIcon, UploadIcon, UseToastReturn, UserCheckIcon, UserIcon, UserMinusIcon, UserPlusIcon, UserXIcon, UsersIcon, VendorPaymentsIcon, VideoIcon, VideoOffIcon, ViewLiveDemoIcon, VisuallyHidden, VisuallyHiddenProps, VoicemailIcon, VolumeHighIcon, VolumeIcon, VolumeLowIcon, VolumeMuteIcon, WalletIcon, WatchIcon, WifiIcon, WifiOffIcon, WindIcon, XCircleIcon, XSquareIcon, ZapIcon, ZoomInIcon, ZoomOutIcon, announce, clearAnnouncer, destroyAnnouncer, getHeadingProps, getTextProps, screenReaderStyles, useTheme, useToast };
+export { AcceptPaymentsIcon, Accordion, AccordionItem, AccordionItemBody, AccordionItemHeader, AccordionItemProps, AccordionProps, ActionList, ActionListItem, ActionListItemAsset, ActionListItemAssetProps, ActionListItemBadge, ActionListItemBadgeGroup, ActionListItemIcon, ActionListItemProps, ActionListItemText, ActionListProps, ActionListSection, ActionListSectionProps, ActivityIcon, AddressBookIcon, AffordabilityIcon, AirplayIcon, Alert, AlertCircleIcon, AlertOctagonIcon, AlertOnlyIcon, AlertProps, AlertTriangleIcon, AlignCenterIcon, AlignJustifyIcon, AlignLeftIcon, AlignRightIcon, Amount, AmountProps, AnchorIcon, AnnouncementIcon, ApertureIcon, AppStoreIcon, ArrowDownIcon, ArrowDownLeftIcon, ArrowDownRightIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpLeftIcon, ArrowUpRightIcon, AtSignIcon, AttachmentIcon, AutoComplete, AutoCompleteProps, AutomateAccountingIcon, AutomatePayrollIcon, Avatar, AvatarGroup, AwardIcon, Badge, BadgeProps, BankAccountVerificationIcon, BankIcon, BarChartAltIcon, BarChartIcon, BarCodeIcon, BatteryChargingIcon, BatteryIcon, BellIcon, BellOffIcon, BfsiIcon, BillIcon, BladeCommonEvents, BladeProvider, BladeProviderProps, BluetoothIcon, BoldIcon, BookIcon, BookmarkIcon, BottomSheet, BottomSheetBody, BottomSheetBodyProps, BottomSheetFooter, BottomSheetFooterProps, BottomSheetHeader, BottomSheetHeaderProps, BottomSheetProps, Box, BoxIcon, BoxProps, BoxRefType, Breadcrumb, BreadcrumbItem, BreadcrumbItemProps, BreadcrumbProps, BriefcaseIcon, BugIcon, BuildingIcon, BulkPayoutsIcon, BusinessBankingIcon, BusinessSpendManagementIcon, Button, ButtonGroup, ButtonProps, CalendarIcon, CameraIcon, CameraOffIcon, Card, CardBody, CardFooter, CardFooterAction, CardFooterLeading, CardFooterTrailing, CardHeader, CardHeaderAmount, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing, CardProps, Carousel, CarouselItem, CarouselProps, CashIcon, CastIcon, CheckCircle2Icon, CheckCircleIcon, CheckIcon, CheckSquareIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsDownIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpIcon, Chip, ChipGroup, ChipGroupProps, ChipProps, ChromeIcon, CircleIcon, ClipboardIcon, ClockIcon, CloseIcon, ClosedCaptioningIcon, CloudDrizzleIcon, CloudIcon, CloudLightningIcon, CloudOffIcon, CloudRainIcon, CloudSnowIcon, Code, CodeProps, CodeSnippetIcon, CodepenIcon, CoinIcon, CoinsIcon, Collapsible, CollapsibleBody, CollapsibleBodyProps, CollapsibleButton, CollapsibleButtonProps, CollapsibleLink, CollapsibleLinkProps, CollapsibleProps, CommandIcon, CompanyRegistrationIcon, CompassIcon, ComponentIds, ConfettiIcon, ContactlessPaymentIcon, CookieIcon, CopyIcon, CopyrightIcon, CornerDownLeftIcon, CornerDownRightIcon, CornerLeftDownIcon, CornerLeftUpIcon, CornerRightDownIcon, CornerRightUpIcon, CornerUpLeftIcon, CornerUpRightIcon, Counter, CounterProps, CpuIcon, CreditCardIcon, CreditsAndLoansIcon, CropIcon, CrosshairIcon, CurrentAccountIcon, CustomersIcon, CutIcon, DashboardIcon, DeleteIcon, DigitalLendingIcon, DisbursePaymentsIcon, DiscIcon, Display, DisplayProps, Divider, DividerProps, DollarIcon, DollarsIcon, DotIcon, DownloadCloudIcon, DownloadIcon, Drawer, DrawerBody, DrawerHeader, DrawerHeaderProps, DrawerProps, Dropdown, DropdownButton, DropdownFooter, DropdownHeader, DropdownLink, DropdownOverlay, DropdownOverlayProps, DropdownProps, DropletIcon, EcommerceIcon, EditComposeIcon, EditIcon, EditInlineIcon, EducationIcon, EscrowAccountIcon, ExportIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FacebookIcon, FastForwardIcon, FeatherIcon, FigmaIcon, FileIcon, FileMinusIcon, FilePlusIcon, FileTextIcon, FileUpload, FileZipIcon, FilmIcon, FilterIcon, FlagIcon, FolderIcon, ForexManagementIcon, FreelanceIcon, FullScreenEnterIcon, FullScreenExitIcon, GithubIcon, GitlabIcon, GlobeIcon, GridIcon, HashIcon, Heading, HeadingProps, HeadphoneIcon, HeadphonesIcon, HeadsetIcon, HeartIcon, HelpCircleIcon, HistoryIcon, HomeIcon, IconButton, IconButtonProps, IconColors, IconComponent, IconProps, IconSize, Identifier, ImageIcon, InboxIcon, Indicator, IndicatorProps, InfoIcon, InstagramIcon, InstantSettlementIcon, InternationalPaymentsIcon, InvoicesIcon, ItalicIcon, LayersIcon, LayoutIcon, LifeBuoyIcon, Link, LinkButtonVariantProps, LinkIcon, LinkProps, List, ListIcon, ListItem, ListItemCode, ListItemCodeProps, ListItemLink, ListItemLinkProps, ListItemProps, ListItemText, ListItemTextProps, ListProps, LoaderIcon, LoansForBusinessesIcon, LockIcon, LogInIcon, LogOutIcon, MagicCheckoutIcon, MailIcon, MailOpenIcon, MapIcon, MapPinIcon, MaximizeIcon, MenuDotsIcon, MenuIcon, MessageCircleIcon, MessageSquareIcon, MicIcon, MicOffIcon, MinimizeIcon, MinusCircleIcon, MinusIcon, MinusSquareIcon, MobileAppIcon, Modal, ModalBody, ModalBodyProps, ModalFooter, ModalFooterProps, ModalHeader, ModalHeaderProps, ModalProps, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoreIcon, MoreVerticalIcon, MoveIcon, MusicIcon, MyAccountIcon, NavigationIcon, OTPInput, OTPInputCommonProps, OTPInputProps, OctagonIcon, OffersIcon, OptimizerIcon, PackageIcon, PaperclipIcon, PasswordInput, PasswordInputProps, PauseCircleIcon, PauseIcon, PaymentButtonIcon, PaymentButtonsIcon, PaymentGatewayIcon, PaymentLinkIcon, PaymentLinksIcon, PaymentPagesIcon, PayoutLinkIcon, PayrollAddonsIcon, PayrollForCaIcon, PayrollForStartupOrSmeIcon, PercentIcon, PhoneCallIcon, PhoneForwardedIcon, PhoneIcon, PhoneIncomingIcon, PhoneMissedIcon, PhoneNumberInput, PhoneNumberInputProps, PhoneOffIcon, PhoneOutgoingIcon, PictureInPictureIcon, PieChartIcon, PinIcon, PlayCircleIcon, PlayIcon, PlusCircleIcon, PlusIcon, PlusSquareIcon, PocketIcon, Popover, PopoverInteractiveWrapper, PopoverProps, PopoverTriggerProps, PosIcon, PowerIcon, PrinterIcon, ProgressBar, ProgressBarProps, ProgressBarVariant, QRCodeIcon, Radio, RadioGroup, RadioGroupProps, RadioIcon, RadioProps, RazorpayIcon, RazorpayXIcon, RazorpayxPayrollIcon, RefreshIcon, RepeatIcon, ReportsIcon, ResizerIcon, RewindIcon, RotateClockWiseIcon, RotateCounterClockWiseIcon, RouteIcon, RoutesIcon, RupeeIcon, RupeesIcon, SaasIcon, SaveIcon, ScissorsIcon, SearchIcon, SearchInput, SearchInputProps, SelectInput, SelectInputProps, SendIcon, ServerIcon, SettingsIcon, SettlementsIcon, ShareIcon, ShieldIcon, ShoppingBagIcon, ShoppingCartIcon, ShuffleIcon, SidebarIcon, Skeleton, SkeletonProps, SkipBackIcon, SkipForwardIcon, SkipNavContent, SkipNavLink, SlackIcon, SlashIcon, SlidersIcon, SmartCollectIcon, SmartphoneIcon, SolutionsIcon, SourceToPayIcon, SparklesIcon, SpeakerIcon, Spinner, SpinnerProps, SpotlightPopoverStepRenderProps, SpotlightPopoverTourFooter, SpotlightPopoverTourProps, SpotlightPopoverTourStep, SpotlightPopoverTourSteps, SquareIcon, StampIcon, StarIcon, StepGroup, StepGroupProps, StepItem, StepItemIcon, StepItemIndicator, StepItemProps, StopCircleIcon, StorefrontIcon, SubscriptionsIcon, SunIcon, SunriseIcon, SunsetIcon, Switch, SwitchProps, TabItem, TabItemProps, TabList, TabPanel, TabPanelProps, Table, TableBackgroundColors, TableBody, TableBodyProps, TableCell, TableCellProps, TableData, TableFooter, TableFooterCell, TableFooterCellProps, TableFooterProps, TableFooterRow, TableFooterRowProps, TableHeader, TableHeaderCell, TableHeaderCellProps, TableHeaderProps, TableHeaderRow, TableHeaderRowProps, TableNode, TablePagination, TablePaginationCommonProps, TablePaginationProps$1 as TablePaginationProps, TablePaginationType, TableProps, TableRow, TableRowProps, TableToolbar, TableToolbarActions, TableToolbarActionsProps, TableToolbarProps, TabletIcon, Tabs, TabsProps, Tag, TagIcon, TagProps, TargetIcon, TaxPaymentsIcon, TestIcon, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, ThermometerIcon, ThumbsDownIcon, ThumbsUpIcon, TicketIcon, ToastContainer, ToastProps, ToggleLeftIcon, ToggleRightIcon, TokenHqIcon, Tooltip, TooltipInteractiveWrapper, TooltipProps, Tour, TrademarkIcon, TrademarkRegisteredIcon, TransactionsIcon, TrashIcon, TrendingDownIcon, TrendingUpIcon, TriangleIcon, TvIcon, TwitterIcon, TypeIcon, UmbrellaIcon, UnderlineIcon, UnlockIcon, UpiAutopayIcon, UploadCloudIcon, UploadIcon, UseToastReturn, UserCheckIcon, UserIcon, UserMinusIcon, UserPlusIcon, UserXIcon, UsersIcon, VendorPaymentsIcon, VideoIcon, VideoOffIcon, ViewLiveDemoIcon, VisuallyHidden, VisuallyHiddenProps, VoicemailIcon, VolumeHighIcon, VolumeIcon, VolumeLowIcon, VolumeMuteIcon, WalletIcon, WatchIcon, WifiIcon, WifiOffIcon, WindIcon, XCircleIcon, XSquareIcon, ZapIcon, ZoomInIcon, ZoomOutIcon, announce, clearAnnouncer, destroyAnnouncer, getHeadingProps, getTextProps, screenReaderStyles, useTheme, useToast };

package/build/types/tokens/index.d.ts

@@ -759,6 +759,8 @@ declare const size: {
     /** 28 px */
     readonly 28: 28;
     /** 32 px */
+    readonly 30: 30;
+    /** 32 px */
     readonly 32: 32;
     /** 33 px */
     readonly 33: 33;

package/build/types/tokens/index.native.d.ts

@@ -759,6 +759,8 @@ declare const size: {
     /** 28 px */
     readonly 28: 28;
     /** 32 px */
+    readonly 30: 30;
+    /** 32 px */
     readonly 32: 32;
     /** 33 px */
     readonly 33: 33;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@razorpay/blade",
   "description": "The Design System that powers Razorpay",
-  "version": "11.17.0",
+  "version": "11.18.0",
   "license": "MIT",
   "engines": {
     "node": ">=18.12.1"