@razorpay/blade 10.8.1 → 10.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -714,6 +714,10 @@ declare type BladeElementRef = Platform.Select<{
714
714
  web: HTMLElement;
715
715
  native: View;
716
716
  }>;
717
+ declare type ContainerElementType = Platform.Select<{
718
+ web: HTMLDivElement;
719
+ native: View;
720
+ }>;
717
721
 
718
722
  declare type ActionListContextProp = Pick<ActionListProps, 'surfaceLevel'>;
719
723
  declare const useActionListContext: () => ActionListContextProp;
@@ -1244,7 +1248,7 @@ declare type LayoutProps = MakeObjectResponsive<{
1244
1248
  width: SpacingValueType;
1245
1249
  minWidth: SpacingValueType;
1246
1250
  maxWidth: SpacingValueType;
1247
- } & PickCSSByPlatform<'display' | 'overflow' | 'overflowX' | 'overflowY' | 'textAlign'>>;
1251
+ } & PickCSSByPlatform<'display' | 'overflow' | 'overflowX' | 'overflowY' | 'textAlign' | 'whiteSpace'>>;
1248
1252
  declare type FlexboxProps = MakeObjectResponsive<{
1249
1253
  /**
1250
1254
  * This uses the native gap property which might not work on older browsers.
@@ -2220,6 +2224,14 @@ declare const Box: React__default.ForwardRefExoticComponent<Partial<PaddingProps
2220
2224
  readonly l?: csstype.Property.TextAlign | undefined;
2221
2225
  readonly xl?: csstype.Property.TextAlign | undefined;
2222
2226
  } | undefined;
2227
+ whiteSpace?: csstype.Property.WhiteSpace | {
2228
+ readonly base?: csstype.Property.WhiteSpace | undefined;
2229
+ readonly xs?: csstype.Property.WhiteSpace | undefined;
2230
+ readonly s?: csstype.Property.WhiteSpace | undefined;
2231
+ readonly m?: csstype.Property.WhiteSpace | undefined;
2232
+ readonly l?: csstype.Property.WhiteSpace | undefined;
2233
+ readonly xl?: csstype.Property.WhiteSpace | undefined;
2234
+ } | undefined;
2223
2235
  overflow?: csstype.Property.Overflow | {
2224
2236
  readonly base?: csstype.Property.Overflow | undefined;
2225
2237
  readonly xs?: csstype.Property.Overflow | undefined;
@@ -2623,6 +2635,41 @@ declare const Box: React__default.ForwardRefExoticComponent<Partial<PaddingProps
2623
2635
  } & MakeObjectResponsive<{
2624
2636
  backgroundColor: "brand.primary.300" | "brand.primary.400" | "brand.primary.500" | "brand.primary.600" | "brand.primary.700" | "brand.primary.800" | "brand.secondary.500" | "brand.gray.200.lowContrast" | "brand.gray.200.highContrast" | "brand.gray.300.lowContrast" | "brand.gray.300.highContrast" | "brand.gray.400.lowContrast" | "brand.gray.400.highContrast" | "brand.gray.500.lowContrast" | "brand.gray.500.highContrast" | "brand.gray.600.lowContrast" | "brand.gray.600.highContrast" | "brand.gray.700.lowContrast" | "brand.gray.700.highContrast" | "brand.gray.a50.lowContrast" | "brand.gray.a50.highContrast" | "brand.gray.a100.lowContrast" | "brand.gray.a100.highContrast" | "surface.background.level1.lowContrast" | "surface.background.level1.highContrast" | "surface.background.level2.lowContrast" | "surface.background.level2.highContrast" | "surface.background.level3.lowContrast" | "surface.background.level3.highContrast" | "transparent";
2625
2637
  }, "backgroundColor"> & {
2638
+ /**
2639
+ * ## Box
2640
+ *
2641
+ * Box is the basic Layout component.
2642
+ *
2643
+ *
2644
+ * Box components supports most spacing CSS properties like `display`, `padding*`, `flex*`, `height`, `width`, etc.
2645
+ *
2646
+ * Check out {@linkcode BoxProps BoxPropsType} for complete list of props and [Layout RFC](https://github.com/razorpay/blade/blob/master/rfcs/2023-01-06-layout.md) for more details on API decision.
2647
+ *
2648
+ * ----
2649
+ *
2650
+ * ### Usage
2651
+ *
2652
+ * ```jsx
2653
+ * <Box display="flex">
2654
+ * ```
2655
+
2656
+ * #### Responsive Props
2657
+ *
2658
+ * ```jsx
2659
+ * <Box padding={{ base: 'spacing.3', m: 'spacing.10' }} />
2660
+ * ```
2661
+ *
2662
+ * #### Margin and Padding Shorthands
2663
+ *
2664
+ * ```jsx
2665
+ * <Box padding={["spacing.3", "spacing.10"]} />
2666
+ * ```
2667
+ *
2668
+ * ---
2669
+ *
2670
+ * Checkout {@link https://blade.razorpay.com/?path=/docs/components-box Box Documentation}
2671
+ *
2672
+ */
2626
2673
  as: "aside" | "div" | "footer" | "header" | "label" | "main" | "nav" | "section" | "span";
2627
2674
  } & {
2628
2675
  children?: React__default.ReactNode | React__default.ReactNode[];
@@ -3531,7 +3578,6 @@ declare type IconButtonProps = {
3531
3578
  * Icon component to be rendered, eg. `CloseIcon`
3532
3579
  */
3533
3580
  icon: IconComponent;
3534
- onClick: () => void;
3535
3581
  /**
3536
3582
  * Icon size
3537
3583
  *
@@ -3552,13 +3598,23 @@ declare type IconButtonProps = {
3552
3598
  * Disabled state for IconButton
3553
3599
  */
3554
3600
  isDisabled?: boolean;
3555
- } & BladeCommonEvents;
3601
+ /**
3602
+ * Sets tabindex property on button element
3603
+ */
3604
+ _tabIndex?: number;
3605
+ } & BladeCommonEvents & Platform.Select<{
3606
+ web: {
3607
+ onClick: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
3608
+ };
3609
+ native: {
3610
+ onClick: (event: GestureResponderEvent) => void;
3611
+ };
3612
+ }>;
3556
3613
  declare const IconButton: React__default.ForwardRefExoticComponent<{
3557
3614
  /**
3558
3615
  * Icon component to be rendered, eg. `CloseIcon`
3559
3616
  */
3560
3617
  icon: IconComponent;
3561
- onClick: () => void;
3562
3618
  /**
3563
3619
  * Icon size
3564
3620
  *
@@ -3579,7 +3635,15 @@ declare const IconButton: React__default.ForwardRefExoticComponent<{
3579
3635
  * Disabled state for IconButton
3580
3636
  */
3581
3637
  isDisabled?: boolean | undefined;
3582
- } & BladeCommonEvents & React__default.RefAttributes<BladeElementRef>>;
3638
+ /**
3639
+ * Sets tabindex property on button element
3640
+ */
3641
+ _tabIndex?: number | undefined;
3642
+ } & BladeCommonEvents & {
3643
+ onClick: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
3644
+ } & {
3645
+ __brand__?: "platform-web" | undefined;
3646
+ } & React__default.RefAttributes<BladeElementRef>>;
3583
3647
 
3584
3648
  declare type OnChange$1 = ({ isChecked, event, value, }: {
3585
3649
  isChecked: boolean;
@@ -4010,6 +4074,14 @@ declare const Checkbox: React__default.ForwardRefExoticComponent<{
4010
4074
  readonly l?: csstype.Property.TextAlign | undefined;
4011
4075
  readonly xl?: csstype.Property.TextAlign | undefined;
4012
4076
  } | undefined;
4077
+ whiteSpace?: csstype.Property.WhiteSpace | {
4078
+ readonly base?: csstype.Property.WhiteSpace | undefined;
4079
+ readonly xs?: csstype.Property.WhiteSpace | undefined;
4080
+ readonly s?: csstype.Property.WhiteSpace | undefined;
4081
+ readonly m?: csstype.Property.WhiteSpace | undefined;
4082
+ readonly l?: csstype.Property.WhiteSpace | undefined;
4083
+ readonly xl?: csstype.Property.WhiteSpace | undefined;
4084
+ } | undefined;
4013
4085
  overflow?: csstype.Property.Overflow | {
4014
4086
  readonly base?: csstype.Property.Overflow | undefined;
4015
4087
  readonly xs?: csstype.Property.Overflow | undefined;
@@ -4576,6 +4648,14 @@ declare const Chip: React__default.ForwardRefExoticComponent<{
4576
4648
  readonly l?: csstype.Property.TextAlign | undefined;
4577
4649
  readonly xl?: csstype.Property.TextAlign | undefined;
4578
4650
  } | undefined;
4651
+ whiteSpace?: csstype.Property.WhiteSpace | {
4652
+ readonly base?: csstype.Property.WhiteSpace | undefined;
4653
+ readonly xs?: csstype.Property.WhiteSpace | undefined;
4654
+ readonly s?: csstype.Property.WhiteSpace | undefined;
4655
+ readonly m?: csstype.Property.WhiteSpace | undefined;
4656
+ readonly l?: csstype.Property.WhiteSpace | undefined;
4657
+ readonly xl?: csstype.Property.WhiteSpace | undefined;
4658
+ } | undefined;
4579
4659
  overflow?: csstype.Property.Overflow | {
4580
4660
  readonly base?: csstype.Property.Overflow | undefined;
4581
4661
  readonly xs?: csstype.Property.Overflow | undefined;
@@ -4702,6 +4782,10 @@ declare type BaseHeaderProps = {
4702
4782
  onBackButtonClick?: () => void;
4703
4783
  closeButtonRef?: React__default.MutableRefObject<any>;
4704
4784
  metaComponentName?: string;
4785
+ /**
4786
+ * inner child of BottomSheetHeader. Meant to be used for AutoComplete only
4787
+ */
4788
+ children?: React__default.ReactElement;
4705
4789
  } & Pick<ReactDOMAttributes, 'onClickCapture' | 'onKeyDown' | 'onKeyUp' | 'onLostPointerCapture' | 'onPointerCancel' | 'onPointerDown' | 'onPointerMove' | 'onPointerUp'> & TestID;
4706
4790
 
4707
4791
  declare type BaseFooterProps = {
@@ -4829,6 +4913,10 @@ declare type BaseInputCommonProps = FormInputLabelProps & FormInputValidationPro
4829
4913
  * Ignores the blur event animation (Used in Select to ignore blur animation when item in option is clicked)
4830
4914
  */
4831
4915
  shouldIgnoreBlurAnimation?: boolean;
4916
+ /**
4917
+ * sets boolean that ignores the blur animations on baseinput
4918
+ */
4919
+ setShouldIgnoreBlurAnimation?: (shouldIgnoreBlurAnimation: boolean) => void;
4832
4920
  /**
4833
4921
  * Used to turn the input field to controlled so user can control the value
4834
4922
  */
@@ -4946,11 +5034,45 @@ declare type BaseInputCommonProps = FormInputLabelProps & FormInputValidationPro
4946
5034
  * true if popup is in expanded state
4947
5035
  */
4948
5036
  isPopupExpanded?: boolean;
4949
- setInputWrapperRef?: (node: HTMLDivElement) => void;
5037
+ setInputWrapperRef?: (node: ContainerElementType) => void;
4950
5038
  /**
4951
5039
  * sets the autocapitalize behavior for the input
4952
5040
  */
4953
5041
  autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters';
5042
+ /**
5043
+ * constraints the height of input to given number rows
5044
+ *
5045
+ * When set to expandable, input takes 1 row in the begining and expands to take 3 when active
5046
+ *
5047
+ * @default 'single'
5048
+ */
5049
+ maxTagRows?: 'single' | 'multiple' | 'expandable';
5050
+ /**
5051
+ * A slot for adding tags to input
5052
+ */
5053
+ tags?: React__default.ReactElement[] | null;
5054
+ /**
5055
+ * Disables stripping of tags and shows all tags
5056
+ */
5057
+ showAllTags?: boolean;
5058
+ /**
5059
+ * State variable of active tag index
5060
+ */
5061
+ activeTagIndex?: number;
5062
+ /**
5063
+ * Is this input SelectInput or AutoComplete
5064
+ */
5065
+ isDropdownTrigger?: boolean;
5066
+ /**
5067
+ * Is the label expected to be rendered inside input?
5068
+ * Used in AutoComplete and Select when label can't exist outside
5069
+ *
5070
+ */
5071
+ isLabelInsideInput?: boolean;
5072
+ /**
5073
+ * State setter for active tag index
5074
+ */
5075
+ setActiveTagIndex?: (activeTagIndex: number) => void;
4954
5076
  } & TestID & Platform.Select<{
4955
5077
  native: {
4956
5078
  /**
@@ -5231,44 +5353,6 @@ declare type OTPInputProps = (OTPInputPropsWithA11yLabel | OTPInputPropsWithLabe
5231
5353
  */
5232
5354
  declare const OTPInput: ({ autoFocus, errorText, helpText, isDisabled, keyboardReturnKeyType, keyboardType, label, accessibilityLabel, labelPosition, name, onChange, onFocus, onBlur, onOTPFilled, otpLength, placeholder, successText, validationState, value, isMasked, autoCompleteSuggestionType, testID, ...styledProps }: OTPInputProps) => React__default.ReactElement;
5233
5355
 
5234
- declare type SelectInputCommonProps = Pick<BaseInputProps, 'label' | 'accessibilityLabel' | 'labelPosition' | 'necessityIndicator' | 'validationState' | 'helpText' | 'errorText' | 'successText' | 'name' | 'isDisabled' | 'isRequired' | 'prefix' | 'suffix' | 'autoFocus' | 'onClick' | 'onFocus' | 'onBlur' | 'placeholder' | 'testID'> & {
5235
- icon?: IconComponent;
5236
- /**
5237
- * Controlled value of the Select. Use it in combination of `onChange`.
5238
- *
5239
- * Check out [Controlled Dropdown Documentation](https://blade.razorpay.com/?path=/story/components-dropdown-with-select--controlled-dropdown&globals=measureEnabled:false) for example.
5240
- */
5241
- value?: string | string[];
5242
- /**
5243
- * Used to set the default value of SelectInput when it's uncontrolled. Use `value` instead for controlled SelectInput
5244
- */
5245
- defaultValue?: string | string[];
5246
- onChange?: ({ name, values }: {
5247
- name?: string;
5248
- values: string[];
5249
- }) => void;
5250
- };
5251
- declare type SelectInputPropsWithA11yLabel = {
5252
- /**
5253
- * Label to be shown for the input field
5254
- */
5255
- label?: undefined;
5256
- /**
5257
- * Accessibility label for the input
5258
- */
5259
- accessibilityLabel: string;
5260
- };
5261
- declare type SelectInputPropsWithLabel = {
5262
- /**
5263
- * Label to be shown for the input field
5264
- */
5265
- label: string;
5266
- /**
5267
- * Accessibility label for the input
5268
- */
5269
- accessibilityLabel?: string;
5270
- };
5271
- declare type SelectInputProps = (SelectInputPropsWithA11yLabel | SelectInputPropsWithLabel) & SelectInputCommonProps;
5272
5356
  /**
5273
5357
  * ### SelectInput
5274
5358
  *
@@ -5296,7 +5380,85 @@ declare type SelectInputProps = (SelectInputPropsWithA11yLabel | SelectInputProp
5296
5380
  *
5297
5381
  * Checkout {@link https://blade.razorpay.com/?path=/docs/components-dropdown-with-select--with-single-select SelectInput Documentation}.
5298
5382
  */
5299
- declare const SelectInput: React__default.ForwardRefExoticComponent<SelectInputProps & React__default.RefAttributes<BladeElementRef>>;
5383
+ declare const SelectInput: React__default.ForwardRefExoticComponent<(({
5384
+ label?: undefined;
5385
+ accessibilityLabel: string;
5386
+ } | {
5387
+ label: string;
5388
+ accessibilityLabel?: string | undefined;
5389
+ }) & Pick<BaseInputProps, "placeholder" | "name" | "label" | "testID" | "prefix" | "onBlur" | "onFocus" | "onClick" | "autoFocus" | "accessibilityLabel" | "isDisabled" | "isRequired" | "validationState" | "necessityIndicator" | "helpText" | "errorText" | "successText" | "suffix"> & {
5390
+ icon?: IconComponent | undefined;
5391
+ value?: string | string[] | undefined;
5392
+ defaultValue?: string | string[] | undefined;
5393
+ onChange?: (({ name, values }: {
5394
+ name?: string | undefined;
5395
+ values: string[];
5396
+ }) => void) | undefined;
5397
+ maxRows?: "multiple" | "single" | "expandable" | undefined;
5398
+ labelPosition?: "left" | "top" | "inside-input" | undefined;
5399
+ }) & React__default.RefAttributes<BladeElementRef>>;
5400
+
5401
+ /**
5402
+ * ### AutoComplete
5403
+ *
5404
+ * Extension on top of SelectInput which allows you type and filter between ActionList items
5405
+ *
5406
+ * To be used in combination of `Dropdown` and `ActionList` component
5407
+ *
5408
+ * ---
5409
+ *
5410
+ * #### Usage in Desktop
5411
+ *
5412
+ * ```diff
5413
+ * <Dropdown>
5414
+ * + <AutoComplete label="Select Fruits" />
5415
+ * <DropdownOverlay>
5416
+ * <ActionList>
5417
+ * <ActionListItem title="Mango" value="mango" />
5418
+ * <ActionListItem title="Apple" value="apple" />
5419
+ * </ActionList>
5420
+ * </DropdownOverlay>
5421
+ * </Dropdown>
5422
+ * ```
5423
+ *
5424
+ * #### Usage in Mobile
5425
+ *
5426
+ * ```diff
5427
+ * <Dropdown>
5428
+ * + <SelectInput label="Select Fruits" />
5429
+ * <BottomSheet>
5430
+ * <BottomSheetHeader>
5431
+ * + <AutoComplete label="Select Fruits" />
5432
+ * </BottomSheetHeader>
5433
+ * <BottomSheetBody>
5434
+ * <ActionList>
5435
+ * <ActionListItem title="Mango" value="mango" />
5436
+ * <ActionListItem title="Apple" value="apple" />
5437
+ * </ActionList>
5438
+ * </BottomSheetBody>
5439
+ * </BottomSheet>
5440
+ * </Dropdown>
5441
+ * ```
5442
+ *
5443
+ * ---
5444
+ *
5445
+ * Checkout {@link https://blade.razorpay.com/?path=/docs/components-dropdown-with-autocomplete--with-single-select AutoComplete Documentation}.
5446
+ */
5447
+ declare const AutoComplete: React__default.ForwardRefExoticComponent<Pick<BaseInputProps, "placeholder" | "name" | "label" | "testID" | "prefix" | "onBlur" | "onFocus" | "onClick" | "autoFocus" | "accessibilityLabel" | "isDisabled" | "isRequired" | "validationState" | "necessityIndicator" | "helpText" | "errorText" | "successText" | "suffix"> & {
5448
+ icon?: IconComponent | undefined;
5449
+ value?: string | string[] | undefined;
5450
+ defaultValue?: string | string[] | undefined;
5451
+ onChange?: (({ name, values }: {
5452
+ name?: string | undefined;
5453
+ values: string[];
5454
+ }) => void) | undefined;
5455
+ maxRows?: "multiple" | "single" | "expandable" | undefined;
5456
+ labelPosition?: "left" | "top" | "inside-input" | undefined;
5457
+ } & {
5458
+ onInputValueChange?: FormInputOnEvent | undefined;
5459
+ inputValue?: string | undefined;
5460
+ filteredValues?: string[] | undefined;
5461
+ } & React__default.RefAttributes<BladeElementRef>>;
5300
5462
 
5301
5463
  declare type IndicatorCommonProps = {
5302
5464
  /**
@@ -5863,6 +6025,14 @@ declare const Radio: React__default.ForwardRefExoticComponent<{
5863
6025
  readonly l?: csstype.Property.TextAlign | undefined;
5864
6026
  readonly xl?: csstype.Property.TextAlign | undefined;
5865
6027
  } | undefined;
6028
+ whiteSpace?: csstype.Property.WhiteSpace | {
6029
+ readonly base?: csstype.Property.WhiteSpace | undefined;
6030
+ readonly xs?: csstype.Property.WhiteSpace | undefined;
6031
+ readonly s?: csstype.Property.WhiteSpace | undefined;
6032
+ readonly m?: csstype.Property.WhiteSpace | undefined;
6033
+ readonly l?: csstype.Property.WhiteSpace | undefined;
6034
+ readonly xl?: csstype.Property.WhiteSpace | undefined;
6035
+ } | undefined;
5866
6036
  overflow?: csstype.Property.Overflow | {
5867
6037
  readonly base?: csstype.Property.Overflow | undefined;
5868
6038
  readonly xs?: csstype.Property.Overflow | undefined;
@@ -6339,6 +6509,14 @@ declare const Switch: React__default.ForwardRefExoticComponent<{
6339
6509
  readonly l?: csstype.Property.TextAlign | undefined;
6340
6510
  readonly xl?: csstype.Property.TextAlign | undefined;
6341
6511
  } | undefined;
6512
+ whiteSpace?: csstype.Property.WhiteSpace | {
6513
+ readonly base?: csstype.Property.WhiteSpace | undefined;
6514
+ readonly xs?: csstype.Property.WhiteSpace | undefined;
6515
+ readonly s?: csstype.Property.WhiteSpace | undefined;
6516
+ readonly m?: csstype.Property.WhiteSpace | undefined;
6517
+ readonly l?: csstype.Property.WhiteSpace | undefined;
6518
+ readonly xl?: csstype.Property.WhiteSpace | undefined;
6519
+ } | undefined;
6342
6520
  overflow?: csstype.Property.Overflow | {
6343
6521
  readonly base?: csstype.Property.Overflow | undefined;
6344
6522
  readonly xs?: csstype.Property.Overflow | undefined;
@@ -6388,10 +6566,20 @@ declare type TagProps = {
6388
6566
  * Used for adding virtual focus on tag.
6389
6567
  *
6390
6568
  * @private
6569
+ */
6570
+ _isVirtuallyFocused?: boolean;
6571
+ /**
6572
+ * Private property for Blade.
6573
+ *
6574
+ * Should not be used by consumers.
6391
6575
  *
6576
+ * Is tag placed inside an input
6577
+ *
6578
+ * @private
6392
6579
  */
6393
- _isTagFocussed?: boolean;
6580
+ _isTagInsideInput?: boolean;
6394
6581
  } & StyledPropsBlade & TestID;
6582
+
6395
6583
  /**
6396
6584
  * ## Tags
6397
6585
  *
@@ -6419,7 +6607,7 @@ declare type TagProps = {
6419
6607
  * Checkout [Tags Documentation](https://blade.razorpay.com/?path=/story/components-tag--default) for more info.
6420
6608
  *
6421
6609
  */
6422
- declare const Tag: ({ size, icon, onDismiss, children, isDisabled, testID, _isTagFocussed, ...styledProps }: TagProps) => React__default.ReactElement | null;
6610
+ declare const Tag: ({ size, icon, onDismiss, children, isDisabled, testID, _isVirtuallyFocused, _isTagInsideInput, ...styledProps }: TagProps) => React__default.ReactElement | null;
6423
6611
 
6424
6612
  declare type SkeletonProps = StyledPropsBlade & Pick<BaseBoxProps, 'width' | 'maxWidth' | 'minWidth' | 'height' | 'maxHeight' | 'minHeight' | 'borderRadius'> & Partial<FlexboxProps> & {
6425
6613
  contrast?: 'low' | 'high';
@@ -6906,7 +7094,7 @@ declare type BottomSheetProps = {
6906
7094
  */
6907
7095
  zIndex?: number;
6908
7096
  };
6909
- declare type BottomSheetHeaderProps = Pick<BaseHeaderProps, 'title' | 'subtitle' | 'leading' | 'showBackButton' | 'onBackButtonClick'> & {
7097
+ declare type BottomSheetHeaderProps = Pick<BaseHeaderProps, 'title' | 'subtitle' | 'leading' | 'showBackButton' | 'onBackButtonClick' | 'children'> & {
6910
7098
  /**
6911
7099
  * Trailing element to be rendered in the Header
6912
7100
  *
@@ -6933,7 +7121,7 @@ declare type BottomSheetBodyProps = {
6933
7121
  padding?: Extract<SpacingValueType, 'spacing.0' | 'spacing.5'>;
6934
7122
  };
6935
7123
 
6936
- declare const BottomSheetHeader: ({ title, subtitle, leading, titleSuffix, trailing, showBackButton, onBackButtonClick, }: BottomSheetHeaderProps) => React__default.ReactElement;
7124
+ declare const BottomSheetHeader: ({ title, subtitle, leading, titleSuffix, trailing, showBackButton, onBackButtonClick, children, }: BottomSheetHeaderProps) => React__default.ReactElement;
6937
7125
 
6938
7126
  declare const BottomSheetFooter: ({ children }: BaseFooterProps) => React__default.ReactElement;
6939
7127
 
@@ -7153,6 +7341,14 @@ declare const TooltipInteractiveWrapper: styled_components.StyledComponent<"div"
7153
7341
  readonly l?: csstype.Property.TextAlign | undefined;
7154
7342
  readonly xl?: csstype.Property.TextAlign | undefined;
7155
7343
  } | undefined;
7344
+ whiteSpace?: csstype.Property.WhiteSpace | {
7345
+ readonly base?: csstype.Property.WhiteSpace | undefined;
7346
+ readonly xs?: csstype.Property.WhiteSpace | undefined;
7347
+ readonly s?: csstype.Property.WhiteSpace | undefined;
7348
+ readonly m?: csstype.Property.WhiteSpace | undefined;
7349
+ readonly l?: csstype.Property.WhiteSpace | undefined;
7350
+ readonly xl?: csstype.Property.WhiteSpace | undefined;
7351
+ } | undefined;
7156
7352
  overflow?: csstype.Property.Overflow | {
7157
7353
  readonly base?: csstype.Property.Overflow | undefined;
7158
7354
  readonly xs?: csstype.Property.Overflow | undefined;
@@ -7668,4 +7864,4 @@ declare const TooltipInteractiveWrapper: styled_components.StyledComponent<"div"
7668
7864
  tabIndex: -1;
7669
7865
  }, "tabIndex" | "data-testid" | "data-blade-component">;
7670
7866
 
7671
- export { Accordion, AccordionItem, AccordionItemProps, AccordionProps, ActionList, ActionListItem, ActionListItemAsset, ActionListItemAssetProps, ActionListItemIcon, ActionListItemProps, ActionListItemText, ActionListProps, ActionListSection, ActionListSectionProps, ActivityIcon, AirplayIcon, Alert, AlertCircleIcon, AlertTriangleIcon as AlertOctagonIcon, AlertOnlyIcon, AlertProps, AlertTriangleIcon$1 as AlertTriangleIcon, AlignCenterIcon, AlignJustifyIcon, AlignLeftIcon, AlignRightIcon, Amount, AmountProps, AnchorIcon, AnnouncementIcon, ApertureIcon, AppStoreIcon, ArrowDownIcon, ArrowDownLeftIcon, ArrowDownRightIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpLeftIcon, ArrowUpRightIcon, AtSignIcon, Attachment as AttachmentIcon, AwardIcon, Badge, BadgeProps, BankIcon, BarChartAltIcon, BarChartIcon, BatteryChargingIcon, BatteryIcon, BellIcon, BellOffIcon, BillIcon, BladeCommonEvents, BladeProvider, BladeProviderProps, BluetoothIcon, BoldIcon, BookIcon, BookmarkIcon, BottomSheet, BottomSheetBody, BottomSheetBodyProps, BottomSheetFooter, BottomSheetFooterProps, BottomSheetHeader, BottomSheetHeaderProps, BottomSheetProps, Box, BoxIcon, BoxProps, BoxRefType, BriefcaseIcon, BulkPayoutsIcon, Button, ButtonProps, CalendarIcon, CameraIcon, CameraOffIcon, Card, CardBody, CardFooter, CardFooterAction, CardFooterLeading, CardFooterTrailing, CardHeader, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing, CardProps, Carousel, CarouselItem, CarouselProps, CastIcon, CheckCircleIcon, CheckIcon, CheckSquareIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsDownIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpIcon, Chip, ChipGroup, ChipGroupProps, ChipProps, ChromeIcon, CircleIcon, ClipboardIcon, ClockIcon, CloseIcon, CloudDrizzleIcon, CloudIcon, CloudLightningIcon, CloudOffIcon, CloudRainIcon, CloudSnowIcon, Code, CodeProps, CodepenIcon, CoinsIcon, Collapsible, CollapsibleBody, CollapsibleBodyProps, CollapsibleButton, CollapsibleButtonProps, CollapsibleLink, CollapsibleLinkProps, CollapsibleProps, CommandIcon, CompassIcon, ComponentIds, CopyIcon, CornerDownLeftIcon, CornerDownRightIcon, CornerLeftDownIcon, CornerLeftUpIcon, CornerRightDownIcon, CornerRightUpIcon, CornerUpLeftIcon, CornerUpRightIcon, Counter, CounterProps, CpuIcon, CreditCardIcon, CropIcon, CrosshairIcon, CustomersIcon, CutIcon, DashboardIcon, DeleteIcon, DiscIcon, Display, DisplayProps, Divider, DividerProps, DollarIcon, DollarsIcon, DownloadCloudIcon, DownloadIcon, Dropdown, DropdownButton, DropdownFooter, DropdownHeader, DropdownLink, DropdownOverlay, DropdownOverlayProps, DropdownProps, DropletIcon, EditComposeIcon, EditIcon, EditInlineIcon, ExportIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FacebookIcon, FastForwardIcon, FeatherIcon, FileIcon, FileMinusIcon, FilePlusIcon, FileTextIcon, FilmIcon, FilterIcon, FlagIcon, FolderIcon, FullScreenEnterIcon, FullScreenExitIcon, GithubIcon, GitlabIcon, GlobeIcon, GridIcon, HashIcon, Heading, HeadingProps, HeadphonesIcon, HeartIcon, HelpCircleIcon, HistoryIcon, HomeIcon, IconButton, IconButtonProps, IconComponent, IconProps, IconSize, ImageIcon, InboxIcon, Indicator, IndicatorProps, InfoIcon, InstagramIcon, InvoicesIcon, ItalicIcon, LayersIcon, LayoutIcon, LifeBuoyIcon, Link, LinkButtonVariantProps, LinkIcon, LinkProps, List, ListIcon, ListItem, ListItemCode, ListItemCodeProps, ListItemLink, ListItemLinkProps, ListItemProps, ListItemText, ListItemTextProps, ListProps, LoaderIcon, LockIcon, LogInIcon, LogOutIcon, MailIcon, MailOpenIcon, MapIcon, MapPinIcon, MaximizeIcon, MenuDotsIcon, MenuIcon, MessageCircleIcon, MessageSquareIcon, MicIcon, MicOffIcon, MinimizeIcon, MinusCircleIcon, MinusIcon, MinusSquareIcon, Modal, ModalBody, ModalBodyProps, ModalFooter, ModalFooterProps, ModalHeader, ModalHeaderProps, ModalProps, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, MoveIcon, MusicIcon, MyAccountIcon, NavigationIcon, OTPInput, OTPInputCommonProps, OctagonIcon, OffersIcon, PackageIcon, PaperclipIcon, PasswordInput, PasswordInputProps, PauseCircleIcon, PauseIcon, PaymentButtonsIcon, PaymentLinksIcon, PaymentPagesIcon, PercentIcon, PhoneCallIcon, PhoneForwardedIcon, PhoneIcon, PhoneIncomingIcon, PhoneMissedIcon, PhoneOffIcon, PhoneOutgoingIcon, PieChartIcon, PlayCircleIcon, PlayIcon, PlusCircleIcon, PlusIcon, PlusSquareIcon, PocketIcon, PowerIcon, PrinterIcon, ProgressBar, ProgressBarProps, ProgressBarVariant, QRCodeIcon, Radio, RadioGroup, RadioGroupProps, RadioIcon, RadioProps, RazorpayIcon, RazorpayXIcon, RefreshIcon, RepeatIcon, ReportsIcon, RewindIcon, RotateClockWiseIcon, RotateCounterClockWiseIcon, RoutesIcon, RupeeIcon, RupeesIcon, SaveIcon, ScissorsIcon, SearchIcon, SelectInput, SelectInputProps, SendIcon, ServerIcon, SettingsIcon, SettlementsIcon, ShareIcon, ShieldIcon, ShoppingCartIcon, ShuffleIcon, SidebarIcon, Skeleton, SkeletonProps, SkipBackIcon, SkipForwardIcon, SkipNavContent, SkipNavLink, SlackIcon, SlashIcon, SlidersIcon, SmartCollectIcon, SmartphoneIcon, SpeakerIcon, Spinner, SpinnerProps, SquareIcon, StampIcon, StarIcon, StopCircleIcon, SubscriptionsIcon, SunIcon, SunriseIcon, SunsetIcon, Switch, SwitchProps, TabletIcon, Tag, TagIcon, TagProps, TargetIcon, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, ThermometerIcon, ThumbsDownIcon, ThumbsUpIcon, Title, TitleProps, ToggleLeftIcon, ToggleRightIcon, Tooltip, TooltipInteractiveWrapper, TooltipProps, TransactionsIcon, TrashIcon, TrendingDownIcon, TrendingUpIcon, TriangleIcon, TvIcon, TwitterIcon, TypeIcon, UmbrellaIcon, UnderlineIcon, UnlockIcon, UploadCloudIcon, UploadIcon, UserCheckIcon, UserIcon, UserMinusIcon, UserPlusIcon, UserXIcon, UsersIcon, VideoIcon, VideoOffIcon, VisuallyHidden, VisuallyHiddenProps, VoicemailIcon, VolumeHighIcon, VolumeIcon, VolumeLowIcon, VolumeMuteIcon, WatchIcon, WifiIcon, WifiOffIcon, WindIcon, XCircleIcon, XSquareIcon, ZapIcon, ZoomInIcon, ZoomOutIcon, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useActionListContext, useTheme };
7867
+ export { Accordion, AccordionItem, AccordionItemProps, AccordionProps, ActionList, ActionListItem, ActionListItemAsset, ActionListItemAssetProps, ActionListItemIcon, ActionListItemProps, ActionListItemText, ActionListProps, ActionListSection, ActionListSectionProps, ActivityIcon, AirplayIcon, Alert, AlertCircleIcon, AlertTriangleIcon as AlertOctagonIcon, AlertOnlyIcon, AlertProps, AlertTriangleIcon$1 as AlertTriangleIcon, AlignCenterIcon, AlignJustifyIcon, AlignLeftIcon, AlignRightIcon, Amount, AmountProps, AnchorIcon, AnnouncementIcon, ApertureIcon, AppStoreIcon, ArrowDownIcon, ArrowDownLeftIcon, ArrowDownRightIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpLeftIcon, ArrowUpRightIcon, AtSignIcon, Attachment as AttachmentIcon, AutoComplete, AwardIcon, Badge, BadgeProps, BankIcon, BarChartAltIcon, BarChartIcon, BatteryChargingIcon, BatteryIcon, BellIcon, BellOffIcon, BillIcon, BladeCommonEvents, BladeProvider, BladeProviderProps, BluetoothIcon, BoldIcon, BookIcon, BookmarkIcon, BottomSheet, BottomSheetBody, BottomSheetBodyProps, BottomSheetFooter, BottomSheetFooterProps, BottomSheetHeader, BottomSheetHeaderProps, BottomSheetProps, Box, BoxIcon, BoxProps, BoxRefType, BriefcaseIcon, BulkPayoutsIcon, Button, ButtonProps, CalendarIcon, CameraIcon, CameraOffIcon, Card, CardBody, CardFooter, CardFooterAction, CardFooterLeading, CardFooterTrailing, CardHeader, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing, CardProps, Carousel, CarouselItem, CarouselProps, CastIcon, CheckCircleIcon, CheckIcon, CheckSquareIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsDownIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpIcon, Chip, ChipGroup, ChipGroupProps, ChipProps, ChromeIcon, CircleIcon, ClipboardIcon, ClockIcon, CloseIcon, CloudDrizzleIcon, CloudIcon, CloudLightningIcon, CloudOffIcon, CloudRainIcon, CloudSnowIcon, Code, CodeProps, CodepenIcon, CoinsIcon, Collapsible, CollapsibleBody, CollapsibleBodyProps, CollapsibleButton, CollapsibleButtonProps, CollapsibleLink, CollapsibleLinkProps, CollapsibleProps, CommandIcon, CompassIcon, ComponentIds, CopyIcon, CornerDownLeftIcon, CornerDownRightIcon, CornerLeftDownIcon, CornerLeftUpIcon, CornerRightDownIcon, CornerRightUpIcon, CornerUpLeftIcon, CornerUpRightIcon, Counter, CounterProps, CpuIcon, CreditCardIcon, CropIcon, CrosshairIcon, CustomersIcon, CutIcon, DashboardIcon, DeleteIcon, DiscIcon, Display, DisplayProps, Divider, DividerProps, DollarIcon, DollarsIcon, DownloadCloudIcon, DownloadIcon, Dropdown, DropdownButton, DropdownFooter, DropdownHeader, DropdownLink, DropdownOverlay, DropdownOverlayProps, DropdownProps, DropletIcon, EditComposeIcon, EditIcon, EditInlineIcon, ExportIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FacebookIcon, FastForwardIcon, FeatherIcon, FileIcon, FileMinusIcon, FilePlusIcon, FileTextIcon, FilmIcon, FilterIcon, FlagIcon, FolderIcon, FullScreenEnterIcon, FullScreenExitIcon, GithubIcon, GitlabIcon, GlobeIcon, GridIcon, HashIcon, Heading, HeadingProps, HeadphonesIcon, HeartIcon, HelpCircleIcon, HistoryIcon, HomeIcon, IconButton, IconButtonProps, IconComponent, IconProps, IconSize, ImageIcon, InboxIcon, Indicator, IndicatorProps, InfoIcon, InstagramIcon, InvoicesIcon, ItalicIcon, LayersIcon, LayoutIcon, LifeBuoyIcon, Link, LinkButtonVariantProps, LinkIcon, LinkProps, List, ListIcon, ListItem, ListItemCode, ListItemCodeProps, ListItemLink, ListItemLinkProps, ListItemProps, ListItemText, ListItemTextProps, ListProps, LoaderIcon, LockIcon, LogInIcon, LogOutIcon, MailIcon, MailOpenIcon, MapIcon, MapPinIcon, MaximizeIcon, MenuDotsIcon, MenuIcon, MessageCircleIcon, MessageSquareIcon, MicIcon, MicOffIcon, MinimizeIcon, MinusCircleIcon, MinusIcon, MinusSquareIcon, Modal, ModalBody, ModalBodyProps, ModalFooter, ModalFooterProps, ModalHeader, ModalHeaderProps, ModalProps, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, MoveIcon, MusicIcon, MyAccountIcon, NavigationIcon, OTPInput, OTPInputCommonProps, OctagonIcon, OffersIcon, PackageIcon, PaperclipIcon, PasswordInput, PasswordInputProps, PauseCircleIcon, PauseIcon, PaymentButtonsIcon, PaymentLinksIcon, PaymentPagesIcon, PercentIcon, PhoneCallIcon, PhoneForwardedIcon, PhoneIcon, PhoneIncomingIcon, PhoneMissedIcon, PhoneOffIcon, PhoneOutgoingIcon, PieChartIcon, PlayCircleIcon, PlayIcon, PlusCircleIcon, PlusIcon, PlusSquareIcon, PocketIcon, PowerIcon, PrinterIcon, ProgressBar, ProgressBarProps, ProgressBarVariant, QRCodeIcon, Radio, RadioGroup, RadioGroupProps, RadioIcon, RadioProps, RazorpayIcon, RazorpayXIcon, RefreshIcon, RepeatIcon, ReportsIcon, RewindIcon, RotateClockWiseIcon, RotateCounterClockWiseIcon, RoutesIcon, RupeeIcon, RupeesIcon, SaveIcon, ScissorsIcon, SearchIcon, SelectInput, SendIcon, ServerIcon, SettingsIcon, SettlementsIcon, ShareIcon, ShieldIcon, ShoppingCartIcon, ShuffleIcon, SidebarIcon, Skeleton, SkeletonProps, SkipBackIcon, SkipForwardIcon, SkipNavContent, SkipNavLink, SlackIcon, SlashIcon, SlidersIcon, SmartCollectIcon, SmartphoneIcon, SpeakerIcon, Spinner, SpinnerProps, SquareIcon, StampIcon, StarIcon, StopCircleIcon, SubscriptionsIcon, SunIcon, SunriseIcon, SunsetIcon, Switch, SwitchProps, TabletIcon, Tag, TagIcon, TagProps, TargetIcon, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, ThermometerIcon, ThumbsDownIcon, ThumbsUpIcon, Title, TitleProps, ToggleLeftIcon, ToggleRightIcon, Tooltip, TooltipInteractiveWrapper, TooltipProps, TransactionsIcon, TrashIcon, TrendingDownIcon, TrendingUpIcon, TriangleIcon, TvIcon, TwitterIcon, TypeIcon, UmbrellaIcon, UnderlineIcon, UnlockIcon, UploadCloudIcon, UploadIcon, UserCheckIcon, UserIcon, UserMinusIcon, UserPlusIcon, UserXIcon, UsersIcon, VideoIcon, VideoOffIcon, VisuallyHidden, VisuallyHiddenProps, VoicemailIcon, VolumeHighIcon, VolumeIcon, VolumeLowIcon, VolumeMuteIcon, WatchIcon, WifiIcon, WifiOffIcon, WindIcon, XCircleIcon, XSquareIcon, ZapIcon, ZoomInIcon, ZoomOutIcon, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useActionListContext, useTheme };