@juspay/blend-design-system 0.0.35-beta.2 → 0.0.35-beta.3

package/dist/components/Inputs/utils/InputLabels/InputLabels.d.ts

@@ -36,14 +36,5 @@ type InputLabelsProps<TTokens extends InputLabelTokens = InputLabelTokens> = {
     tokens?: Partial<TTokens>;
     labelId?: string;
 };
-/**
- * @description InputLabels is a component that displays a label and sublabel for an input field.
- * @param {string} label - The label for the input field.
- * @param {string} sublabel - The sublabel for the input field.
- * @param {boolean} disabled - Whether the input field is disabled.
- * @param {string} helpIconHintText - The hint text for the help icon.
- * @param {string} inputId - Unique ID for proper label association (WCAG 3.3.2).
- * @param {boolean} required - Whether the input field is required.
- */
 declare const InputLabels: <TTokens extends InputLabelTokens>({ label, sublabel, helpIconHintText, name, inputId, required, tokens, labelId, }: InputLabelsProps<TTokens>) => "" | import("react/jsx-runtime").JSX.Element | undefined;
 export default InputLabels;

package/dist/components/InputsV2/TextInputV2/TextInputV2.d.ts

@@ -0,0 +1,25 @@
+import { InputSizeV2 } from '../inputV2.types';
+declare const TextInputV2: import('react').ForwardRefExoticComponent<{
+    value: string;
+    label?: string;
+    subLabel?: string;
+    size?: InputSizeV2;
+    error?: {
+        show: boolean;
+        message?: string;
+    };
+    hintText?: string;
+    helpIconText?: {
+        text: string;
+        onClick?: () => void;
+    };
+    leftSlot?: {
+        slot: import('react').ReactElement;
+        maxHeight?: import('styled-components').CSSObject["maxHeight"];
+    };
+    rightSlot?: {
+        slot: import('react').ReactElement;
+        maxHeight?: import('styled-components').CSSObject["maxHeight"];
+    };
+} & Omit<import('react').InputHTMLAttributes<HTMLInputElement>, "size" | "style" | "className"> & import('react').RefAttributes<HTMLInputElement>>;
+export default TextInputV2;

package/dist/components/InputsV2/TextInputV2/TextInputV2.dark.tokens.d.ts

@@ -0,0 +1,3 @@
+import { FoundationTokenType } from '../../../tokens/theme.token';
+import { ResponsiveTextInputV2Tokens } from './TextInputV2.tokens';
+export declare const getTextInputV2DarkTokens: (foundationTokens: FoundationTokenType) => ResponsiveTextInputV2Tokens;

package/dist/components/InputsV2/TextInputV2/TextInputV2.light.tokens.d.ts

@@ -0,0 +1,3 @@
+import { FoundationTokenType } from '../../../tokens/theme.token';
+import { ResponsiveTextInputV2Tokens } from './TextInputV2.tokens';
+export declare const getTextInputV2LightTokens: (foundationTokens: FoundationTokenType) => ResponsiveTextInputV2Tokens;

package/dist/components/InputsV2/TextInputV2/TextInputV2.tokens.d.ts

@@ -0,0 +1,136 @@
+import { CSSObject } from 'styled-components';
+import { InputSizeV2, InputStateV2 } from '../inputV2.types';
+import { BreakpointType } from '../../../breakpoints/breakPoints';
+import { FoundationTokenType } from '../../../tokens/theme.token';
+import { Theme } from '../../../context/theme.enum';
+export type TextInputV2TokensType = {
+    gap: CSSObject['gap'];
+    topContainer: {
+        label: {
+            fontSize: {
+                [key in InputSizeV2]: CSSObject['fontSize'];
+            };
+            fontWeight: {
+                [key in InputSizeV2]: CSSObject['fontWeight'];
+            };
+            lineHeight: {
+                [key in InputSizeV2]: CSSObject['lineHeight'];
+            };
+            color: {
+                [key in InputStateV2]: CSSObject['color'];
+            };
+        };
+        subLabel: {
+            fontSize: {
+                [key in InputSizeV2]: CSSObject['fontSize'];
+            };
+            fontWeight: {
+                [key in InputSizeV2]: CSSObject['fontWeight'];
+            };
+            lineHeight: {
+                [key in InputSizeV2]: CSSObject['lineHeight'];
+            };
+            color: {
+                [key in InputStateV2]: CSSObject['color'];
+            };
+        };
+        required: {
+            color: CSSObject['color'];
+        };
+        helpIcon: {
+            width: {
+                [key in InputSizeV2]: CSSObject['width'];
+            };
+            color: {
+                [key in InputStateV2]: CSSObject['color'];
+            };
+        };
+    };
+    inputContainer: {
+        gap: CSSObject['gap'];
+        placeholder: {
+            color: {
+                [key in InputStateV2]: CSSObject['color'];
+            };
+            fontSize: {
+                [key in InputSizeV2]: CSSObject['fontSize'];
+            };
+            fontWeight: {
+                [key in InputSizeV2]: CSSObject['fontWeight'];
+            };
+            lineHeight: {
+                [key in InputSizeV2]: CSSObject['lineHeight'];
+            };
+        };
+        inputText: {
+            fontSize: {
+                [key in InputSizeV2]: CSSObject['fontSize'];
+            };
+            fontWeight: {
+                [key in InputSizeV2]: CSSObject['fontWeight'];
+            };
+            lineHeight: {
+                [key in InputSizeV2]: CSSObject['lineHeight'];
+            };
+            color: {
+                [key in InputStateV2]: CSSObject['color'];
+            };
+        };
+        borderRadius: {
+            [key in InputSizeV2]: CSSObject['borderRadius'];
+        };
+        boxShadow: CSSObject['boxShadow'];
+        padding: {
+            top: {
+                [key in InputSizeV2]: CSSObject['padding'];
+            };
+            right: {
+                [key in InputSizeV2]: CSSObject['padding'];
+            };
+            bottom: {
+                [key in InputSizeV2]: CSSObject['padding'];
+            };
+            left: {
+                [key in InputSizeV2]: CSSObject['padding'];
+            };
+        };
+        border: {
+            [key in InputStateV2]: CSSObject['border'];
+        };
+        backgroundColor: {
+            [key in InputStateV2]: CSSObject['backgroundColor'];
+        };
+    };
+    bottomContainer: {
+        hintText: {
+            fontSize: {
+                [key in InputSizeV2]: CSSObject['fontSize'];
+            };
+            fontWeight: {
+                [key in InputSizeV2]: CSSObject['fontWeight'];
+            };
+            lineHeight: {
+                [key in InputSizeV2]: CSSObject['lineHeight'];
+            };
+            color: {
+                [key in InputStateV2]: CSSObject['color'];
+            };
+        };
+        errorMessage: {
+            fontSize: {
+                [key in InputSizeV2]: CSSObject['fontSize'];
+            };
+            fontWeight: {
+                [key in InputSizeV2]: CSSObject['fontWeight'];
+            };
+            lineHeight: {
+                [key in InputSizeV2]: CSSObject['lineHeight'];
+            };
+            color: CSSObject['color'];
+        };
+    };
+};
+export type ResponsiveTextInputV2Tokens = {
+    [key in keyof BreakpointType]: TextInputV2TokensType;
+};
+export declare const getTextInputV2Tokens: (foundationToken: FoundationTokenType, theme?: Theme | string) => ResponsiveTextInputV2Tokens;

package/dist/components/InputsV2/TextInputV2/TextInputV2.types.d.ts

@@ -0,0 +1,26 @@
+import { ReactElement } from 'react';
+import { CSSObject } from 'styled-components';
+import { InputSizeV2 } from '../inputV2.types';
+export type TextInputV2Props = {
+    value: string;
+    label?: string;
+    subLabel?: string;
+    size?: InputSizeV2;
+    error?: {
+        show: boolean;
+        message?: string;
+    };
+    hintText?: string;
+    helpIconText?: {
+        text: string;
+        onClick?: () => void;
+    };
+    leftSlot?: {
+        slot: ReactElement;
+        maxHeight?: CSSObject['maxHeight'];
+    };
+    rightSlot?: {
+        slot: ReactElement;
+        maxHeight?: CSSObject['maxHeight'];
+    };
+} & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'style' | 'className'>;

package/dist/components/InputsV2/TextInputV2/index.d.ts

@@ -0,0 +1,3 @@
+export { default as TextInputV2 } from './TextInputV2';
+export * from './TextInputV2.types';
+export * from './TextInputV2.tokens';

package/dist/components/InputsV2/TextInputV2/utils.d.ts

@@ -0,0 +1,20 @@
+import { AnyRef, InputStateV2 } from '../inputV2.types';
+export declare const FOCUS_RING_STYLES: {
+    readonly boxShadow: "0 0 0 3px #EFF6FF";
+    readonly backgroundColor: "rgba(239, 246, 255, 0.15)";
+};
+export declare const TRANSITION = "border 200ms ease-in-out, box-shadow 200ms ease-in-out, background-color 200ms ease-in-out";
+export declare const getInteractionState: (state: InputStateV2) => "default" | "hover" | "disabled" | "focus" | "error";
+export declare const getInputState: (error?: {
+    show: boolean;
+} | null, disabled?: boolean) => InputStateV2;
+export declare const getVerticalInputPadding: ({ isSmallScreenWithLargeSize, inputFocusedOrWithValue, paddingTop, paddingBottom, }: {
+    isSmallScreenWithLargeSize: boolean;
+    inputFocusedOrWithValue: boolean;
+    paddingTop: number;
+    paddingBottom: number;
+}) => {
+    top: number;
+    bottom: number;
+};
+export declare const setExternalRef: <T>(ref: AnyRef<T>, value: T | null) => void;

package/dist/components/InputsV2/inputV2.types.d.ts

@@ -0,0 +1,15 @@
+export declare enum InputSizeV2 {
+    SM = "sm",
+    MD = "md",
+    LG = "lg"
+}
+export declare enum InputStateV2 {
+    DEFAULT = "default",
+    HOVER = "hover",
+    FOCUS = "focus",
+    ERROR = "error",
+    DISABLED = "disabled"
+}
+export type AnyRef<T> = ((instance: T | null) => void) | {
+    current: T | null;
+} | null | undefined;

package/dist/components/InputsV2/utils/FloatingLabelsV2/FloatingLabelsV2.d.ts

@@ -0,0 +1,34 @@
+import { InputSizeV2, InputStateV2 } from '../../inputV2.types';
+import { CSSObject } from 'styled-components';
+export type FloatingLabelsV2Tokens = {
+    placeholder: {
+        color: {
+            [key in InputStateV2]: CSSObject['color'];
+        };
+        fontSize: {
+            [key in InputSizeV2]: CSSObject['fontSize'];
+        };
+        fontWeight: {
+            [key in InputSizeV2]: CSSObject['fontWeight'];
+        };
+        lineHeight: {
+            [key in InputSizeV2]: CSSObject['lineHeight'];
+        };
+    };
+    required: {
+        color: CSSObject['color'];
+    };
+};
+declare const FloatingLabelsV2: ({ label, required, name, inputId, isInputFocusedOrWithValue, topPadding, leftPadding, tokens, size, state, }: {
+    label: string;
+    required: boolean;
+    name: string;
+    inputId: string;
+    isInputFocusedOrWithValue: boolean;
+    topPadding: number;
+    leftPadding: number;
+    tokens: FloatingLabelsV2Tokens;
+    size: InputSizeV2;
+    state: InputStateV2;
+}) => import("react/jsx-runtime").JSX.Element;
+export default FloatingLabelsV2;

package/dist/components/InputsV2/utils/InputFooter/InputFooterV2.d.ts

@@ -0,0 +1,43 @@
+import { CSSObject } from 'styled-components';
+import { InputSizeV2, InputStateV2 } from '../../inputV2.types';
+type InputFooterV2Tokens = {
+    hintText: {
+        fontSize: {
+            [key in InputSizeV2]: CSSObject['fontSize'];
+        };
+        fontWeight: {
+            [key in InputSizeV2]: CSSObject['fontWeight'];
+        };
+        lineHeight: {
+            [key in InputSizeV2]: CSSObject['lineHeight'];
+        };
+        color: {
+            [key in InputStateV2]: CSSObject['color'];
+        };
+    };
+    errorMessage: {
+        fontSize: {
+            [key in InputSizeV2]: CSSObject['fontSize'];
+        };
+        fontWeight: {
+            [key in InputSizeV2]: CSSObject['fontWeight'];
+        };
+        lineHeight: {
+            [key in InputSizeV2]: CSSObject['lineHeight'];
+        };
+        color: CSSObject['color'];
+    };
+};
+type InputFooterV2Props = {
+    error?: boolean;
+    errorMessage?: string;
+    hintText?: string;
+    errorId?: string;
+    hintId?: string;
+    tokens?: InputFooterV2Tokens;
+    hintTextId?: string;
+    errorMessageId?: string;
+    size?: InputSizeV2;
+};
+declare const InputFooterV2: ({ error, errorMessage, hintText, errorId, hintId, tokens, hintTextId, errorMessageId, size, }: InputFooterV2Props) => "" | import("react/jsx-runtime").JSX.Element | undefined;
+export default InputFooterV2;

package/dist/components/InputsV2/utils/InputLabels/InputLabelsV2.d.ts

@@ -0,0 +1,60 @@
+import { InputSizeV2, InputStateV2 } from '../../inputV2.types';
+import { CSSObject } from 'styled-components';
+export type InputLabelsV2Tokens = {
+    label: {
+        fontSize: {
+            [key in InputSizeV2]: CSSObject['fontSize'];
+        };
+        fontWeight: {
+            [key in InputSizeV2]: CSSObject['fontWeight'];
+        };
+        lineHeight: {
+            [key in InputSizeV2]: CSSObject['lineHeight'];
+        };
+        color: {
+            [key in InputStateV2]: CSSObject['color'];
+        };
+    };
+    subLabel: {
+        fontSize: {
+            [key in InputSizeV2]: CSSObject['fontSize'];
+        };
+        fontWeight: {
+            [key in InputSizeV2]: CSSObject['fontWeight'];
+        };
+        lineHeight: {
+            [key in InputSizeV2]: CSSObject['lineHeight'];
+        };
+        color: {
+            [key in InputStateV2]: CSSObject['color'];
+        };
+    };
+    required: {
+        color: CSSObject['color'];
+    };
+    helpIcon: {
+        width: {
+            [key in InputSizeV2]: CSSObject['width'];
+        };
+        color: {
+            [key in InputStateV2]: CSSObject['color'];
+        };
+    };
+};
+export type InputLabelsV2Props = {
+    label?: string;
+    sublabel?: string;
+    helpIconText?: {
+        text: string;
+        onClick?: () => void;
+    };
+    name?: string;
+    inputId?: string;
+    required?: boolean;
+    tokens?: InputLabelsV2Tokens;
+    labelId?: string;
+    size?: InputSizeV2;
+    state?: InputStateV2;
+};
+declare const InputLabelsV2: ({ label, sublabel, helpIconText, name, inputId, required, tokens, labelId, size, state, }: InputLabelsV2Props) => "" | import("react/jsx-runtime").JSX.Element | undefined;
+export default InputLabelsV2;

package/dist/components/InputsV2/utils/InputSlots/InputSlots.d.ts

@@ -0,0 +1,18 @@
+import { CSSObject } from 'styled-components';
+type InputSlotPosition = 'left' | 'right';
+type InputSlotProps = {
+    position: InputSlotPosition;
+    slotRef: React.RefObject<HTMLDivElement | null>;
+    top: number;
+    bottom: number;
+    left: number;
+    right: number;
+    dataElement: string;
+    children: React.ReactNode;
+    maxHeight?: CSSObject['maxHeight'];
+};
+declare const InputSlots: {
+    ({ position, slotRef, top, bottom, left, right, dataElement, children, }: InputSlotProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default InputSlots;

package/dist/components/Primitives/PrimitiveText/PrimitiveText.d.ts

@@ -1,7 +1,14 @@
 import { default as React, JSX } from 'react';
 import { CSSObject } from 'styled-components';
 export type SemanticTagType = keyof Pick<JSX.IntrinsicElements, 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'span' | 'code' | 'q' | 'small' | 'label'>;
-export type PrimitiveTextProps = {
+type StateStyles = {
+    _hover?: BasePrimitiveTextProps;
+    _focus?: BasePrimitiveTextProps;
+    _active?: BasePrimitiveTextProps;
+    _disabled?: BasePrimitiveTextProps;
+    _focusVisible?: BasePrimitiveTextProps;
+};
+export type BasePrimitiveTextProps = {
     fontWeight?: CSSObject['fontWeight'];
     color?: CSSObject['color'];
     textAlign?: CSSObject['textAlign'];
@@ -27,6 +34,7 @@ export type PrimitiveTextProps = {
     bottom?: CSSObject['bottom'];
     right?: CSSObject['right'];
 };
+export type PrimitiveTextProps = BasePrimitiveTextProps & StateStyles;
 export type TextProps = PrimitiveTextProps & Omit<React.HTMLAttributes<HTMLElement>, 'color'> & {
     children: React.ReactNode;
     as?: SemanticTagType;

package/dist/components/Sidebar/SidebarContent.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
 import { DirectoryData } from '../Directory/types';
-import { SidebarMerchantInfo } from './types';
+import { SidebarMerchantInfo, SidebarStateChangeType } from './types';
 export type SidebarContentProps = {
     sidebarTopSlot?: React.ReactNode;
     merchantInfo?: SidebarMerchantInfo;
@@ -19,6 +19,7 @@ export type SidebarContentProps = {
     iconOnlyMode?: boolean;
     footer?: React.ReactNode;
     setIsHovering?: (isHovering: boolean) => void;
+    sidebarState?: SidebarStateChangeType;
 };
 declare const SidebarContent: React.FC<SidebarContentProps>;
 export default SidebarContent;

package/dist/components/Sidebar/SidebarFooter.d.ts

@@ -1,7 +1,8 @@
 import { default as React } from 'react';
+import { SidebarStateChangeType } from './types';
 type SidebarFooterProps = {
     footer?: React.ReactNode;
-    isExpanded: boolean;
+    sidebarState: SidebarStateChangeType;
 };
 declare const SidebarFooter: React.FC<SidebarFooterProps>;
 export default SidebarFooter;

package/dist/components/Sidebar/types.d.ts

@@ -59,6 +59,7 @@ export type SidebarProps = {
     activeItem?: string | null;
     onActiveItemChange?: (item: string | null) => void;
     defaultActiveItem?: string | null;
+    onHoveringChange?: (isHovering: boolean) => void;
 };
 export type MobileNavigationItem = NavbarItem & {
     sectionLabel?: string;

package/dist/components/SingleSelect/SingleSelectMenu.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
-import { SelectMenuAlignment, SelectMenuSide, SelectMenuGroupType } from '../Select';
-import { SelectMenuSize, SelectMenuVariant, SingleSelectSkeletonProps } from './types';
+import { SelectMenuGroupType } from '../Select';
+import { SelectMenuAlignment, SelectMenuSide, SelectMenuSize, SelectMenuVariant, SingleSelectSkeletonProps } from './types';
 type SingleSelectMenuProps = {
     items: SelectMenuGroupType[];
     selected: string;

package/dist/context/ThemeContext.d.ts

@@ -50,6 +50,7 @@ import { ResponsiveAlertV2Tokens } from '../components/AlertV2/alertV2.tokens';
 import { ResponsiveAccordionV2Tokens } from '../components/AccordionV2/accordionV2.tokens';
 import { ResponsiveSnackbarV2Tokens } from '../components/SnackbarV2/snackbarV2.tokens';
 import { ResponsiveSwitchV2Tokens } from '../components/SwitchV2/switchV2.tokens';
+import { ResponsiveTextInputV2Tokens } from '../components/InputsV2/TextInputV2/TextInputV2.tokens';
 export type ComponentTokenType = {
     TAGS?: ResponsiveTagTokens;
     SEARCH_INPUT?: ResponsiveSearchInputTokens;
@@ -100,6 +101,7 @@ export type ComponentTokenType = {
     ACCORDIONV2?: ResponsiveAccordionV2Tokens;
     SNACKBARV2?: ResponsiveSnackbarV2Tokens;
     SWITCHV2?: ResponsiveSwitchV2Tokens;
+    TEXT_INPUTV2?: ResponsiveTextInputV2Tokens;
 };
 type ThemeContextType = {
     foundationTokens: ThemeType;

package/dist/context/useComponentToken.d.ts

@@ -48,4 +48,5 @@ import { ResponsiveAlertV2Tokens } from '../components/AlertV2';
 import { ResponsiveAccordionV2Tokens } from '../components/AccordionV2';
 import { ResponsiveSnackbarV2Tokens } from '../components/SnackbarV2';
 import { ResponsiveSwitchV2Tokens } from '../components/SwitchV2/switchV2.tokens';
-export declare const useComponentToken: (component: keyof ComponentTokenType) => ResponsiveSearchInputTokens | ResponsiveTagTokens | ResponsiveTextAreaTokens | ResponsiveTextInputTokens | ResponsiveNumberInputTokens | ResponsiveAlertTokens | ResponsiveRadioTokens | ResponsiveOTPInputTokens | ResponsiveUnitInputTokens | ResponsiveMultiValueInputTokens | ResponsiveSwitchTokens | ResponsiveCheckboxTokens | ResponsiveTabsTokens | ResponsiveTooltipTokens | ResponsiveDropdownInputTokens | ResponsiveModalTokens | ResponsiveBreadcrumbTokens | ResponsivePopoverTokens | ResponsiveMenuTokensType | ResponsiveMultiSelectTokens | ResponsiveSingleSelectTokens | ResponsiveTableTokens | ResponsiveCalendarTokens | ResponsiveAccordionTokens | ResponsiveStatCardTokens | ResponsiveProgressBarTokens | ResponsiveDrawerTokens | ResponsiveChartTokens | ResponsiveSnackbarTokens | ResponsiveStepperTokens | ResponsiveKeyValuePairTokens | ResponsiveCardTokens | ResponsiveSkeletonTokens | ResponsiveTopbarTokens | ResponsiveAvatarTokens | ResponsiveAvatarGroupTokens | ResponsiveSidebarTokens | ResponsiveUploadTokens | ResponsiveCodeBlockTokens | ResponsiveMobileNavigationTokens | ResponsiveDirectoryTokens | ResponsiveChatInputTokensType | ResponsiveButtonTokens | ResponsiveButtonV2Tokens | ResponsiveChatInputTokensType | ResponsiveTagV2Tokens | ResponsiveAlertV2Tokens | ResponsiveAccordionV2Tokens | ResponsiveSnackbarV2Tokens | ResponsiveSwitchV2Tokens;
+import { ResponsiveTextInputV2Tokens } from '../components/InputsV2/TextInputV2/TextInputV2.tokens';
+export declare const useComponentToken: (component: keyof ComponentTokenType) => ResponsiveSearchInputTokens | ResponsiveTagTokens | ResponsiveTextAreaTokens | ResponsiveTextInputTokens | ResponsiveNumberInputTokens | ResponsiveAlertTokens | ResponsiveRadioTokens | ResponsiveOTPInputTokens | ResponsiveUnitInputTokens | ResponsiveMultiValueInputTokens | ResponsiveSwitchTokens | ResponsiveCheckboxTokens | ResponsiveTabsTokens | ResponsiveTooltipTokens | ResponsiveDropdownInputTokens | ResponsiveModalTokens | ResponsiveBreadcrumbTokens | ResponsivePopoverTokens | ResponsiveMenuTokensType | ResponsiveMultiSelectTokens | ResponsiveSingleSelectTokens | ResponsiveTableTokens | ResponsiveCalendarTokens | ResponsiveAccordionTokens | ResponsiveStatCardTokens | ResponsiveProgressBarTokens | ResponsiveDrawerTokens | ResponsiveChartTokens | ResponsiveSnackbarTokens | ResponsiveStepperTokens | ResponsiveKeyValuePairTokens | ResponsiveCardTokens | ResponsiveSkeletonTokens | ResponsiveTopbarTokens | ResponsiveAvatarTokens | ResponsiveAvatarGroupTokens | ResponsiveSidebarTokens | ResponsiveUploadTokens | ResponsiveCodeBlockTokens | ResponsiveMobileNavigationTokens | ResponsiveDirectoryTokens | ResponsiveChatInputTokensType | ResponsiveButtonTokens | ResponsiveButtonV2Tokens | ResponsiveChatInputTokensType | ResponsiveTagV2Tokens | ResponsiveAlertV2Tokens | ResponsiveAccordionV2Tokens | ResponsiveSnackbarV2Tokens | ResponsiveSwitchV2Tokens | ResponsiveTextInputV2Tokens;

package/dist/global-utils/GlobalUtils.d.ts

@@ -9,3 +9,4 @@ export declare const getTruncatedText: (text: string, limit?: number) => {
 export declare const formatTextWithLineBreaks: (content: ReactNode | string) => ReactNode;
 export declare const addPxToValue: (value?: number | string) => string;
 export declare const flattenChildren: (children: React.ReactNode) => React.ReactElement<unknown>[];
+export declare const useAutofillDetection: (inputRef: React.RefObject<HTMLInputElement | null>, setIsAutofilled: (value: boolean) => void) => void;

package/dist/hooks/useInputSlotPadding.d.ts

@@ -0,0 +1,14 @@
+import { RefObject } from 'react';
+export type UseInputSlotPaddingParams = {
+    leftSlotRef: RefObject<HTMLDivElement | null>;
+    rightSlotRef: RefObject<HTMLDivElement | null>;
+    hasLeftSlot: boolean;
+    hasRightSlot: boolean;
+    paddingLeft: number;
+    paddingRight: number;
+    gap: number;
+};
+export declare function useInputSlotPadding({ leftSlotRef, rightSlotRef, hasLeftSlot, hasRightSlot, paddingLeft, paddingRight, gap, }: UseInputSlotPaddingParams): {
+    calculatedLeftInputPadding: number;
+    calculatedRightInputPadding: number;
+};