@razorpay/blade 11.20.0 → 11.21.0

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

@@ -3291,7 +3291,7 @@ type TextColors = `interactive.text.${InteractiveText}` | `surface.text.${Surfac
 type As = 'code' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'abbr' | 'q' | 'cite' | 'figcaption' | 'div' | 'label';
 type BaseTextProps = {
     id?: string;
-    color?: TextColors;
+    color?: TextColors | 'currentColor';
     fontFamily?: keyof Theme['typography']['fonts']['family'];
     fontSize?: keyof Theme['typography']['fonts']['size'];
     fontWeight?: keyof Theme['typography']['fonts']['weight'];
@@ -6064,15 +6064,19 @@ type CollapsibleProps = {
     onExpandChange?: ({ isExpanded }: {
         isExpanded: boolean;
     }) => void;
+    /**
+     * **Internal**: disables trigger validations. Used for AccordionButton and SideNavLink internally
+     */
+    _dangerouslyDisableValidations?: boolean;
     /**
      * **Internal**: used to override responsive width restrictions
      */
     _shouldApplyWidthRestrictions?: boolean;
 } & TestID & StyledPropsBlade;
-declare const Collapsible: ({ children, direction, defaultIsExpanded, isExpanded, onExpandChange, testID, _shouldApplyWidthRestrictions, ...styledProps }: CollapsibleProps) => ReactElement;
+declare const Collapsible: ({ children, direction, defaultIsExpanded, isExpanded, onExpandChange, testID, _shouldApplyWidthRestrictions, _dangerouslyDisableValidations, ...styledProps }: CollapsibleProps) => ReactElement;
 
-type CollapsibleLinkProps = Pick<LinkProps, 'size' | 'isDisabled' | 'testID' | 'accessibilityLabel' | 'children'>;
-declare const CollapsibleLink: ({ children, size, isDisabled, testID, accessibilityLabel, }: CollapsibleLinkProps) => ReactElement;
+type CollapsibleLinkProps = Pick<LinkProps, 'color' | 'size' | 'isDisabled' | 'testID' | 'accessibilityLabel' | 'children'> & StyledPropsBlade;
+declare const CollapsibleLink: ({ children, size, color, isDisabled, testID, accessibilityLabel, ...styledProps }: CollapsibleLinkProps) => ReactElement;
 
 type CollapsibleButtonProps = Pick<ButtonProps, 'variant' | 'size' | 'iconPosition' | 'isDisabled' | 'testID' | 'accessibilityLabel' | 'icon' | 'children'>;
 declare const CollapsibleButton: React$1.ForwardRefExoticComponent<CollapsibleButtonProps & React$1.RefAttributes<BladeElementRef>>;
@@ -6080,8 +6084,15 @@ declare const CollapsibleButton: React$1.ForwardRefExoticComponent<CollapsibleBu
 type CollapsibleBodyProps = {
     children: ReactNode;
     width?: BaseBoxProps['width'];
+    /**
+     * Internal
+     *
+     * Set to false to remove margin of CollapsibleBody
+     */
+    _hasMargin?: boolean;
 } & TestID;
-declare const CollapsibleBody: ({ children, testID, width }: CollapsibleBodyProps) => ReactElement;
+
+declare const CollapsibleBody: ({ children, testID, width, _hasMargin, }: CollapsibleBodyProps) => ReactElement;
 
 type DividerProps = {
     /**
@@ -6156,6 +6167,13 @@ type DrawerProps = {
      * Ref to the element that should receive focus when opening the drawer.
      */
     initialFocusRef?: React.MutableRefObject<any>;
+    /**
+     * If `true`, the DrawerBody will be rendered only when it becomes active.
+     * Set to `false` to keep DrawerBody in DOM
+     *
+     * @default true
+     */
+    isLazy?: boolean;
 } & TestID;
 type DrawerHeaderProps = {
     /**
@@ -6223,7 +6241,7 @@ type DrawerHeaderProps = {
  *
  *
  */
-declare const Drawer: ({ isOpen, onDismiss, zIndex, children, accessibilityLabel, showOverlay, initialFocusRef, testID, }: DrawerProps) => React__default.ReactElement;
+declare const Drawer: ({ isOpen, onDismiss, zIndex, children, accessibilityLabel, showOverlay, initialFocusRef, isLazy, testID, }: DrawerProps) => React__default.ReactElement;
 
 /**
  * #### Usage
@@ -6240,6 +6258,7 @@ declare const Drawer: ({ isOpen, onDismiss, zIndex, children, accessibilityLabel
  *
  */
 declare const DrawerHeader: ({ title, subtitle, leading, trailing, titleSuffix, }: DrawerHeaderProps) => React__default.ReactElement;
+declare const drawerPadding = "spacing.6";
 declare const DrawerBody: ({ children }: {
     children: React__default.ReactNode;
 }) => React__default.ReactElement;
@@ -9765,392 +9784,140 @@ type RadioGroupProps = {
 } & TestID & StyledPropsBlade;
 declare const RadioGroup: ({ children, label, helpText, isDisabled, isRequired, necessityIndicator, labelPosition, validationState, errorText, name, defaultValue, onChange, value, size, testID, ...styledProps }: RadioGroupProps) => React__default.ReactElement;
 
-type SkeletonProps = StyledPropsBlade & Pick<BaseBoxProps, 'width' | 'maxWidth' | 'minWidth' | 'height' | 'maxHeight' | 'minHeight' | 'borderRadius'> & Partial<FlexboxProps> & {
-    testID?: string;
-};
-
-declare const Skeleton: ({ width, maxWidth, minWidth, height, maxHeight, minHeight, borderRadius, flexWrap, flexDirection, flexGrow, flexShrink, flexBasis, alignItems, alignContent, alignSelf, justifyItems, justifyContent, justifySelf, placeSelf, placeItems, order, testID, ...props }: SkeletonProps) => React.ReactElement;
-
-type SkipNavLinkProps = {
-    id?: string;
-    children?: StringChildrenType;
-};
-declare const SkipNavLink: ({ id, children, }: SkipNavLinkProps) => React__default.ReactElement;
-type SkipNavContentProps = {
-    id?: string;
-} & TestID;
-declare const SkipNavContent: ({ id, testID, }: SkipNavContentProps) => React__default.ReactElement;
-
-type BaseSpinnerProps = {
-    /**
-     * Sets the color of the spinner.
-     *
-     * @default 'default'
-     */
-    color?: 'primary' | 'white' | FeedbackColors;
-    /**
-     * Sets the label of the spinner.
-     *
-     * @default 'right'
-     */
-    label?: string;
-    /**
-     * Sets the label of the spinner.
-     *
-     */
-    labelPosition?: 'right' | 'bottom';
-    /**
-     * Sets the size of the spinner.
-     *
-     * @default 'medium'
-     */
-    size?: 'medium' | 'large' | 'xlarge';
-    /**
-     * Sets the aria-label for web & accessibilityLabel react-native.
-     *
-     */
-    accessibilityLabel: string;
-} & TestID & StyledPropsBlade;
-
-type SpinnerProps = BaseSpinnerProps & {
-    /**
-     * Sets the color of the spinner.
-     *
-     * @default 'default'
-     */
-    color?: 'primary' | 'neutral' | 'white';
-};
-declare const Spinner: ({ label, labelPosition, accessibilityLabel, color, size, testID, ...styledProps }: SpinnerProps) => React.ReactElement;
-
-type SpotlightPopoverStepRenderProps = {
-    /**
-     * Go to a specific step
-     */
-    goToStep: (step: number) => void;
-    /**
-     * Go to the next step
-     */
-    goToNext: () => void;
-    /**
-     * Go to the previous step
-     */
-    goToPrevious: () => void;
-    /**
-     * Stop the tour
-     *
-     * This will call the `onFinish` callback
-     */
-    stopTour: () => void;
-    /**
-     * Current active step (zero based index)
-     */
-    activeStep: number;
-    /**
-     * Total number of steps
-     */
-    totalSteps: number;
-};
-type Step = {
-    /**
-     * Unique identifier for the tour step
-     */
-    name: string;
-    /**
-     * Content of the Popover
-     */
-    content: (props: SpotlightPopoverStepRenderProps) => React.ReactElement;
-    /**
-     * Footer content
-     */
-    footer?: (props: SpotlightPopoverStepRenderProps) => React.ReactNode;
+type TooltipProps = {
     /**
-     * Popover title
+     * Tooltip title
      */
     title?: string;
     /**
-     * Leading content placed before the title
-     *
-     * Can be any blade icon or asset.
-     */
-    titleLeading?: React.ReactNode;
-    /**
-     * Placement of Popover
-     * @default "top"
+     * Tooltip content
      */
-    placement?: UseFloatingOptions['placement'];
-};
-type SpotlightPopoverTourSteps = Step[];
-type SpotlightPopoverTourProps = {
+    content: string;
     /**
-     * Array of steps to be rendered
+     * Placement of tooltip
      *
-     * The order of the steps will be the order in which they are rendered depending on the `activeStep` prop
-     */
-    steps: SpotlightPopoverTourSteps;
-    /**
-     * Whether the tour is visible or not
-     */
-    isOpen: boolean;
-    /**
-     * Callback when the tour is opened or closed
+     * @default "top"
      */
+    placement?: Exclude<UseFloatingOptions['placement'], 'left-end' | 'left-start' | 'right-end' | 'right-start'>;
+    children: React.ReactElement;
     onOpenChange?: ({ isOpen }: {
         isOpen: boolean;
     }) => void;
     /**
-     * Callback which fires when the `stopTour` method is called from the `steps` array
-     */
-    onFinish?: () => void;
-    /**
-     * Callback when the active step changes
-     */
-    onStepChange?: (step: number) => void;
-    /**
-     * Active step to be rendered
+     * Sets the z-index of the modal
+     * @default 1100
      */
-    activeStep: number;
-    children: React.ReactNode;
-};
-type SpotlightPopoverTourStepProps = {
-    name: string;
-    children: React.ReactNode;
+    zIndex?: number;
 };
 
-declare const SpotlightPopoverTour: ({ steps, activeStep, isOpen, onFinish, onOpenChange, onStepChange, children, }: SpotlightPopoverTourProps) => React__default.ReactElement;
+declare const Tooltip: ({ title, content, children, placement, onOpenChange, zIndex, }: TooltipProps) => React__default.ReactElement;
 
-type SpotlightPopoverFooterAction = {
-    text?: string;
-} & Pick<ButtonProps, 'variant' | 'icon' | 'iconPosition' | 'isDisabled' | 'isLoading' | 'onClick'>;
-type SpotlightPopoverTourFooterProps = {
-    actions: {
-        primary?: SpotlightPopoverFooterAction;
-        secondary?: SpotlightPopoverFooterAction;
+declare const TooltipInteractiveWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, Omit<Partial<PaddingProps & MarginProps & {
+    width: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
     };
-};
-declare const SpotlightPopoverTourFooter: ({ activeStep, totalSteps, actions, }: SpotlightPopoverTourFooterProps & Pick<SpotlightPopoverStepRenderProps, 'activeStep' | 'totalSteps'>) => React.ReactElement;
-
-declare const SpotlightPopoverTourStep: React__default.MemoExoticComponent<({ name, children, }: SpotlightPopoverTourStepProps) => React__default.ReactElement>;
-
-type StepGroupProps = {
-    /**
-     * size of step group
-     *
-     * @default medium
-     */
-    size?: 'medium' | 'large';
-    /**
-     * orientation of step group
-     *
-     * @default vertical
-     */
-    orientation?: 'horizontal' | 'vertical';
-    /**
-     * children slot for StepItem components
-     */
-    children: React__default.ReactElement | React__default.ReactElement[];
-    /**
-     * Width of StepGroup. By default it takes the width of its items.
-     */
-    width?: BoxProps['width'];
-    /**
-     * minWidth prop of StepGroup
-     */
-    minWidth?: BoxProps['minWidth'];
-    /**
-     * maxWidth prop of StepGroup
-     *
-     * @default 100%
-     */
-    maxWidth?: BoxProps['maxWidth'];
-    /**
-     * @private
-     *
-     * DO NOT USE THIS PROP OR YOU WILL BE FIRED (joking. you won't be fired. But something bad will happen for sure)
-     *
-     * This is an internal prop to keep track of nestingLevel of StepGroup
-     */
-    _nestingLevel?: number;
-} & StyledPropsBlade & TestID;
-type StepItemProps = {
-    _index?: number;
-    _nestingLevel?: StepGroupProps['_nestingLevel'];
-    _totalIndex?: number;
-    /**
-     * title of StepItem
-     */
-    title: string;
-    /**
-     * A string that renders in italic font. Made for adding timestamp values.
-     *
-     * ```jsx
-     * timestamp="Thu, 11th Oct23 | 12:00pm"
-     * ```
-     */
-    timestamp?: string;
-    /**
-     * Description of StepItem
-     */
-    description?: string;
-    /**
-     * Progress line of step. When its start only starting part is highlighted and rest is kept dotted
-     *
-     * @default full
-     */
-    stepProgress?: 'start' | 'end' | 'full' | 'none';
-    /**
-     * marker JSX slot. It can be StepItemIndicator or StepItemIcon
-     *
-     * ```jsx
-     * marker={<StepItemIndicator color="positive" />}
-     * marker={<StepItemIcon icon={CheckIcon} color="positive" />}
-     * ```
-     */
-    marker?: React__default.ReactElement;
-    /**
-     * trailing slot for StepItem. Mostly meant for Badge
-     */
-    trailing?: React__default.ReactElement;
-    /**
-     * Controlled state of selected item
-     */
-    isSelected?: boolean;
-    /**
-     * Anchor tag's href value. Turns StepItem into interactive item and render it as `<a>` tag
-     */
-    href?: LinkProps['href'];
-    /**
-     * Anchjor tag's taget value. Meant to be used alongside `href` prop
-     */
-    target?: LinkProps['target'];
-    /**
-     * StepItem's click handler. Turns StepItem into interactive item and render it as button tag
-     */
-    onClick?: (event: React__default.MouseEvent) => void;
-    /**
-     * Children slot for adding additional custom elements to item
-     */
-    children?: React__default.ReactNode;
-};
-
-/**
- * ## StepGroup
- *
- * Step Group visualises sequential processes with a consistent structure. It can be interactive, guiding users through steps, or function as a timeline for reference.
- *
- * ### Usage
- *
- * ```jsx
- * <StepGroup orientation="vertical" size="medium">
- *   <StepItem title="Personal Details" />
- *   <StepItem title="Business Details" />
- * </StepGroup>
- * ```
- *
- * ---
- *
- * Checkout {@link https://blade.razorpay.com/?path=/docs/components-stepgroup--docs StepGroup Documentation}
- */
-declare const StepGroup: ({ size, orientation, children, testID, _nestingLevel, width, minWidth, maxWidth, ...styledProps }: StepGroupProps) => React__default.ReactElement;
-
-/**
- * ## StepItem
- *
- * Component meant to be used inside the StepGroup parent component
- *
- * ### Usage
- *
- * ```jsx
- * <StepGroup orientation="vertical" size="medium">
- *   <StepItem
- *      title="Personal Details"
- *      timestamp="Thu 15th Oct'23 | 12:00pm"
- *      description="Fill your personal details here"
- *      marker={<StepItemIndicator color="negative" />}
- *    />
- * </StepGroup>
- * ```
- *
- * ---
- *
- * Checkout {@link https://blade.razorpay.com/?path=/docs/components-stepgroup--docs StepGroup Documentation}
- */
-declare const StepItem: ({ title, timestamp, description, stepProgress, marker, trailing, isSelected, href, target, onClick, children, _index, _totalIndex, _nestingLevel, }: StepItemProps) => React__default.ReactElement;
-
-declare const StepItemIndicator: ({ color }: {
-    color: IndicatorProps['color'];
-}) => React.ReactElement;
-type StepItemIconProps = {
-    icon: IconComponent;
-    color: IndicatorProps['color'];
-};
-declare const StepItemIcon: ({ icon: Icon, color }: StepItemIconProps) => React.ReactElement;
-
-type OnChange = ({ isChecked, value, event, }: {
-    isChecked: boolean;
-    event?: React.ChangeEvent;
-    value?: string;
-}) => void;
-type SwitchProps = {
-    /**
-     * If `true`, The switch will be checked. This also makes the switch controlled
-     * Use `onChange` to update its value
-     *
-     * @default false
-     */
-    isChecked?: boolean;
-    /**
-     * If `true`, the switch will be initially checked. This also makes the switch uncontrolled
-     *
-     * @default false
-     */
-    defaultChecked?: boolean;
-    /**
-     * The callback invoked when the checked state of the `Switch` changes.
-     */
-    onChange?: OnChange;
-    /**
-     * The name of the input field in a switch
-     * (Useful for form submission).
-     */
-    name?: string;
-    /**
-     * The value to be used in the switch input.
-     * This is the value that will be returned on form submission.
-     */
-    value?: string;
-    /**
-     * If `true`, the switch will be disabled
-     *
-     * @default false
-     */
-    isDisabled?: boolean;
-    /**
-     * Size of the switch
-     *
-     * @default "medium"
-     */
-    size?: 'small' | 'medium';
-    /**
-     * Provides accessible label for internal checkbox component that sets the aria-label prop for screen readers.
-     */
-    accessibilityLabel: string;
-    /**
-     * The id of the input field in a switch, useful for associating a label element with the input via htmlFor prop
-     */
-    id?: string;
-} & TestID & StyledPropsBlade;
-
-declare const Switch: React__default.ForwardRefExoticComponent<{
-    isChecked?: boolean | undefined;
-    defaultChecked?: boolean | undefined;
-    onChange?: OnChange | undefined;
-    name?: string | undefined;
-    value?: string | undefined;
-    isDisabled?: boolean | undefined;
-    size?: "small" | "medium" | undefined;
-    accessibilityLabel: string;
-    id?: string | undefined;
-} & TestID & Partial<Omit<MarginProps & Pick<FlexboxProps, "alignSelf" | "justifySelf" | "order" | "placeSelf"> & {
+    display?: csstype.Property.Display | {
+        readonly base?: csstype.Property.Display | undefined;
+        readonly xs?: csstype.Property.Display | undefined;
+        readonly s?: csstype.Property.Display | undefined;
+        readonly m?: csstype.Property.Display | undefined;
+        readonly l?: csstype.Property.Display | undefined;
+        readonly xl?: csstype.Property.Display | undefined;
+    } | undefined;
+    height: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    maxHeight: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    maxWidth: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    minHeight: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    minWidth: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    overflowX?: csstype.Property.OverflowX | {
+        readonly base?: csstype.Property.OverflowX | undefined;
+        readonly xs?: csstype.Property.OverflowX | undefined;
+        readonly s?: csstype.Property.OverflowX | undefined;
+        readonly m?: csstype.Property.OverflowX | undefined;
+        readonly l?: csstype.Property.OverflowX | undefined;
+        readonly xl?: csstype.Property.OverflowX | undefined;
+    } | undefined;
+    overflowY?: csstype.Property.OverflowY | {
+        readonly base?: csstype.Property.OverflowY | undefined;
+        readonly xs?: csstype.Property.OverflowY | undefined;
+        readonly s?: csstype.Property.OverflowY | undefined;
+        readonly m?: csstype.Property.OverflowY | undefined;
+        readonly l?: csstype.Property.OverflowY | undefined;
+        readonly xl?: csstype.Property.OverflowY | undefined;
+    } | undefined;
+    textAlign?: csstype.Property.TextAlign | {
+        readonly base?: csstype.Property.TextAlign | undefined;
+        readonly xs?: csstype.Property.TextAlign | undefined;
+        readonly s?: csstype.Property.TextAlign | undefined;
+        readonly m?: csstype.Property.TextAlign | undefined;
+        readonly l?: csstype.Property.TextAlign | undefined;
+        readonly xl?: csstype.Property.TextAlign | undefined;
+    } | undefined;
+    whiteSpace?: csstype.Property.WhiteSpace | {
+        readonly base?: csstype.Property.WhiteSpace | undefined;
+        readonly xs?: csstype.Property.WhiteSpace | undefined;
+        readonly s?: csstype.Property.WhiteSpace | undefined;
+        readonly m?: csstype.Property.WhiteSpace | undefined;
+        readonly l?: csstype.Property.WhiteSpace | undefined;
+        readonly xl?: csstype.Property.WhiteSpace | undefined;
+    } | undefined;
+    overflow?: csstype.Property.Overflow | {
+        readonly base?: csstype.Property.Overflow | undefined;
+        readonly xs?: csstype.Property.Overflow | undefined;
+        readonly s?: csstype.Property.Overflow | undefined;
+        readonly m?: csstype.Property.Overflow | undefined;
+        readonly l?: csstype.Property.Overflow | undefined;
+        readonly xl?: csstype.Property.Overflow | undefined;
+    } | undefined;
+    __brand__?: "platform-web" | {
+        readonly base?: "platform-web" | undefined;
+        readonly xs?: "platform-web" | undefined;
+        readonly s?: "platform-web" | undefined;
+        readonly m?: "platform-web" | undefined;
+        readonly l?: "platform-web" | undefined;
+        readonly xl?: "platform-web" | undefined;
+    } | undefined;
+} & FlexboxProps & {
     bottom: SpacingValueType | {
         readonly base?: SpacingValueType | undefined;
         readonly xs?: SpacingValueType | undefined;
@@ -10207,7 +9974,7 @@ declare const Switch: React__default.ForwardRefExoticComponent<{
         readonly l?: "platform-web" | undefined;
         readonly xl?: "platform-web" | undefined;
     } | undefined;
-} & Pick<{
+} & {
     gridAutoColumns?: csstype.Property.GridAutoColumns<string | number> | {
         readonly base?: csstype.Property.GridAutoColumns<string | number> | undefined;
         readonly xs?: csstype.Property.GridAutoColumns<string | number> | undefined;
@@ -10336,112 +10103,20 @@ declare const Switch: React__default.ForwardRefExoticComponent<{
         readonly l?: "platform-web" | undefined;
         readonly xl?: "platform-web" | undefined;
     } | undefined;
-}, "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridArea" | "gridColumn" | "gridRow"> & Pick<{
-    width: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    display?: csstype.Property.Display | {
-        readonly base?: csstype.Property.Display | undefined;
-        readonly xs?: csstype.Property.Display | undefined;
-        readonly s?: csstype.Property.Display | undefined;
-        readonly m?: csstype.Property.Display | undefined;
-        readonly l?: csstype.Property.Display | undefined;
-        readonly xl?: csstype.Property.Display | undefined;
-    } | undefined;
-    height: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    maxHeight: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    maxWidth: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    minHeight: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    minWidth: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    overflowX?: csstype.Property.OverflowX | {
-        readonly base?: csstype.Property.OverflowX | undefined;
-        readonly xs?: csstype.Property.OverflowX | undefined;
-        readonly s?: csstype.Property.OverflowX | undefined;
-        readonly m?: csstype.Property.OverflowX | undefined;
-        readonly l?: csstype.Property.OverflowX | undefined;
-        readonly xl?: csstype.Property.OverflowX | undefined;
-    } | undefined;
-    overflowY?: csstype.Property.OverflowY | {
-        readonly base?: csstype.Property.OverflowY | undefined;
-        readonly xs?: csstype.Property.OverflowY | undefined;
-        readonly s?: csstype.Property.OverflowY | undefined;
-        readonly m?: csstype.Property.OverflowY | undefined;
-        readonly l?: csstype.Property.OverflowY | undefined;
-        readonly xl?: csstype.Property.OverflowY | undefined;
-    } | undefined;
-    textAlign?: csstype.Property.TextAlign | {
-        readonly base?: csstype.Property.TextAlign | undefined;
-        readonly xs?: csstype.Property.TextAlign | undefined;
-        readonly s?: csstype.Property.TextAlign | undefined;
-        readonly m?: csstype.Property.TextAlign | undefined;
-        readonly l?: csstype.Property.TextAlign | undefined;
-        readonly xl?: csstype.Property.TextAlign | undefined;
-    } | undefined;
-    whiteSpace?: csstype.Property.WhiteSpace | {
-        readonly base?: csstype.Property.WhiteSpace | undefined;
-        readonly xs?: csstype.Property.WhiteSpace | undefined;
-        readonly s?: csstype.Property.WhiteSpace | undefined;
-        readonly m?: csstype.Property.WhiteSpace | undefined;
-        readonly l?: csstype.Property.WhiteSpace | undefined;
-        readonly xl?: csstype.Property.WhiteSpace | undefined;
-    } | undefined;
-    overflow?: csstype.Property.Overflow | {
-        readonly base?: csstype.Property.Overflow | undefined;
-        readonly xs?: csstype.Property.Overflow | undefined;
-        readonly s?: csstype.Property.Overflow | undefined;
-        readonly m?: csstype.Property.Overflow | undefined;
-        readonly l?: csstype.Property.Overflow | undefined;
-        readonly xl?: csstype.Property.Overflow | undefined;
-    } | undefined;
-    __brand__?: "platform-web" | {
-        readonly base?: "platform-web" | undefined;
-        readonly xs?: "platform-web" | undefined;
-        readonly s?: "platform-web" | undefined;
-        readonly m?: "platform-web" | undefined;
-        readonly l?: "platform-web" | undefined;
-        readonly xl?: "platform-web" | undefined;
-    } | undefined;
-}, "display"> & Pick<{
+} & {
+    onMouseOver: React$1.MouseEventHandler<HTMLElement>;
+    onMouseEnter: React$1.MouseEventHandler<HTMLElement>;
+    onMouseLeave: React$1.MouseEventHandler<HTMLElement>;
+    onScroll: React$1.UIEventHandler<HTMLElement>;
+} & {
+    draggable: boolean;
+    onDragStart: React$1.DragEventHandler<HTMLElement>;
+    onDragEnter: React$1.DragEventHandler<HTMLElement>;
+    onDragLeave: React$1.DragEventHandler<HTMLElement>;
+    onDragOver: React$1.DragEventHandler<HTMLElement>;
+    onDragEnd: React$1.DragEventHandler<HTMLElement>;
+    onDrop: React$1.DragEventHandler<HTMLElement>;
+} & {
     elevation?: ElevationLevels | {
         readonly base?: ElevationLevels | undefined;
         readonly xs?: ElevationLevels | undefined;
@@ -10706,508 +10381,724 @@ declare const Switch: React__default.ForwardRefExoticComponent<{
         readonly l?: "platform-web" | undefined;
         readonly xl?: "platform-web" | undefined;
     } | undefined;
-}, "visibility">, "__brand__">> & React__default.RefAttributes<BladeElementRef>>;
+} & MakeObjectResponsive<{
+    backgroundColor: "transparent" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense";
+}, "backgroundColor"> & {
+    as: "aside" | "div" | "footer" | "header" | "label" | "main" | "nav" | "section" | "span";
+} & {
+    children?: React$1.ReactNode | React$1.ReactNode[];
+    tabIndex?: number | undefined;
+    id?: string | undefined;
+} & TestID>, "backgroundColor" | "as"> & Partial<{
+    border?: csstype.Property.Border<string | number> | {
+        readonly base?: csstype.Property.Border<string | number> | undefined;
+        readonly xs?: csstype.Property.Border<string | number> | undefined;
+        readonly s?: csstype.Property.Border<string | number> | undefined;
+        readonly m?: csstype.Property.Border<string | number> | undefined;
+        readonly l?: csstype.Property.Border<string | number> | undefined;
+        readonly xl?: csstype.Property.Border<string | number> | undefined;
+    } | undefined;
+    backgroundColor: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | {
+        readonly base?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
+        readonly xs?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
+        readonly s?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
+        readonly m?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
+        readonly l?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
+        readonly xl?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
+    };
+    cursor?: csstype.Property.Cursor | {
+        readonly base?: csstype.Property.Cursor | undefined;
+        readonly xs?: csstype.Property.Cursor | undefined;
+        readonly s?: csstype.Property.Cursor | undefined;
+        readonly m?: csstype.Property.Cursor | undefined;
+        readonly l?: csstype.Property.Cursor | undefined;
+        readonly xl?: csstype.Property.Cursor | undefined;
+    } | undefined;
+    lineHeight: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    opacity?: csstype.Property.Opacity | {
+        readonly base?: csstype.Property.Opacity | undefined;
+        readonly xs?: csstype.Property.Opacity | undefined;
+        readonly s?: csstype.Property.Opacity | undefined;
+        readonly m?: csstype.Property.Opacity | undefined;
+        readonly l?: csstype.Property.Opacity | undefined;
+        readonly xl?: csstype.Property.Opacity | undefined;
+    } | undefined;
+    pointerEvents?: csstype.Property.PointerEvents | {
+        readonly base?: csstype.Property.PointerEvents | undefined;
+        readonly xs?: csstype.Property.PointerEvents | undefined;
+        readonly s?: csstype.Property.PointerEvents | undefined;
+        readonly m?: csstype.Property.PointerEvents | undefined;
+        readonly l?: csstype.Property.PointerEvents | undefined;
+        readonly xl?: csstype.Property.PointerEvents | undefined;
+    } | undefined;
+    touchAction: csstype.Property.TouchAction | {
+        readonly base?: csstype.Property.TouchAction | undefined;
+        readonly xs?: csstype.Property.TouchAction | undefined;
+        readonly s?: csstype.Property.TouchAction | undefined;
+        readonly m?: csstype.Property.TouchAction | undefined;
+        readonly l?: csstype.Property.TouchAction | undefined;
+        readonly xl?: csstype.Property.TouchAction | undefined;
+    } | undefined;
+    userSelect: csstype.Property.UserSelect | {
+        readonly base?: csstype.Property.UserSelect | undefined;
+        readonly xs?: csstype.Property.UserSelect | undefined;
+        readonly s?: csstype.Property.UserSelect | undefined;
+        readonly m?: csstype.Property.UserSelect | undefined;
+        readonly l?: csstype.Property.UserSelect | undefined;
+        readonly xl?: csstype.Property.UserSelect | undefined;
+    } | undefined;
+    borderBottom?: csstype.Property.BorderBottom<string | number> | {
+        readonly base?: csstype.Property.BorderBottom<string | number> | undefined;
+        readonly xs?: csstype.Property.BorderBottom<string | number> | undefined;
+        readonly s?: csstype.Property.BorderBottom<string | number> | undefined;
+        readonly m?: csstype.Property.BorderBottom<string | number> | undefined;
+        readonly l?: csstype.Property.BorderBottom<string | number> | undefined;
+        readonly xl?: csstype.Property.BorderBottom<string | number> | undefined;
+    } | undefined;
+    borderLeft?: csstype.Property.BorderLeft<string | number> | {
+        readonly base?: csstype.Property.BorderLeft<string | number> | undefined;
+        readonly xs?: csstype.Property.BorderLeft<string | number> | undefined;
+        readonly s?: csstype.Property.BorderLeft<string | number> | undefined;
+        readonly m?: csstype.Property.BorderLeft<string | number> | undefined;
+        readonly l?: csstype.Property.BorderLeft<string | number> | undefined;
+        readonly xl?: csstype.Property.BorderLeft<string | number> | undefined;
+    } | undefined;
+    borderRight?: csstype.Property.BorderRight<string | number> | {
+        readonly base?: csstype.Property.BorderRight<string | number> | undefined;
+        readonly xs?: csstype.Property.BorderRight<string | number> | undefined;
+        readonly s?: csstype.Property.BorderRight<string | number> | undefined;
+        readonly m?: csstype.Property.BorderRight<string | number> | undefined;
+        readonly l?: csstype.Property.BorderRight<string | number> | undefined;
+        readonly xl?: csstype.Property.BorderRight<string | number> | undefined;
+    } | undefined;
+    borderTop?: csstype.Property.BorderTop<string | number> | {
+        readonly base?: csstype.Property.BorderTop<string | number> | undefined;
+        readonly xs?: csstype.Property.BorderTop<string | number> | undefined;
+        readonly s?: csstype.Property.BorderTop<string | number> | undefined;
+        readonly m?: csstype.Property.BorderTop<string | number> | undefined;
+        readonly l?: csstype.Property.BorderTop<string | number> | undefined;
+        readonly xl?: csstype.Property.BorderTop<string | number> | undefined;
+    } | undefined;
+    __brand__?: "platform-web" | {
+        readonly base?: "platform-web" | undefined;
+        readonly xs?: "platform-web" | undefined;
+        readonly s?: "platform-web" | undefined;
+        readonly m?: "platform-web" | undefined;
+        readonly l?: "platform-web" | undefined;
+        readonly xl?: "platform-web" | undefined;
+    } | undefined;
+} & {
+    className?: string | undefined;
+    id?: string | undefined;
+    tabIndex?: number | undefined;
+}> & BladeCommonEvents & {
+    'data-blade-component'?: string | undefined;
+    'data-testid'?: string | undefined;
+    tabIndex: -1;
+}, "tabIndex" | "data-testid" | "data-blade-component">;
 
-type TableNode<Item> = Item & {
-    id: Identifier;
-};
-type TableData<Item> = {
-    nodes: TableNode<Item>[];
-};
-type TableBackgroundColors = `surface.background.gray.${DotNotationToken<Theme['colors']['surface']['background']['gray']>}`;
-type TableHeaderProps = {
+type SideNavProps = {
     /**
-     * The children of TableHeader should be TableHeaderRow
-     * @example
-     * <TableHeader>
-     *   <TableHeaderRow>
-     *     <TableHeaderCell>Header Cell 1</TableHeaderCell>
-     *   </TableHeaderRow>
-     * </TableHeader>
-     **/
-    children: React.ReactNode;
-};
-type TableHeaderRowProps = {
+     * Children slot.
+     *
+     * Supports SideNavFooter, SideNavBody
+     */
+    children: React__default.ReactNode;
     /**
-     * The children of TableHeaderRow should be TableHeaderCell
-     * @example
-     * <TableHeader>
-     *   <TableHeaderRow>
-     *     <TableHeaderCell>Header Cell 1</TableHeaderCell>
-     *   </TableHeaderRow>
-     * </TableHeader>
-     **/
-    children: React.ReactNode;
-    /**
-     * The rowDensity prop determines the density of the table.
-     * The rowDensity prop can be 'compact', 'normal', or'comfortable'.
-     * The default value is `normal`.
-     **/
-    rowDensity?: TableProps<unknown>['rowDensity'];
-};
-type TableHeaderCellProps = {
-    /**
-     * The children of TableHeaderCell can be a string or a ReactNode.
-     **/
-    children: string | React.ReactNode;
-    /**
-     * The unique key of the column.
-     * This is used to identify the column for sorting in sortFunctions prop of Table.
-     * Sorting is enabled only for columns whose key is present in sortableColumns prop of Table.
-     **/
-    headerKey?: string;
-};
-type TableProps<Item> = {
-    /**
-     * The children of the Table component should be a function that returns TableHeader, TableBody and TableFooter components.
-     * The function will be called with the tableData prop.
+     * **Only applicable in mobile**
+     *
+     * State for opening / closing the SideNav in mobile
      */
-    children: (tableData: TableNode<Item>[]) => React.ReactElement;
+    isOpen?: DrawerProps['isOpen'];
     /**
-     * The data prop is an object with a nodes property that is an array of objects.
-     * Each object in the array is a row in the table.
-     * The object should have an id property that is a unique identifier for the row.
+     * **Only applicable in mobile**
+     *
+     * Callback when SideNav is closed
      */
-    data: TableData<Item>;
-    /**
-     * The selectionType prop determines the type of selection that is allowed on the table.
-     * The selectionType prop can be 'none', 'single' or 'multiple'.
-     * @default 'none'
-     **/
-    selectionType?: 'none' | 'single' | 'multiple';
-    /**
-     * The onSelectionChange prop is a function that is called when the selection changes.
-     * The function is called with an object that has a values property that is an array of the selected rows.
-     **/
-    onSelectionChange?: ({ values }: {
-        values: TableNode<Item>[];
-    }) => void;
-    /**
-     * The isHeaderSticky prop determines whether the table header is sticky or not.
-     * The default value is `false`.
-     **/
-    isHeaderSticky?: boolean;
-    /**
-     * The isFooterSticky prop determines whether the table footer is sticky or not.
-     * The default value is `false`.
-     **/
-    isFooterSticky?: boolean;
-    /**
-     * The isFirstColumnSticky prop determines whether the first column is sticky or not.
-     * The default value is `false`.
-     **/
-    isFirstColumnSticky?: boolean;
+    onDismiss?: DrawerProps['onDismiss'];
     /**
-     * The rowDensity prop determines the density of the table.
-     * The rowDensity prop can be 'compact', 'normal', or'comfortable'.
-     * The default value is `normal`.
-     **/
-    rowDensity?: 'compact' | 'normal' | 'comfortable';
+     * Banner slot for usecases like adding Activation Panel
+     *
+     * **IMPORTANT** Avoid adding promotional items in this
+     */
+    banner?: React__default.ReactElement;
+} & StyledPropsBlade & TestID;
+type SideNavLinkProps = {
     /**
-     * The onSortChange prop is a function that is called when the sort changes.
-     * The function is called with an object that has a sortKey property that is the key of the column that is sorted and a isSortReversed property that is a boolean that determines whether the sort is reversed or not.
-     **/
-    onSortChange?: ({ sortKey, isSortReversed, }: {
-        sortKey: TableHeaderCellProps['headerKey'];
-        isSortReversed: boolean;
-    }) => void;
+     * title of the Link
+     */
+    title: string;
     /**
-     * The sortFunctions prop is an object that has a key for each column that is sortable.
-     * The value of each key is a function that is called when the column is sorted.
-     * The function is called with an array of the rows in the table.
-     * The function should return an array of the rows in the table.
-     **/
-    sortFunctions?: Record<string, (array: TableNode<Item>[]) => TableNode<Item>[]>;
+     * Slot after the title.
+     *
+     * Used for <Badge />, <Counter /> in most cases
+     */
+    titleSuffix?: React__default.ReactElement;
     /**
-     * The toolbar prop is a React element that is rendered above the table.
-     * The toolbar prop should be a `TableToolbar` component.
-     **/
-    toolbar?: React.ReactElement;
+     * Trailing slot for item. Only visible on hover of the item
+     *
+     * Used for <Button />
+     */
+    trailing?: React__default.ReactElement;
     /**
-     * The pagination prop is a React element that is rendered below the table.
-     * The pagination prop should be a `TablePagination` component.
-     **/
-    pagination?: React.ReactElement;
+     * href of the link
+     */
+    href?: LinkProps['href'];
     /**
-     * The height prop is a responsive styled prop that determines the height of the table.
-     **/
-    height?: BoxProps['height'];
+     * Anchor tag `target` attribute
+     */
+    target?: LinkProps['target'];
     /**
-     * The showStripedRows prop determines whether the table should have striped rows or not.
-     * The default value is `false`.
-     **/
-    showStripedRows?: boolean;
+     * as prop to pass ReactRouter's Link component.
+     *
+     * ```jsx
+     * import { Link } from 'react-router-dom';
+     *
+     * <SideNavLink as={Link} />
+     * ```
+     */
+    as: React__default.ComponentType<any>;
     /**
-     * The gridTemplateColumns prop determines the grid-template-columns CSS property of the table.
-     * The default value is `repeat(${columnCount},minmax(100px, 1fr))`.
-     **/
-    gridTemplateColumns?: string;
+     * Set Active state of SideNavLink.
+     *
+     * Checkout SideNav documentation for usage
+     */
+    isActive?: boolean;
     /**
-     * The isLoading prop determines whether the table is loading or not.
-     * The default value is `false`.
-     **/
-    isLoading?: boolean;
+     * Leading icon for SideNavLink
+     */
+    icon?: IconComponent;
     /**
-     * The isRefreshing prop determines whether the table is refreshing or not.
-     * The default value is `false`.
-     **/
-    isRefreshing?: boolean;
-} & StyledPropsBlade;
-type Identifier = string | number;
-type TableBodyProps = {
+     * Children slot to add Nested Menu
+     *
+     * ```jsx
+     * <SideNavLink title="L2 Trigger" href="/l2-first-item">
+     *  <SideNavLevel>
+     *    <SideNavLink title="L2 Item" href="/l2-first-item" />
+     *    <SideNavLink title="L2 Item 2" href="/l2-second-item" />
+     *  </SideNavLevel>
+     * </SideNavLink>
+     * ```
+     */
+    children?: React__default.ReactElement;
     /**
-     * The children of the TableBody component should be TableRow components.
-     * @example
-     * <TableBody>
-     *   <TableRow>
-     *     <TableCell>...</TableCell>
-     *   </TableRow>
-     * </TableBody>
-     **/
-    children: React.ReactNode;
+     * Tooltip object to add tooltip to SideNavLink
+     *
+     * ```jsx
+     * <SideNavLink
+     *  tooltip={{
+     *    title: 'Tooltip Title',
+     *    content: 'Tooltip description'
+     *  }}
+     * />
+     * ```
+     */
+    tooltip?: Pick<TooltipProps, 'title' | 'content' | 'onOpenChange'>;
 };
-type TableRowProps<Item> = {
-    /**
-     * The children of the TableRow component should be TableCell components.
-     * @example
-     * <TableRow>
-     *   <TableCell>...</TableCell>
-     * </TableRow>
-     **/
-    children: React.ReactNode;
-    /**
-     * The item prop is used to pass the individual table item to the TableRow component.
-     * @example
-     * tableData.map((tableItem) => (
-     *   <TableRow item={item}>
-     *     <TableCell>...</TableCell>
-     *   </TableRow>
-     * ));
-     **/
-    item: TableNode<Item>;
+type SideNavSectionProps = {
+    title?: string;
     /**
-     * The isDisabled prop is used to disable the TableRow component.
-     * @example
-     * <TableRow isDisabled>
-     *   <TableCell>...</TableCell>
-     * </TableRow>
-     **/
-    isDisabled?: boolean;
+     * Number of items after which the items are collapsed into `+x more`
+     */
+    maxVisibleItems?: number;
     /**
-     * Callback triggered when the row is hovered. It is called with the current row item prop.
+     * Default value if the nav section is expanded or collapsed after maxVisibleItems
+     *
+     * @default false
      */
-    onHover?: ({ item }: {
-        item: TableNode<Item>;
-    }) => void;
+    defaultIsExpanded?: boolean;
     /**
-     * Callback triggered when the row is clicked. It is called with the current row item prop.
+     * Callback when `+x more is clicked`
      */
-    onClick?: ({ item }: {
-        item: TableNode<Item>;
+    onExpandChange?: ({ isExpanded }: {
+        isExpanded: boolean;
     }) => void;
-};
-type TableCellProps = {
     /**
-     * The children of the TableCell component should be a string or a ReactNode.
-     * @example
-     * <TableCell>{'Hello'}</TableCell>
-     * <TableCell>
-     *  <Text>...</Text>
-     * </TableCell>
-     * <TableCell>
-     * <Button>...</Button>
-     * </TableCell>
-     **/
-    children: React.ReactNode;
+     * Children slot for SideNavLink
+     */
+    children: React__default.ReactElement[];
 };
-type TableFooterProps = {
+type SideNavFooterProps = {
     /**
-     * The children of TableFooter should be TableFooterRow
-     * @example
-     * <TableFooter>
-     *   <TableFooterRow>
-     *     <TableFooterCell>Footer Cell 1</TableFooterCell>
-     *   </TableFooterRow>
-     * </TableFooter>
-     **/
-    children: React.ReactNode;
+     * Children slot for SideNavLink, SideNavItem
+     */
+    children: React__default.ReactElement[] | React__default.ReactElement;
 };
-type TableFooterRowProps = {
+type SideNavItemProps = {
     /**
-     * The children of TableFooterRow should be TableFooterCell
-     * @example
-     * <TableFooter>
-     *   <TableFooterRow>
-     *     <TableFooterCell>Footer Cell 1</TableFooterCell>
-     *   </TableFooterRow>
-     * </TableFooter>
-     **/
-    children: React.ReactNode;
-};
-type TableFooterCellProps = {
+     * Leading slot for SideNavItem.
+     *
+     * Meant for Indicator, Icon, etc
+     */
+    leading: React__default.ReactElement;
     /**
-     * The children of TableHeaderCell can be a string or a ReactNode.
-     **/
-    children: string | React.ReactNode;
-};
-type TablePaginationCommonProps = {
+     * Trailing slot for SideNavItem.
+     *
+     * Meant for Button, Switch, etc
+     */
+    trailing: React__default.ReactElement;
     /**
-     * The default page size.
-     * Page size controls how rows are shown per page.
-     * @default 10
-     **/
-    defaultPageSize?: 10 | 25 | 50;
+     * Title of SideNavItem
+     */
+    title: string;
     /**
-     * The current page. Passing this prop will make the component controlled and will not update the page on its own.
-     **/
-    currentPage?: number;
+     * Render item of container. Use as="label" when using Switch or form input in trailing
+     *
+     * @default div
+     */
+    as?: 'label' | 'div';
     /**
-     * Callback function that is called when the page size is changed
+     * backgroundColor of the item
+     *
+     * @default undefined
      */
-    onPageSizeChange?: ({ pageSize }: {
-        pageSize: number;
-    }) => void;
+    backgroundColor?: BaseBoxProps['backgroundColor'];
     /**
-     * Whether to show the page size picker. It will be always be hidden on mobile.
-     * Page size picker controls how rows are shown per page.
-     * @default true
-     */
-    showPageSizePicker?: boolean;
-    /**
-     * Whether to show the page number selector. It will be always be hidden on mobile.
-     * Page number selectors is a group of buttons that allows the user to jump to a specific page.
-     * @default false
-     */
-    showPageNumberSelector?: boolean;
-    /**
-     * Content of the label to be shown in the pagination component
-     * @default `Showing 1 to ${totalItems} Items`
-     */
-    label?: string;
-    /**
-     * Whether to show the label. It will be always be hidden on mobile.
-     * @default false
-     */
-    showLabel?: boolean;
-};
-type TablePaginationType = 'client' | 'server';
-type TablePaginationServerProps = TablePaginationCommonProps & {
-    /**
-     * Whether the pagination is happening on client or server.
-     * If the pagination is happening on `client`, the Table component will **divide the data into pages** and show the pages based on the page size.
-     * If the pagination is happening on `server`, the Table component will **not divide the data into pages and will show all the data**. You will have to fetch data for each page as the page changes and pass it to the Table component.
-     * When paginationType is `server`, the `onPageChange` & `totalItemCount` props are required.
-     * @default 'client'
-     * */
-    paginationType?: Extract<TablePaginationType, 'server'>;
-    /**
-     * The total number of possible items in the table. This is used to calculate the total number of pages when pagination is happening on server and not all the data is fetched at once.
-     */
-    totalItemCount: number;
-    /**
-     * Callback function that is called when the page is changed
+     * Tooltip object to add tooltip to SideNavItem
+     *
+     * ```jsx
+     * <SideNavItem
+     *  tooltip={{
+     *    title: 'Tooltip Title',
+     *    content: 'Tooltip description'
+     *  }}
+     * />
+     * ```
      */
-    onPageChange: ({ page }: {
-        page: number;
-    }) => void;
+    tooltip?: SideNavLinkProps['tooltip'];
 };
-type TablePaginationClientProps = TablePaginationCommonProps & {
-    /**
-     * Whether the pagination is happening on client or server.
-     * If the pagination is happening on `client`, the Table component will **divide the data into pages** and show the pages based on the page size.
-     * If the pagination is happening on `server`, the Table component will **not divide the data into pages and will show all the data**. You will have to fetch data for each page as the page changes and pass it to the Table component.
-     * When paginationType is `server`, the `onPageChange` & `totalItemCount` props are required.
-     * @default 'client'
-     * */
-    paginationType?: Extract<TablePaginationType, 'client'>;
-    /**
-     * The total number of possible items in the table. This is used to calculate the total number of pages when pagination is happening on server and not all the data is fetched at once.
-     */
-    totalItemCount?: number;
-    /**
-     * Callback function that is called when the page is changed
-     */
-    onPageChange?: ({ page }: {
-        page: number;
-    }) => void;
+type SideNavBodyProps = {
+    children: React__default.ReactElement | React__default.ReactElement[];
 };
-type TablePaginationProps = TablePaginationCommonProps & (TablePaginationServerProps | TablePaginationClientProps);
-type TableToolbarProps = {
-    /**
-     * The children of TableToolbar should be TableToolbarActions
-     */
-    children?: React.ReactNode;
-    /**
-     * The title of the TableToolbar. If not provided, it will show the default title.
-     * @default `Showing 1 to ${totalItems} Items`
-     */
-    title?: string;
-    /**
-     * The title to show when items are selected. If not provided, it will show the default title.
-     * @default `${selectedRows.length} 'Items'} Selected`
-     */
-    selectedTitle?: string;
+type SideNavLevelProps = {
+    children: React__default.ReactElement | React__default.ReactElement[];
 };
-type TableToolbarActionsProps = {
-    children?: React.ReactNode;
-} & StyledPropsBlade;
 
-declare const Table: <Item>({ children, data, selectionType, onSelectionChange, isHeaderSticky, isFooterSticky, isFirstColumnSticky, rowDensity, onSortChange, sortFunctions, toolbar, pagination, height, showStripedRows, gridTemplateColumns, isLoading, isRefreshing, ...styledProps }: TableProps<Item>) => React__default.ReactElement;
+/**
+ * ### SideNav component
+ *
+ * The side navigation is positioned along the left side of the screen that provides quick access to different sections or functionalities of the application.
+ *
+ * ---
+ *
+ * #### Usage
+ *
+ * SideNav requires handling active state with React Router, Checkout Usage with React Router v6 at - [SideNav Documentation](https://blade.razorpay.com/?path=/docs/components-sidenav--docs)
+ *
+ */
+declare const SideNav: ({ children, isOpen, onDismiss, banner, testID, ...styledProps }: SideNavProps) => React__default.ReactElement;
 
-declare const TableHeader: ({ children }: TableHeaderRowProps) => React__default.ReactElement;
-declare const TableHeaderCell: ({ children, headerKey }: TableHeaderCellProps) => React__default.ReactElement;
-declare const TableHeaderRow: ({ children, rowDensity }: TableHeaderRowProps) => React__default.ReactElement;
+declare const SideNavLink: ({ title, href, children, titleSuffix, trailing, isActive, icon, tooltip, as, target, }: SideNavLinkProps) => React__default.ReactElement;
 
-declare const TableBody: ({ children }: TableBodyProps) => React__default.ReactElement;
-declare const TableCell: ({ children }: TableCellProps) => React__default.ReactElement;
-declare const TableRow: <Item>({ children, item, isDisabled, onHover, onClick, }: TableRowProps<Item>) => React__default.ReactElement;
+declare const SideNavLevel: ({ children }: SideNavLevelProps) => React__default.ReactElement;
 
-declare const TableFooter: ({ children }: TableFooterProps) => React__default.ReactElement;
-declare const TableFooterRow: ({ children }: TableFooterRowProps) => React__default.ReactElement;
-declare const TableFooterCell: ({ children }: TableFooterCellProps) => React__default.ReactElement;
+declare const SideNavSection: ({ children, title, defaultIsExpanded, maxVisibleItems, onExpandChange, }: SideNavSectionProps) => React__default.ReactElement;
 
-declare const TablePagination: ({ currentPage: controlledCurrentPage, onPageChange, onPageSizeChange, defaultPageSize, showPageSizePicker, showPageNumberSelector, showLabel, label, totalItemCount, paginationType, }: TablePaginationProps) => React__default.ReactElement;
+declare const SideNavItem: ({ leading, trailing, title, backgroundColor, tooltip, as, }: SideNavItemProps) => React.ReactElement;
 
-declare const TableToolbarActions: ({ children, ...styledProps }: TableToolbarActionsProps) => React__default.ReactElement;
-declare const TableToolbar: ({ children, title, selectedTitle: controlledSelectedTitle, }: TableToolbarProps) => React__default.ReactElement;
+declare const SideNavFooter: ({ children }: SideNavFooterProps) => React__default.ReactElement;
 
-type TabsProps = {
-    /**
-     * The content of the component, accepts `TabsList` and `TabsPanel` components.
-     */
-    children: React__default.ReactNode;
+declare const SideNavBody: ({ children }: SideNavBodyProps) => React.ReactElement;
+
+type SkeletonProps = StyledPropsBlade & Pick<BaseBoxProps, 'width' | 'maxWidth' | 'minWidth' | 'height' | 'maxHeight' | 'minHeight' | 'borderRadius'> & Partial<FlexboxProps> & {
+    testID?: string;
+};
+
+declare const Skeleton: ({ width, maxWidth, minWidth, height, maxHeight, minHeight, borderRadius, flexWrap, flexDirection, flexGrow, flexShrink, flexBasis, alignItems, alignContent, alignSelf, justifyItems, justifyContent, justifySelf, placeSelf, placeItems, order, testID, ...props }: SkeletonProps) => React.ReactElement;
+
+type SkipNavLinkProps = {
+    id?: string;
+    children?: StringChildrenType;
     /**
-     * The value of the tab panel same as the corresponding TabItem's value to match the selected TabItem.
+     * **Internal**
+     *
+     * Adds background to link. Used internally in SideNav
      */
-    value?: string;
+    _hasBackground?: boolean;
+};
+declare const SkipNavLink: ({ id, children, _hasBackground, }: SkipNavLinkProps) => React__default.ReactElement;
+type SkipNavContentProps = {
+    id?: string;
+} & TestID;
+declare const SkipNavContent: ({ id, testID, }: SkipNavContentProps) => React__default.ReactElement;
+
+type BaseSpinnerProps = {
     /**
-     * The default value of the selected tab, in case the Tabs component is uncontrolled.
+     * Sets the color of the spinner.
+     *
+     * @default 'default'
      */
-    defaultValue?: string;
+    color?: 'primary' | 'white' | FeedbackColors;
     /**
-     * Callback fired when the value changes.
+     * Sets the label of the spinner.
+     *
+     * @default 'right'
      */
-    onChange?: (value: string) => void;
+    label?: string;
     /**
-     * The orientation of the tabs.
+     * Sets the label of the spinner.
      *
-     * @default 'horizontal' (always horizontal on react-native)
      */
-    orientation?: Platform.Select<{
-        web: 'horizontal' | 'vertical';
-        native: 'horizontal';
-    }>;
+    labelPosition?: 'right' | 'bottom';
     /**
-     * The size of the tabs.
+     * Sets the size of the spinner.
      *
      * @default 'medium'
      */
-    size?: 'medium' | 'large';
+    size?: 'medium' | 'large' | 'xlarge';
     /**
-     * The variant of the tabs.
+     * Sets the aria-label for web & accessibilityLabel react-native.
      *
-     * @default 'bordered'
      */
-    variant?: 'bordered' | 'borderless' | 'filled';
+    accessibilityLabel: string;
+} & TestID & StyledPropsBlade;
+
+type SpinnerProps = BaseSpinnerProps & {
     /**
-     * If `true`, the TabItems will grow to use all the available space.
+     * Sets the color of the spinner.
      *
-     * @default false
+     * @default 'default'
      */
-    isFullWidthTabItem?: boolean;
+    color?: 'primary' | 'neutral' | 'white';
+};
+declare const Spinner: ({ label, labelPosition, accessibilityLabel, color, size, testID, ...styledProps }: SpinnerProps) => React.ReactElement;
+
+type SpotlightPopoverStepRenderProps = {
     /**
-     * If `true`, the TabPanel will be rendered only when it becomes active.
+     * Go to a specific step
+     */
+    goToStep: (step: number) => void;
+    /**
+     * Go to the next step
+     */
+    goToNext: () => void;
+    /**
+     * Go to the previous step
+     */
+    goToPrevious: () => void;
+    /**
+     * Stop the tour
      *
-     * @default false
+     * This will call the `onFinish` callback
      */
-    isLazy?: boolean;
-};
-type TabItemProps = {
+    stopTour: () => void;
     /**
-     * The label of the tab item.
+     * Current active step (zero based index)
      */
-    children: React__default.ReactNode;
+    activeStep: number;
     /**
-     * The value of the tab item.
+     * Total number of steps
      */
-    value: string;
+    totalSteps: number;
+};
+type Step = {
     /**
-     * Leading element of the tab item.
-     * Can be used to render an Icon.
+     * Unique identifier for the tour step
      */
-    leading?: IconComponent;
+    name: string;
     /**
-     * Trailing element of the tab item.
-     * Can be used to render a Badge/Counter component.
+     * Content of the Popover
      */
-    trailing?: React__default.ReactNode;
+    content: (props: SpotlightPopoverStepRenderProps) => React.ReactElement;
     /**
-     * Internal prop used to pass size from Tabs to TabsItem.
+     * Footer content
      */
+    footer?: (props: SpotlightPopoverStepRenderProps) => React.ReactNode;
     /**
-     * If `true`, the tab item will be disabled.
+     * Popover title
      */
-    isDisabled?: boolean;
+    title?: string;
     /**
-     * If set the tab item will be rendered as a link.
-     * This can be used to create a tab item that redirects to another page or integrate with react-router.
+     * Leading content placed before the title
      *
-     * @default undefined
+     * Can be any blade icon or asset.
      */
-    href?: string;
+    titleLeading?: React.ReactNode;
     /**
-     * Callback fired when the tab item is clicked.
+     * Placement of Popover
+     * @default "top"
      */
-    onClick?: (event: React__default.MouseEvent) => void;
+    placement?: UseFloatingOptions['placement'];
 };
-type TabPanelProps = {
+type SpotlightPopoverTourSteps = Step[];
+type SpotlightPopoverTourProps = {
     /**
-     * The value of the tab panel. This will be used to match the selected tab.
+     * Array of steps to be rendered
+     *
+     * The order of the steps will be the order in which they are rendered depending on the `activeStep` prop
      */
-    value: string;
+    steps: SpotlightPopoverTourSteps;
     /**
-     * The content of the tab panel.
+     * Whether the tour is visible or not
      */
-    children: React__default.ReactNode;
-};
-
-/**
- * ### Tabs
- *
- * Check out the [Tab Stories & Examples](https://blade.razorpay.com/?path=/docs/components-tabs--default)
- *
- * ----
- * ### Basic Usage
- *
- * ```jsx
- * import { Tabs, TabList, TabItem, TabPanel } from '@razorpay/blade/components';
+    isOpen: boolean;
+    /**
+     * Callback when the tour is opened or closed
+     */
+    onOpenChange?: ({ isOpen }: {
+        isOpen: boolean;
+    }) => void;
+    /**
+     * Callback which fires when the `stopTour` method is called from the `steps` array
+     */
+    onFinish?: () => void;
+    /**
+     * Callback when the active step changes
+     */
+    onStepChange?: (step: number) => void;
+    /**
+     * Active step to be rendered
+     */
+    activeStep: number;
+    children: React.ReactNode;
+};
+type SpotlightPopoverTourStepProps = {
+    name: string;
+    children: React.ReactNode;
+};
+
+declare const SpotlightPopoverTour: ({ steps, activeStep, isOpen, onFinish, onOpenChange, onStepChange, children, }: SpotlightPopoverTourProps) => React__default.ReactElement;
+
+type SpotlightPopoverFooterAction = {
+    text?: string;
+} & Pick<ButtonProps, 'variant' | 'icon' | 'iconPosition' | 'isDisabled' | 'isLoading' | 'onClick'>;
+type SpotlightPopoverTourFooterProps = {
+    actions: {
+        primary?: SpotlightPopoverFooterAction;
+        secondary?: SpotlightPopoverFooterAction;
+    };
+};
+declare const SpotlightPopoverTourFooter: ({ activeStep, totalSteps, actions, }: SpotlightPopoverTourFooterProps & Pick<SpotlightPopoverStepRenderProps, 'activeStep' | 'totalSteps'>) => React.ReactElement;
+
+declare const SpotlightPopoverTourStep: React__default.MemoExoticComponent<({ name, children, }: SpotlightPopoverTourStepProps) => React__default.ReactElement>;
+
+type StepGroupProps = {
+    /**
+     * size of step group
+     *
+     * @default medium
+     */
+    size?: 'medium' | 'large';
+    /**
+     * orientation of step group
+     *
+     * @default vertical
+     */
+    orientation?: 'horizontal' | 'vertical';
+    /**
+     * children slot for StepItem components
+     */
+    children: React__default.ReactElement | React__default.ReactElement[];
+    /**
+     * Width of StepGroup. By default it takes the width of its items.
+     */
+    width?: BoxProps['width'];
+    /**
+     * minWidth prop of StepGroup
+     */
+    minWidth?: BoxProps['minWidth'];
+    /**
+     * maxWidth prop of StepGroup
+     *
+     * @default 100%
+     */
+    maxWidth?: BoxProps['maxWidth'];
+    /**
+     * @private
+     *
+     * DO NOT USE THIS PROP OR YOU WILL BE FIRED (joking. you won't be fired. But something bad will happen for sure)
+     *
+     * This is an internal prop to keep track of nestingLevel of StepGroup
+     */
+    _nestingLevel?: number;
+} & StyledPropsBlade & TestID;
+type StepItemProps = {
+    _index?: number;
+    _nestingLevel?: StepGroupProps['_nestingLevel'];
+    _totalIndex?: number;
+    /**
+     * title of StepItem
+     */
+    title: string;
+    /**
+     * A string that renders in italic font. Made for adding timestamp values.
+     *
+     * ```jsx
+     * timestamp="Thu, 11th Oct23 | 12:00pm"
+     * ```
+     */
+    timestamp?: string;
+    /**
+     * Description of StepItem
+     */
+    description?: string;
+    /**
+     * Progress line of step. When its start only starting part is highlighted and rest is kept dotted
+     *
+     * @default full
+     */
+    stepProgress?: 'start' | 'end' | 'full' | 'none';
+    /**
+     * marker JSX slot. It can be StepItemIndicator or StepItemIcon
+     *
+     * ```jsx
+     * marker={<StepItemIndicator color="positive" />}
+     * marker={<StepItemIcon icon={CheckIcon} color="positive" />}
+     * ```
+     */
+    marker?: React__default.ReactElement;
+    /**
+     * trailing slot for StepItem. Mostly meant for Badge
+     */
+    trailing?: React__default.ReactElement;
+    /**
+     * Controlled state of selected item
+     */
+    isSelected?: boolean;
+    /**
+     * Anchor tag's href value. Turns StepItem into interactive item and render it as `<a>` tag
+     */
+    href?: LinkProps['href'];
+    /**
+     * Anchjor tag's taget value. Meant to be used alongside `href` prop
+     */
+    target?: LinkProps['target'];
+    /**
+     * StepItem's click handler. Turns StepItem into interactive item and render it as button tag
+     */
+    onClick?: (event: React__default.MouseEvent) => void;
+    /**
+     * Children slot for adding additional custom elements to item
+     */
+    children?: React__default.ReactNode;
+};
+
+/**
+ * ## StepGroup
  *
- * <Tabs variant="bordered" orientation="horizontal">
- *   <TabList>
- *     <TabItem value="subscriptions">Subscription</TabItem>
- *     <TabItem value="plans">Plans</TabItem>
- *     <TabItem value="settings">Settings</TabItem>
- *   </TabList>
+ * Step Group visualises sequential processes with a consistent structure. It can be interactive, guiding users through steps, or function as a timeline for reference.
  *
- *   <TabPanel value="subscriptions">
- *     <Text>Subscriptions Panel</Text>
- *   </TabPanel>
- *   <TabPanel value="plans">
- *     <Text>Plans Panel</Text>
- *   </TabPanel>
- *   <TabPanel value="settings">
- *     <Text>Settings Panel</Text>
- *   </TabPanel>
- * </Tabs>
+ * ### Usage
+ *
+ * ```jsx
+ * <StepGroup orientation="vertical" size="medium">
+ *   <StepItem title="Personal Details" />
+ *   <StepItem title="Business Details" />
+ * </StepGroup>
  * ```
+ *
+ * ---
+ *
+ * Checkout {@link https://blade.razorpay.com/?path=/docs/components-stepgroup--docs StepGroup Documentation}
  */
-declare const Tabs: ({ children, defaultValue, value, onChange, orientation, size, variant, isFullWidthTabItem, isLazy, }: TabsProps) => React__default.ReactElement;
+declare const StepGroup: ({ size, orientation, children, testID, _nestingLevel, width, minWidth, maxWidth, ...styledProps }: StepGroupProps) => React__default.ReactElement;
 
-declare const TabItem: ({ children, value, leading: Leading, trailing, isDisabled, href, onClick, }: TabItemProps) => React__default.ReactElement;
+/**
+ * ## StepItem
+ *
+ * Component meant to be used inside the StepGroup parent component
+ *
+ * ### Usage
+ *
+ * ```jsx
+ * <StepGroup orientation="vertical" size="medium">
+ *   <StepItem
+ *      title="Personal Details"
+ *      timestamp="Thu 15th Oct'23 | 12:00pm"
+ *      description="Fill your personal details here"
+ *      marker={<StepItemIndicator color="negative" />}
+ *    />
+ * </StepGroup>
+ * ```
+ *
+ * ---
+ *
+ * Checkout {@link https://blade.razorpay.com/?path=/docs/components-stepgroup--docs StepGroup Documentation}
+ */
+declare const StepItem: ({ title, timestamp, description, stepProgress, marker, trailing, isSelected, href, target, onClick, children, _index, _totalIndex, _nestingLevel, }: StepItemProps) => React__default.ReactElement;
 
-declare const TabList: ({ children, ...props }: {
-    children: React__default.ReactNode;
-} & Partial<Omit<MarginProps & Pick<FlexboxProps, "alignSelf" | "justifySelf" | "order" | "placeSelf"> & {
+declare const StepItemIndicator: ({ color }: {
+    color: IndicatorProps['color'];
+}) => React.ReactElement;
+type StepItemIconProps = {
+    icon: IconComponent;
+    color: IndicatorProps['color'];
+};
+declare const StepItemIcon: ({ icon: Icon, color }: StepItemIconProps) => React.ReactElement;
+
+type OnChange = ({ isChecked, value, event, }: {
+    isChecked: boolean;
+    event?: React.ChangeEvent;
+    value?: string;
+}) => void;
+type SwitchProps = {
+    /**
+     * If `true`, The switch will be checked. This also makes the switch controlled
+     * Use `onChange` to update its value
+     *
+     * @default false
+     */
+    isChecked?: boolean;
+    /**
+     * If `true`, the switch will be initially checked. This also makes the switch uncontrolled
+     *
+     * @default false
+     */
+    defaultChecked?: boolean;
+    /**
+     * The callback invoked when the checked state of the `Switch` changes.
+     */
+    onChange?: OnChange;
+    /**
+     * The name of the input field in a switch
+     * (Useful for form submission).
+     */
+    name?: string;
+    /**
+     * The value to be used in the switch input.
+     * This is the value that will be returned on form submission.
+     */
+    value?: string;
+    /**
+     * If `true`, the switch will be disabled
+     *
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Size of the switch
+     *
+     * @default "medium"
+     */
+    size?: 'small' | 'medium';
+    /**
+     * Provides accessible label for internal checkbox component that sets the aria-label prop for screen readers.
+     */
+    accessibilityLabel: string;
+    /**
+     * The id of the input field in a switch, useful for associating a label element with the input via htmlFor prop
+     */
+    id?: string;
+} & TestID & StyledPropsBlade;
+
+declare const Switch: React__default.ForwardRefExoticComponent<{
+    isChecked?: boolean | undefined;
+    defaultChecked?: boolean | undefined;
+    onChange?: OnChange | undefined;
+    name?: string | undefined;
+    value?: string | undefined;
+    isDisabled?: boolean | undefined;
+    size?: "small" | "medium" | undefined;
+    accessibilityLabel: string;
+    id?: string | undefined;
+} & TestID & Partial<Omit<MarginProps & Pick<FlexboxProps, "alignSelf" | "justifySelf" | "order" | "placeSelf"> & {
     bottom: SpacingValueType | {
         readonly base?: SpacingValueType | undefined;
         readonly xs?: SpacingValueType | undefined;
@@ -11763,218 +11654,508 @@ declare const TabList: ({ children, ...props }: {
         readonly l?: "platform-web" | undefined;
         readonly xl?: "platform-web" | undefined;
     } | undefined;
-}, "visibility">, "__brand__">>) => React__default.ReactElement;
+}, "visibility">, "__brand__">> & React__default.RefAttributes<BladeElementRef>>;
+
+type TableNode<Item> = Item & {
+    id: Identifier;
+};
+type TableData<Item> = {
+    nodes: TableNode<Item>[];
+};
+type TableBackgroundColors = `surface.background.gray.${DotNotationToken<Theme['colors']['surface']['background']['gray']>}`;
+type TableHeaderProps = {
+    /**
+     * The children of TableHeader should be TableHeaderRow
+     * @example
+     * <TableHeader>
+     *   <TableHeaderRow>
+     *     <TableHeaderCell>Header Cell 1</TableHeaderCell>
+     *   </TableHeaderRow>
+     * </TableHeader>
+     **/
+    children: React.ReactNode;
+};
+type TableHeaderRowProps = {
+    /**
+     * The children of TableHeaderRow should be TableHeaderCell
+     * @example
+     * <TableHeader>
+     *   <TableHeaderRow>
+     *     <TableHeaderCell>Header Cell 1</TableHeaderCell>
+     *   </TableHeaderRow>
+     * </TableHeader>
+     **/
+    children: React.ReactNode;
+    /**
+     * The rowDensity prop determines the density of the table.
+     * The rowDensity prop can be 'compact', 'normal', or'comfortable'.
+     * The default value is `normal`.
+     **/
+    rowDensity?: TableProps<unknown>['rowDensity'];
+};
+type TableHeaderCellProps = {
+    /**
+     * The children of TableHeaderCell can be a string or a ReactNode.
+     **/
+    children: string | React.ReactNode;
+    /**
+     * The unique key of the column.
+     * This is used to identify the column for sorting in sortFunctions prop of Table.
+     * Sorting is enabled only for columns whose key is present in sortableColumns prop of Table.
+     **/
+    headerKey?: string;
+};
+type TableProps<Item> = {
+    /**
+     * The children of the Table component should be a function that returns TableHeader, TableBody and TableFooter components.
+     * The function will be called with the tableData prop.
+     */
+    children: (tableData: TableNode<Item>[]) => React.ReactElement;
+    /**
+     * The data prop is an object with a nodes property that is an array of objects.
+     * Each object in the array is a row in the table.
+     * The object should have an id property that is a unique identifier for the row.
+     */
+    data: TableData<Item>;
+    /**
+     * The selectionType prop determines the type of selection that is allowed on the table.
+     * The selectionType prop can be 'none', 'single' or 'multiple'.
+     * @default 'none'
+     **/
+    selectionType?: 'none' | 'single' | 'multiple';
+    /**
+     * The onSelectionChange prop is a function that is called when the selection changes.
+     * The function is called with an object that has a values property that is an array of the selected rows.
+     **/
+    onSelectionChange?: ({ values }: {
+        values: TableNode<Item>[];
+    }) => void;
+    /**
+     * The isHeaderSticky prop determines whether the table header is sticky or not.
+     * The default value is `false`.
+     **/
+    isHeaderSticky?: boolean;
+    /**
+     * The isFooterSticky prop determines whether the table footer is sticky or not.
+     * The default value is `false`.
+     **/
+    isFooterSticky?: boolean;
+    /**
+     * The isFirstColumnSticky prop determines whether the first column is sticky or not.
+     * The default value is `false`.
+     **/
+    isFirstColumnSticky?: boolean;
+    /**
+     * The rowDensity prop determines the density of the table.
+     * The rowDensity prop can be 'compact', 'normal', or'comfortable'.
+     * The default value is `normal`.
+     **/
+    rowDensity?: 'compact' | 'normal' | 'comfortable';
+    /**
+     * The onSortChange prop is a function that is called when the sort changes.
+     * The function is called with an object that has a sortKey property that is the key of the column that is sorted and a isSortReversed property that is a boolean that determines whether the sort is reversed or not.
+     **/
+    onSortChange?: ({ sortKey, isSortReversed, }: {
+        sortKey: TableHeaderCellProps['headerKey'];
+        isSortReversed: boolean;
+    }) => void;
+    /**
+     * The sortFunctions prop is an object that has a key for each column that is sortable.
+     * The value of each key is a function that is called when the column is sorted.
+     * The function is called with an array of the rows in the table.
+     * The function should return an array of the rows in the table.
+     **/
+    sortFunctions?: Record<string, (array: TableNode<Item>[]) => TableNode<Item>[]>;
+    /**
+     * The toolbar prop is a React element that is rendered above the table.
+     * The toolbar prop should be a `TableToolbar` component.
+     **/
+    toolbar?: React.ReactElement;
+    /**
+     * The pagination prop is a React element that is rendered below the table.
+     * The pagination prop should be a `TablePagination` component.
+     **/
+    pagination?: React.ReactElement;
+    /**
+     * The height prop is a responsive styled prop that determines the height of the table.
+     **/
+    height?: BoxProps['height'];
+    /**
+     * The showStripedRows prop determines whether the table should have striped rows or not.
+     * The default value is `false`.
+     **/
+    showStripedRows?: boolean;
+    /**
+     * The gridTemplateColumns prop determines the grid-template-columns CSS property of the table.
+     * The default value is `repeat(${columnCount},minmax(100px, 1fr))`.
+     **/
+    gridTemplateColumns?: string;
+    /**
+     * The isLoading prop determines whether the table is loading or not.
+     * The default value is `false`.
+     **/
+    isLoading?: boolean;
+    /**
+     * The isRefreshing prop determines whether the table is refreshing or not.
+     * The default value is `false`.
+     **/
+    isRefreshing?: boolean;
+} & StyledPropsBlade;
+type Identifier = string | number;
+type TableBodyProps = {
+    /**
+     * The children of the TableBody component should be TableRow components.
+     * @example
+     * <TableBody>
+     *   <TableRow>
+     *     <TableCell>...</TableCell>
+     *   </TableRow>
+     * </TableBody>
+     **/
+    children: React.ReactNode;
+};
+type TableRowProps<Item> = {
+    /**
+     * The children of the TableRow component should be TableCell components.
+     * @example
+     * <TableRow>
+     *   <TableCell>...</TableCell>
+     * </TableRow>
+     **/
+    children: React.ReactNode;
+    /**
+     * The item prop is used to pass the individual table item to the TableRow component.
+     * @example
+     * tableData.map((tableItem) => (
+     *   <TableRow item={item}>
+     *     <TableCell>...</TableCell>
+     *   </TableRow>
+     * ));
+     **/
+    item: TableNode<Item>;
+    /**
+     * The isDisabled prop is used to disable the TableRow component.
+     * @example
+     * <TableRow isDisabled>
+     *   <TableCell>...</TableCell>
+     * </TableRow>
+     **/
+    isDisabled?: boolean;
+    /**
+     * Callback triggered when the row is hovered. It is called with the current row item prop.
+     */
+    onHover?: ({ item }: {
+        item: TableNode<Item>;
+    }) => void;
+    /**
+     * Callback triggered when the row is clicked. It is called with the current row item prop.
+     */
+    onClick?: ({ item }: {
+        item: TableNode<Item>;
+    }) => void;
+};
+type TableCellProps = {
+    /**
+     * The children of the TableCell component should be a string or a ReactNode.
+     * @example
+     * <TableCell>{'Hello'}</TableCell>
+     * <TableCell>
+     *  <Text>...</Text>
+     * </TableCell>
+     * <TableCell>
+     * <Button>...</Button>
+     * </TableCell>
+     **/
+    children: React.ReactNode;
+};
+type TableFooterProps = {
+    /**
+     * The children of TableFooter should be TableFooterRow
+     * @example
+     * <TableFooter>
+     *   <TableFooterRow>
+     *     <TableFooterCell>Footer Cell 1</TableFooterCell>
+     *   </TableFooterRow>
+     * </TableFooter>
+     **/
+    children: React.ReactNode;
+};
+type TableFooterRowProps = {
+    /**
+     * The children of TableFooterRow should be TableFooterCell
+     * @example
+     * <TableFooter>
+     *   <TableFooterRow>
+     *     <TableFooterCell>Footer Cell 1</TableFooterCell>
+     *   </TableFooterRow>
+     * </TableFooter>
+     **/
+    children: React.ReactNode;
+};
+type TableFooterCellProps = {
+    /**
+     * The children of TableHeaderCell can be a string or a ReactNode.
+     **/
+    children: string | React.ReactNode;
+};
+type TablePaginationCommonProps = {
+    /**
+     * The default page size.
+     * Page size controls how rows are shown per page.
+     * @default 10
+     **/
+    defaultPageSize?: 10 | 25 | 50;
+    /**
+     * The current page. Passing this prop will make the component controlled and will not update the page on its own.
+     **/
+    currentPage?: number;
+    /**
+     * Callback function that is called when the page size is changed
+     */
+    onPageSizeChange?: ({ pageSize }: {
+        pageSize: number;
+    }) => void;
+    /**
+     * Whether to show the page size picker. It will be always be hidden on mobile.
+     * Page size picker controls how rows are shown per page.
+     * @default true
+     */
+    showPageSizePicker?: boolean;
+    /**
+     * Whether to show the page number selector. It will be always be hidden on mobile.
+     * Page number selectors is a group of buttons that allows the user to jump to a specific page.
+     * @default false
+     */
+    showPageNumberSelector?: boolean;
+    /**
+     * Content of the label to be shown in the pagination component
+     * @default `Showing 1 to ${totalItems} Items`
+     */
+    label?: string;
+    /**
+     * Whether to show the label. It will be always be hidden on mobile.
+     * @default false
+     */
+    showLabel?: boolean;
+};
+type TablePaginationType = 'client' | 'server';
+type TablePaginationServerProps = TablePaginationCommonProps & {
+    /**
+     * Whether the pagination is happening on client or server.
+     * If the pagination is happening on `client`, the Table component will **divide the data into pages** and show the pages based on the page size.
+     * If the pagination is happening on `server`, the Table component will **not divide the data into pages and will show all the data**. You will have to fetch data for each page as the page changes and pass it to the Table component.
+     * When paginationType is `server`, the `onPageChange` & `totalItemCount` props are required.
+     * @default 'client'
+     * */
+    paginationType?: Extract<TablePaginationType, 'server'>;
+    /**
+     * The total number of possible items in the table. This is used to calculate the total number of pages when pagination is happening on server and not all the data is fetched at once.
+     */
+    totalItemCount: number;
+    /**
+     * Callback function that is called when the page is changed
+     */
+    onPageChange: ({ page }: {
+        page: number;
+    }) => void;
+};
+type TablePaginationClientProps = TablePaginationCommonProps & {
+    /**
+     * Whether the pagination is happening on client or server.
+     * If the pagination is happening on `client`, the Table component will **divide the data into pages** and show the pages based on the page size.
+     * If the pagination is happening on `server`, the Table component will **not divide the data into pages and will show all the data**. You will have to fetch data for each page as the page changes and pass it to the Table component.
+     * When paginationType is `server`, the `onPageChange` & `totalItemCount` props are required.
+     * @default 'client'
+     * */
+    paginationType?: Extract<TablePaginationType, 'client'>;
+    /**
+     * The total number of possible items in the table. This is used to calculate the total number of pages when pagination is happening on server and not all the data is fetched at once.
+     */
+    totalItemCount?: number;
+    /**
+     * Callback function that is called when the page is changed
+     */
+    onPageChange?: ({ page }: {
+        page: number;
+    }) => void;
+};
+type TablePaginationProps = TablePaginationCommonProps & (TablePaginationServerProps | TablePaginationClientProps);
+type TableToolbarProps = {
+    /**
+     * The children of TableToolbar should be TableToolbarActions
+     */
+    children?: React.ReactNode;
+    /**
+     * The title of the TableToolbar. If not provided, it will show the default title.
+     * @default `Showing 1 to ${totalItems} Items`
+     */
+    title?: string;
+    /**
+     * The title to show when items are selected. If not provided, it will show the default title.
+     * @default `${selectedRows.length} 'Items'} Selected`
+     */
+    selectedTitle?: string;
+};
+type TableToolbarActionsProps = {
+    children?: React.ReactNode;
+} & StyledPropsBlade;
 
-declare const TabPanel: ({ children, value }: TabPanelProps) => React__default.ReactElement;
+declare const Table: <Item>({ children, data, selectionType, onSelectionChange, isHeaderSticky, isFooterSticky, isFirstColumnSticky, rowDensity, onSortChange, sortFunctions, toolbar, pagination, height, showStripedRows, gridTemplateColumns, isLoading, isRefreshing, ...styledProps }: TableProps<Item>) => React__default.ReactElement;
 
-type TagProps = {
+declare const TableHeader: ({ children }: TableHeaderRowProps) => React__default.ReactElement;
+declare const TableHeaderCell: ({ children, headerKey }: TableHeaderCellProps) => React__default.ReactElement;
+declare const TableHeaderRow: ({ children, rowDensity }: TableHeaderRowProps) => React__default.ReactElement;
+
+declare const TableBody: ({ children }: TableBodyProps) => React__default.ReactElement;
+declare const TableCell: ({ children }: TableCellProps) => React__default.ReactElement;
+declare const TableRow: <Item>({ children, item, isDisabled, onHover, onClick, }: TableRowProps<Item>) => React__default.ReactElement;
+
+declare const TableFooter: ({ children }: TableFooterProps) => React__default.ReactElement;
+declare const TableFooterRow: ({ children }: TableFooterRowProps) => React__default.ReactElement;
+declare const TableFooterCell: ({ children }: TableFooterCellProps) => React__default.ReactElement;
+
+declare const TablePagination: ({ currentPage: controlledCurrentPage, onPageChange, onPageSizeChange, defaultPageSize, showPageSizePicker, showPageNumberSelector, showLabel, label, totalItemCount, paginationType, }: TablePaginationProps) => React__default.ReactElement;
+
+declare const TableToolbarActions: ({ children, ...styledProps }: TableToolbarActionsProps) => React__default.ReactElement;
+declare const TableToolbar: ({ children, title, selectedTitle: controlledSelectedTitle, }: TableToolbarProps) => React__default.ReactElement;
+
+type TabsProps = {
     /**
-     * Decides the size of Tag
-     *
-     * @default medium
+     * The content of the component, accepts `TabsList` and `TabsPanel` components.
      */
-    size?: 'medium' | 'large';
+    children: React__default.ReactNode;
     /**
-     * Leading icon for your Tag
+     * The value of the tab panel same as the corresponding TabItem's value to match the selected TabItem.
      */
-    icon?: IconComponent;
+    value?: string;
     /**
-     * Callback when close icon on Tag is clicked
+     * The default value of the selected tab, in case the Tabs component is uncontrolled.
      */
-    onDismiss: () => void;
+    defaultValue?: string;
     /**
-     * Text that renders inside Tag
+     * Callback fired when the value changes.
      */
-    children: StringChildrenType;
+    onChange?: (value: string) => void;
     /**
-     * Disable tag
+     * The orientation of the tabs.
+     *
+     * @default 'horizontal' (always horizontal on react-native)
      */
-    isDisabled?: boolean;
+    orientation?: Platform.Select<{
+        web: 'horizontal' | 'vertical';
+        native: 'horizontal';
+    }>;
     /**
-     * Private property for Blade.
-     *
-     * Should not be used by consumers.
-     *
-     * Used for adding virtual focus on tag.
+     * The size of the tabs.
      *
-     * @private
+     * @default 'medium'
      */
-    _isVirtuallyFocused?: boolean;
+    size?: 'medium' | 'large';
     /**
-     * Private property for Blade.
+     * The variant of the tabs.
      *
-     * Should not be used by consumers.
+     * @default 'bordered'
+     */
+    variant?: 'bordered' | 'borderless' | 'filled';
+    /**
+     * If `true`, the TabItems will grow to use all the available space.
      *
-     * Is tag placed inside an input
+     * @default false
+     */
+    isFullWidthTabItem?: boolean;
+    /**
+     * If `true`, the TabPanel will be rendered only when it becomes active.
      *
-     * @private
+     * @default false
      */
-    _isTagInsideInput?: boolean;
-} & StyledPropsBlade & TestID;
-
-/**
- * ## Tags
- *
- * Tag component can be used to display selected items on UI.
- *
- * ### Usage
- *
- * ***Note:*** _Make sure to handle state when using Tag_
- *
- * ```jsx
- * const [showTag, setShowTag] = React.useState(true);
- *
- * // ...
- *
- * {showTag && (
- *  <Tag
- *    icon={CheckIcon}
- *    onDismiss={() => setShowTag(false)}
- *  >
- *    Transactions
- *  </Tag>
- * )}
- * ```
- *
- * Checkout [Tags Documentation](https://blade.razorpay.com/?path=/story/components-tag--default) for more info.
- *
- */
-declare const Tag: ({ size, icon: Icon, onDismiss, children, isDisabled, testID, _isVirtuallyFocused, _isTagInsideInput, ...styledProps }: TagProps) => React__default.ReactElement | null;
-
-type TooltipProps = {
+    isLazy?: boolean;
+};
+type TabItemProps = {
     /**
-     * Tooltip title
+     * The label of the tab item.
      */
-    title?: string;
+    children: React__default.ReactNode;
     /**
-     * Tooltip content
+     * The value of the tab item.
      */
-    content: string;
+    value: string;
     /**
-     * Placement of tooltip
+     * Leading element of the tab item.
+     * Can be used to render an Icon.
+     */
+    leading?: IconComponent;
+    /**
+     * Trailing element of the tab item.
+     * Can be used to render a Badge/Counter component.
+     */
+    trailing?: React__default.ReactNode;
+    /**
+     * Internal prop used to pass size from Tabs to TabsItem.
+     */
+    /**
+     * If `true`, the tab item will be disabled.
+     */
+    isDisabled?: boolean;
+    /**
+     * If set the tab item will be rendered as a link.
+     * This can be used to create a tab item that redirects to another page or integrate with react-router.
      *
-     * @default "top"
+     * @default undefined
      */
-    placement?: Exclude<UseFloatingOptions['placement'], 'left-end' | 'left-start' | 'right-end' | 'right-start'>;
-    children: React.ReactElement;
-    onOpenChange?: ({ isOpen }: {
-        isOpen: boolean;
-    }) => void;
+    href?: string;
+    /**
+     * Callback fired when the tab item is clicked.
+     */
+    onClick?: (event: React__default.MouseEvent) => void;
+};
+type TabPanelProps = {
+    /**
+     * The value of the tab panel. This will be used to match the selected tab.
+     */
+    value: string;
     /**
-     * Sets the z-index of the modal
-     * @default 1100
+     * The content of the tab panel.
      */
-    zIndex?: number;
+    children: React__default.ReactNode;
 };
 
-declare const Tooltip: ({ title, content, children, placement, onOpenChange, zIndex, }: TooltipProps) => React__default.ReactElement;
+/**
+ * ### Tabs
+ *
+ * Check out the [Tab Stories & Examples](https://blade.razorpay.com/?path=/docs/components-tabs--default)
+ *
+ * ----
+ * ### Basic Usage
+ *
+ * ```jsx
+ * import { Tabs, TabList, TabItem, TabPanel } from '@razorpay/blade/components';
+ *
+ * <Tabs variant="bordered" orientation="horizontal">
+ *   <TabList>
+ *     <TabItem value="subscriptions">Subscription</TabItem>
+ *     <TabItem value="plans">Plans</TabItem>
+ *     <TabItem value="settings">Settings</TabItem>
+ *   </TabList>
+ *
+ *   <TabPanel value="subscriptions">
+ *     <Text>Subscriptions Panel</Text>
+ *   </TabPanel>
+ *   <TabPanel value="plans">
+ *     <Text>Plans Panel</Text>
+ *   </TabPanel>
+ *   <TabPanel value="settings">
+ *     <Text>Settings Panel</Text>
+ *   </TabPanel>
+ * </Tabs>
+ * ```
+ */
+declare const Tabs: ({ children, defaultValue, value, onChange, orientation, size, variant, isFullWidthTabItem, isLazy, }: TabsProps) => React__default.ReactElement;
 
-declare const TooltipInteractiveWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, Omit<Partial<PaddingProps & MarginProps & {
-    width: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    display?: csstype.Property.Display | {
-        readonly base?: csstype.Property.Display | undefined;
-        readonly xs?: csstype.Property.Display | undefined;
-        readonly s?: csstype.Property.Display | undefined;
-        readonly m?: csstype.Property.Display | undefined;
-        readonly l?: csstype.Property.Display | undefined;
-        readonly xl?: csstype.Property.Display | undefined;
-    } | undefined;
-    height: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    maxHeight: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    maxWidth: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    minHeight: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    minWidth: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    overflowX?: csstype.Property.OverflowX | {
-        readonly base?: csstype.Property.OverflowX | undefined;
-        readonly xs?: csstype.Property.OverflowX | undefined;
-        readonly s?: csstype.Property.OverflowX | undefined;
-        readonly m?: csstype.Property.OverflowX | undefined;
-        readonly l?: csstype.Property.OverflowX | undefined;
-        readonly xl?: csstype.Property.OverflowX | undefined;
-    } | undefined;
-    overflowY?: csstype.Property.OverflowY | {
-        readonly base?: csstype.Property.OverflowY | undefined;
-        readonly xs?: csstype.Property.OverflowY | undefined;
-        readonly s?: csstype.Property.OverflowY | undefined;
-        readonly m?: csstype.Property.OverflowY | undefined;
-        readonly l?: csstype.Property.OverflowY | undefined;
-        readonly xl?: csstype.Property.OverflowY | undefined;
-    } | undefined;
-    textAlign?: csstype.Property.TextAlign | {
-        readonly base?: csstype.Property.TextAlign | undefined;
-        readonly xs?: csstype.Property.TextAlign | undefined;
-        readonly s?: csstype.Property.TextAlign | undefined;
-        readonly m?: csstype.Property.TextAlign | undefined;
-        readonly l?: csstype.Property.TextAlign | undefined;
-        readonly xl?: csstype.Property.TextAlign | undefined;
-    } | undefined;
-    whiteSpace?: csstype.Property.WhiteSpace | {
-        readonly base?: csstype.Property.WhiteSpace | undefined;
-        readonly xs?: csstype.Property.WhiteSpace | undefined;
-        readonly s?: csstype.Property.WhiteSpace | undefined;
-        readonly m?: csstype.Property.WhiteSpace | undefined;
-        readonly l?: csstype.Property.WhiteSpace | undefined;
-        readonly xl?: csstype.Property.WhiteSpace | undefined;
-    } | undefined;
-    overflow?: csstype.Property.Overflow | {
-        readonly base?: csstype.Property.Overflow | undefined;
-        readonly xs?: csstype.Property.Overflow | undefined;
-        readonly s?: csstype.Property.Overflow | undefined;
-        readonly m?: csstype.Property.Overflow | undefined;
-        readonly l?: csstype.Property.Overflow | undefined;
-        readonly xl?: csstype.Property.Overflow | undefined;
-    } | undefined;
-    __brand__?: "platform-web" | {
-        readonly base?: "platform-web" | undefined;
-        readonly xs?: "platform-web" | undefined;
-        readonly s?: "platform-web" | undefined;
-        readonly m?: "platform-web" | undefined;
-        readonly l?: "platform-web" | undefined;
-        readonly xl?: "platform-web" | undefined;
-    } | undefined;
-} & FlexboxProps & {
+declare const TabItem: ({ children, value, leading: Leading, trailing, isDisabled, href, onClick, }: TabItemProps) => React__default.ReactElement;
+
+declare const TabList: ({ children, ...props }: {
+    children: React__default.ReactNode;
+} & Partial<Omit<MarginProps & Pick<FlexboxProps, "alignSelf" | "justifySelf" | "order" | "placeSelf"> & {
     bottom: SpacingValueType | {
         readonly base?: SpacingValueType | undefined;
         readonly xs?: SpacingValueType | undefined;
@@ -12031,7 +12212,7 @@ declare const TooltipInteractiveWrapper: styled_components.StyledComponent<"div"
         readonly l?: "platform-web" | undefined;
         readonly xl?: "platform-web" | undefined;
     } | undefined;
-} & {
+} & Pick<{
     gridAutoColumns?: csstype.Property.GridAutoColumns<string | number> | {
         readonly base?: csstype.Property.GridAutoColumns<string | number> | undefined;
         readonly xs?: csstype.Property.GridAutoColumns<string | number> | undefined;
@@ -12128,29 +12309,134 @@ declare const TooltipInteractiveWrapper: styled_components.StyledComponent<"div"
         readonly l?: csstype.Property.GridArea | undefined;
         readonly xl?: csstype.Property.GridArea | undefined;
     } | undefined;
-    gridColumn?: csstype.Property.GridColumn | {
-        readonly base?: csstype.Property.GridColumn | undefined;
-        readonly xs?: csstype.Property.GridColumn | undefined;
-        readonly s?: csstype.Property.GridColumn | undefined;
-        readonly m?: csstype.Property.GridColumn | undefined;
-        readonly l?: csstype.Property.GridColumn | undefined;
-        readonly xl?: csstype.Property.GridColumn | undefined;
+    gridColumn?: csstype.Property.GridColumn | {
+        readonly base?: csstype.Property.GridColumn | undefined;
+        readonly xs?: csstype.Property.GridColumn | undefined;
+        readonly s?: csstype.Property.GridColumn | undefined;
+        readonly m?: csstype.Property.GridColumn | undefined;
+        readonly l?: csstype.Property.GridColumn | undefined;
+        readonly xl?: csstype.Property.GridColumn | undefined;
+    } | undefined;
+    gridRow?: csstype.Property.GridRow | {
+        readonly base?: csstype.Property.GridRow | undefined;
+        readonly xs?: csstype.Property.GridRow | undefined;
+        readonly s?: csstype.Property.GridRow | undefined;
+        readonly m?: csstype.Property.GridRow | undefined;
+        readonly l?: csstype.Property.GridRow | undefined;
+        readonly xl?: csstype.Property.GridRow | undefined;
+    } | undefined;
+    gridTemplate?: csstype.Property.GridTemplate | {
+        readonly base?: csstype.Property.GridTemplate | undefined;
+        readonly xs?: csstype.Property.GridTemplate | undefined;
+        readonly s?: csstype.Property.GridTemplate | undefined;
+        readonly m?: csstype.Property.GridTemplate | undefined;
+        readonly l?: csstype.Property.GridTemplate | undefined;
+        readonly xl?: csstype.Property.GridTemplate | undefined;
+    } | undefined;
+    __brand__?: "platform-web" | {
+        readonly base?: "platform-web" | undefined;
+        readonly xs?: "platform-web" | undefined;
+        readonly s?: "platform-web" | undefined;
+        readonly m?: "platform-web" | undefined;
+        readonly l?: "platform-web" | undefined;
+        readonly xl?: "platform-web" | undefined;
+    } | undefined;
+}, "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridArea" | "gridColumn" | "gridRow"> & Pick<{
+    width: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    display?: csstype.Property.Display | {
+        readonly base?: csstype.Property.Display | undefined;
+        readonly xs?: csstype.Property.Display | undefined;
+        readonly s?: csstype.Property.Display | undefined;
+        readonly m?: csstype.Property.Display | undefined;
+        readonly l?: csstype.Property.Display | undefined;
+        readonly xl?: csstype.Property.Display | undefined;
+    } | undefined;
+    height: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    maxHeight: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    maxWidth: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    minHeight: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    minWidth: SpacingValueType | {
+        readonly base?: SpacingValueType | undefined;
+        readonly xs?: SpacingValueType | undefined;
+        readonly s?: SpacingValueType | undefined;
+        readonly m?: SpacingValueType | undefined;
+        readonly l?: SpacingValueType | undefined;
+        readonly xl?: SpacingValueType | undefined;
+    };
+    overflowX?: csstype.Property.OverflowX | {
+        readonly base?: csstype.Property.OverflowX | undefined;
+        readonly xs?: csstype.Property.OverflowX | undefined;
+        readonly s?: csstype.Property.OverflowX | undefined;
+        readonly m?: csstype.Property.OverflowX | undefined;
+        readonly l?: csstype.Property.OverflowX | undefined;
+        readonly xl?: csstype.Property.OverflowX | undefined;
+    } | undefined;
+    overflowY?: csstype.Property.OverflowY | {
+        readonly base?: csstype.Property.OverflowY | undefined;
+        readonly xs?: csstype.Property.OverflowY | undefined;
+        readonly s?: csstype.Property.OverflowY | undefined;
+        readonly m?: csstype.Property.OverflowY | undefined;
+        readonly l?: csstype.Property.OverflowY | undefined;
+        readonly xl?: csstype.Property.OverflowY | undefined;
+    } | undefined;
+    textAlign?: csstype.Property.TextAlign | {
+        readonly base?: csstype.Property.TextAlign | undefined;
+        readonly xs?: csstype.Property.TextAlign | undefined;
+        readonly s?: csstype.Property.TextAlign | undefined;
+        readonly m?: csstype.Property.TextAlign | undefined;
+        readonly l?: csstype.Property.TextAlign | undefined;
+        readonly xl?: csstype.Property.TextAlign | undefined;
     } | undefined;
-    gridRow?: csstype.Property.GridRow | {
-        readonly base?: csstype.Property.GridRow | undefined;
-        readonly xs?: csstype.Property.GridRow | undefined;
-        readonly s?: csstype.Property.GridRow | undefined;
-        readonly m?: csstype.Property.GridRow | undefined;
-        readonly l?: csstype.Property.GridRow | undefined;
-        readonly xl?: csstype.Property.GridRow | undefined;
+    whiteSpace?: csstype.Property.WhiteSpace | {
+        readonly base?: csstype.Property.WhiteSpace | undefined;
+        readonly xs?: csstype.Property.WhiteSpace | undefined;
+        readonly s?: csstype.Property.WhiteSpace | undefined;
+        readonly m?: csstype.Property.WhiteSpace | undefined;
+        readonly l?: csstype.Property.WhiteSpace | undefined;
+        readonly xl?: csstype.Property.WhiteSpace | undefined;
     } | undefined;
-    gridTemplate?: csstype.Property.GridTemplate | {
-        readonly base?: csstype.Property.GridTemplate | undefined;
-        readonly xs?: csstype.Property.GridTemplate | undefined;
-        readonly s?: csstype.Property.GridTemplate | undefined;
-        readonly m?: csstype.Property.GridTemplate | undefined;
-        readonly l?: csstype.Property.GridTemplate | undefined;
-        readonly xl?: csstype.Property.GridTemplate | undefined;
+    overflow?: csstype.Property.Overflow | {
+        readonly base?: csstype.Property.Overflow | undefined;
+        readonly xs?: csstype.Property.Overflow | undefined;
+        readonly s?: csstype.Property.Overflow | undefined;
+        readonly m?: csstype.Property.Overflow | undefined;
+        readonly l?: csstype.Property.Overflow | undefined;
+        readonly xl?: csstype.Property.Overflow | undefined;
     } | undefined;
     __brand__?: "platform-web" | {
         readonly base?: "platform-web" | undefined;
@@ -12160,20 +12446,7 @@ declare const TooltipInteractiveWrapper: styled_components.StyledComponent<"div"
         readonly l?: "platform-web" | undefined;
         readonly xl?: "platform-web" | undefined;
     } | undefined;
-} & {
-    onMouseOver: React$1.MouseEventHandler<HTMLElement>;
-    onMouseEnter: React$1.MouseEventHandler<HTMLElement>;
-    onMouseLeave: React$1.MouseEventHandler<HTMLElement>;
-    onScroll: React$1.UIEventHandler<HTMLElement>;
-} & {
-    draggable: boolean;
-    onDragStart: React$1.DragEventHandler<HTMLElement>;
-    onDragEnter: React$1.DragEventHandler<HTMLElement>;
-    onDragLeave: React$1.DragEventHandler<HTMLElement>;
-    onDragOver: React$1.DragEventHandler<HTMLElement>;
-    onDragEnd: React$1.DragEventHandler<HTMLElement>;
-    onDrop: React$1.DragEventHandler<HTMLElement>;
-} & {
+}, "display"> & Pick<{
     elevation?: ElevationLevels | {
         readonly base?: ElevationLevels | undefined;
         readonly xs?: ElevationLevels | undefined;
@@ -12438,128 +12711,83 @@ declare const TooltipInteractiveWrapper: styled_components.StyledComponent<"div"
         readonly l?: "platform-web" | undefined;
         readonly xl?: "platform-web" | undefined;
     } | undefined;
-} & MakeObjectResponsive<{
-    backgroundColor: "transparent" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense";
-}, "backgroundColor"> & {
-    as: "aside" | "div" | "footer" | "header" | "label" | "main" | "nav" | "section" | "span";
-} & {
-    children?: React$1.ReactNode | React$1.ReactNode[];
-    tabIndex?: number | undefined;
-    id?: string | undefined;
-} & TestID>, "backgroundColor" | "as"> & Partial<{
-    border?: csstype.Property.Border<string | number> | {
-        readonly base?: csstype.Property.Border<string | number> | undefined;
-        readonly xs?: csstype.Property.Border<string | number> | undefined;
-        readonly s?: csstype.Property.Border<string | number> | undefined;
-        readonly m?: csstype.Property.Border<string | number> | undefined;
-        readonly l?: csstype.Property.Border<string | number> | undefined;
-        readonly xl?: csstype.Property.Border<string | number> | undefined;
-    } | undefined;
-    backgroundColor: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | {
-        readonly base?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
-        readonly xs?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
-        readonly s?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
-        readonly m?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
-        readonly l?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
-        readonly xl?: "transparent" | "feedback.background.neutral.subtle" | "feedback.background.neutral.intense" | "feedback.background.information.subtle" | "feedback.background.information.intense" | "feedback.background.negative.subtle" | "feedback.background.negative.intense" | "feedback.background.notice.subtle" | "feedback.background.notice.intense" | "feedback.background.positive.subtle" | "feedback.background.positive.intense" | "surface.background.gray.subtle" | "surface.background.gray.moderate" | "surface.background.gray.intense" | "surface.background.primary.subtle" | "surface.background.primary.intense" | "surface.background.sea.subtle" | "surface.background.sea.intense" | "surface.background.cloud.subtle" | "surface.background.cloud.intense" | "interactive.background.neutral.fadedHighlighted" | "interactive.background.neutral.disabled" | "interactive.background.neutral.default" | "interactive.background.neutral.highlighted" | "interactive.background.neutral.faded" | "interactive.background.information.fadedHighlighted" | "interactive.background.information.disabled" | "interactive.background.information.default" | "interactive.background.information.highlighted" | "interactive.background.information.faded" | "interactive.background.negative.fadedHighlighted" | "interactive.background.negative.disabled" | "interactive.background.negative.default" | "interactive.background.negative.highlighted" | "interactive.background.negative.faded" | "interactive.background.notice.fadedHighlighted" | "interactive.background.notice.disabled" | "interactive.background.notice.default" | "interactive.background.notice.highlighted" | "interactive.background.notice.faded" | "interactive.background.positive.fadedHighlighted" | "interactive.background.positive.disabled" | "interactive.background.positive.default" | "interactive.background.positive.highlighted" | "interactive.background.positive.faded" | "interactive.background.staticBlack.fadedHighlighted" | "interactive.background.staticBlack.disabled" | "interactive.background.staticBlack.default" | "interactive.background.staticBlack.highlighted" | "interactive.background.staticBlack.faded" | "interactive.background.staticWhite.fadedHighlighted" | "interactive.background.staticWhite.disabled" | "interactive.background.staticWhite.default" | "interactive.background.staticWhite.highlighted" | "interactive.background.staticWhite.faded" | "interactive.background.gray.fadedHighlighted" | "interactive.background.gray.disabled" | "interactive.background.gray.default" | "interactive.background.gray.highlighted" | "interactive.background.gray.faded" | "interactive.background.primary.fadedHighlighted" | "interactive.background.primary.disabled" | "interactive.background.primary.default" | "interactive.background.primary.highlighted" | "interactive.background.primary.faded" | "overlay.background.subtle" | "overlay.background.moderate" | "popup.background.subtle" | "popup.background.intense" | (string & Record<never, never>) | undefined;
-    };
-    cursor?: csstype.Property.Cursor | {
-        readonly base?: csstype.Property.Cursor | undefined;
-        readonly xs?: csstype.Property.Cursor | undefined;
-        readonly s?: csstype.Property.Cursor | undefined;
-        readonly m?: csstype.Property.Cursor | undefined;
-        readonly l?: csstype.Property.Cursor | undefined;
-        readonly xl?: csstype.Property.Cursor | undefined;
-    } | undefined;
-    lineHeight: SpacingValueType | {
-        readonly base?: SpacingValueType | undefined;
-        readonly xs?: SpacingValueType | undefined;
-        readonly s?: SpacingValueType | undefined;
-        readonly m?: SpacingValueType | undefined;
-        readonly l?: SpacingValueType | undefined;
-        readonly xl?: SpacingValueType | undefined;
-    };
-    opacity?: csstype.Property.Opacity | {
-        readonly base?: csstype.Property.Opacity | undefined;
-        readonly xs?: csstype.Property.Opacity | undefined;
-        readonly s?: csstype.Property.Opacity | undefined;
-        readonly m?: csstype.Property.Opacity | undefined;
-        readonly l?: csstype.Property.Opacity | undefined;
-        readonly xl?: csstype.Property.Opacity | undefined;
-    } | undefined;
-    pointerEvents?: csstype.Property.PointerEvents | {
-        readonly base?: csstype.Property.PointerEvents | undefined;
-        readonly xs?: csstype.Property.PointerEvents | undefined;
-        readonly s?: csstype.Property.PointerEvents | undefined;
-        readonly m?: csstype.Property.PointerEvents | undefined;
-        readonly l?: csstype.Property.PointerEvents | undefined;
-        readonly xl?: csstype.Property.PointerEvents | undefined;
-    } | undefined;
-    touchAction: csstype.Property.TouchAction | {
-        readonly base?: csstype.Property.TouchAction | undefined;
-        readonly xs?: csstype.Property.TouchAction | undefined;
-        readonly s?: csstype.Property.TouchAction | undefined;
-        readonly m?: csstype.Property.TouchAction | undefined;
-        readonly l?: csstype.Property.TouchAction | undefined;
-        readonly xl?: csstype.Property.TouchAction | undefined;
-    } | undefined;
-    userSelect: csstype.Property.UserSelect | {
-        readonly base?: csstype.Property.UserSelect | undefined;
-        readonly xs?: csstype.Property.UserSelect | undefined;
-        readonly s?: csstype.Property.UserSelect | undefined;
-        readonly m?: csstype.Property.UserSelect | undefined;
-        readonly l?: csstype.Property.UserSelect | undefined;
-        readonly xl?: csstype.Property.UserSelect | undefined;
-    } | undefined;
-    borderBottom?: csstype.Property.BorderBottom<string | number> | {
-        readonly base?: csstype.Property.BorderBottom<string | number> | undefined;
-        readonly xs?: csstype.Property.BorderBottom<string | number> | undefined;
-        readonly s?: csstype.Property.BorderBottom<string | number> | undefined;
-        readonly m?: csstype.Property.BorderBottom<string | number> | undefined;
-        readonly l?: csstype.Property.BorderBottom<string | number> | undefined;
-        readonly xl?: csstype.Property.BorderBottom<string | number> | undefined;
-    } | undefined;
-    borderLeft?: csstype.Property.BorderLeft<string | number> | {
-        readonly base?: csstype.Property.BorderLeft<string | number> | undefined;
-        readonly xs?: csstype.Property.BorderLeft<string | number> | undefined;
-        readonly s?: csstype.Property.BorderLeft<string | number> | undefined;
-        readonly m?: csstype.Property.BorderLeft<string | number> | undefined;
-        readonly l?: csstype.Property.BorderLeft<string | number> | undefined;
-        readonly xl?: csstype.Property.BorderLeft<string | number> | undefined;
-    } | undefined;
-    borderRight?: csstype.Property.BorderRight<string | number> | {
-        readonly base?: csstype.Property.BorderRight<string | number> | undefined;
-        readonly xs?: csstype.Property.BorderRight<string | number> | undefined;
-        readonly s?: csstype.Property.BorderRight<string | number> | undefined;
-        readonly m?: csstype.Property.BorderRight<string | number> | undefined;
-        readonly l?: csstype.Property.BorderRight<string | number> | undefined;
-        readonly xl?: csstype.Property.BorderRight<string | number> | undefined;
-    } | undefined;
-    borderTop?: csstype.Property.BorderTop<string | number> | {
-        readonly base?: csstype.Property.BorderTop<string | number> | undefined;
-        readonly xs?: csstype.Property.BorderTop<string | number> | undefined;
-        readonly s?: csstype.Property.BorderTop<string | number> | undefined;
-        readonly m?: csstype.Property.BorderTop<string | number> | undefined;
-        readonly l?: csstype.Property.BorderTop<string | number> | undefined;
-        readonly xl?: csstype.Property.BorderTop<string | number> | undefined;
-    } | undefined;
-    __brand__?: "platform-web" | {
-        readonly base?: "platform-web" | undefined;
-        readonly xs?: "platform-web" | undefined;
-        readonly s?: "platform-web" | undefined;
-        readonly m?: "platform-web" | undefined;
-        readonly l?: "platform-web" | undefined;
-        readonly xl?: "platform-web" | undefined;
-    } | undefined;
-} & {
-    className?: string | undefined;
-    id?: string | undefined;
-    tabIndex?: number | undefined;
-}> & BladeCommonEvents & {
-    'data-blade-component'?: string | undefined;
-    'data-testid'?: string | undefined;
-    tabIndex: -1;
-}, "tabIndex" | "data-testid" | "data-blade-component">;
+}, "visibility">, "__brand__">>) => React__default.ReactElement;
+
+declare const TabPanel: ({ children, value }: TabPanelProps) => React__default.ReactElement;
+
+type TagProps = {
+    /**
+     * Decides the size of Tag
+     *
+     * @default medium
+     */
+    size?: 'medium' | 'large';
+    /**
+     * Leading icon for your Tag
+     */
+    icon?: IconComponent;
+    /**
+     * Callback when close icon on Tag is clicked
+     */
+    onDismiss: () => void;
+    /**
+     * Text that renders inside Tag
+     */
+    children: StringChildrenType;
+    /**
+     * Disable tag
+     */
+    isDisabled?: boolean;
+    /**
+     * Private property for Blade.
+     *
+     * Should not be used by consumers.
+     *
+     * Used for adding virtual focus on tag.
+     *
+     * @private
+     */
+    _isVirtuallyFocused?: boolean;
+    /**
+     * Private property for Blade.
+     *
+     * Should not be used by consumers.
+     *
+     * Is tag placed inside an input
+     *
+     * @private
+     */
+    _isTagInsideInput?: boolean;
+} & StyledPropsBlade & TestID;
+
+/**
+ * ## Tags
+ *
+ * Tag component can be used to display selected items on UI.
+ *
+ * ### Usage
+ *
+ * ***Note:*** _Make sure to handle state when using Tag_
+ *
+ * ```jsx
+ * const [showTag, setShowTag] = React.useState(true);
+ *
+ * // ...
+ *
+ * {showTag && (
+ *  <Tag
+ *    icon={CheckIcon}
+ *    onDismiss={() => setShowTag(false)}
+ *  >
+ *    Transactions
+ *  </Tag>
+ * )}
+ * ```
+ *
+ * Checkout [Tags Documentation](https://blade.razorpay.com/?path=/story/components-tag--default) for more info.
+ *
+ */
+declare const Tag: ({ size, icon: Icon, onDismiss, children, isDisabled, testID, _isVirtuallyFocused, _isTagInsideInput, ...styledProps }: TagProps) => React__default.ReactElement | null;
 
 declare const ToastContainer: () => React__default.ReactElement;
 
@@ -12642,4 +12870,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, Avatar, AvatarGroup, AvatarGroupProps, AvatarProps, AwardIcon, Badge, BadgeProps, BankAccountVerificationIcon, BankIcon, BarChartAltIcon, BarChartIcon, BarCodeIcon, BatteryChargingIcon, BatteryIcon, BellIcon, BellOffIcon, BfsiIcon, BillIcon, BladeCommonEvents, BladeFile, BladeFileList, 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, ButtonGroupProps, 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, DatePicker, DatePickerProps, 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, FileUploadProps, 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, SpotlightPopoverTour, 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, 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, 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, AvatarGroupProps, AvatarProps, AwardIcon, Badge, BadgeProps, BankAccountVerificationIcon, BankIcon, BarChartAltIcon, BarChartIcon, BarCodeIcon, BatteryChargingIcon, BatteryIcon, BellIcon, BellOffIcon, BfsiIcon, BillIcon, BladeCommonEvents, BladeFile, BladeFileList, 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, ButtonGroupProps, 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, DatePicker, DatePickerProps, 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, FileUploadProps, 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, SideNav, SideNavBody, SideNavFooter, SideNavFooterProps, SideNavItem, SideNavItemProps, SideNavLevel, SideNavLink, SideNavLinkProps, SideNavProps, SideNavSection, SideNavSectionProps, SidebarIcon, Skeleton, SkeletonProps, SkipBackIcon, SkipForwardIcon, SkipNavContent, SkipNavLink, SlackIcon, SlashIcon, SlidersIcon, SmartCollectIcon, SmartphoneIcon, SolutionsIcon, SourceToPayIcon, SparklesIcon, SpeakerIcon, Spinner, SpinnerProps, SpotlightPopoverStepRenderProps, SpotlightPopoverTour, 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, 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, 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, drawerPadding, getHeadingProps, getTextProps, screenReaderStyles, useTheme, useToast };