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

package/dist/components/Accordion/accordion.tokens.d.ts

@@ -59,6 +59,9 @@ export type AccordionTokenType = {
                 };
             };
         };
+        slot?: {
+            maxWidth: CSSObject['maxWidth'];
+        };
     };
     separator: {
         color: {

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

@@ -7,6 +7,13 @@ export declare enum AccordionChevronPosition {
     LEFT = "left",
     RIGHT = "right"
 }
+export type SlotRenderProps = {
+    isExpanded: boolean;
+    toggle: () => void;
+    value: string;
+    isDisabled: boolean;
+};
+export type SlotType = ReactNode | ((props: SlotRenderProps) => ReactNode);
 export type AccordionItemProps = {
     value: string;
     title: string;
@@ -14,6 +21,8 @@ export type AccordionItemProps = {
     leftSlot?: ReactNode;
     rightSlot?: ReactNode;
     subtextSlot?: ReactNode;
+    triggerSlot?: SlotType;
+    triggerSlotWidth?: string | number;
     children: ReactNode;
     isDisabled?: boolean;
     chevronPosition?: AccordionChevronPosition;

package/dist/components/Checkbox/checkbox.token.d.ts

@@ -59,6 +59,9 @@ export type CheckboxTokensType = {
             fontWeight: {
                 [key in CheckboxSize]: CSSObject['fontWeight'];
             };
+            lineHeight: {
+                [key in CheckboxSize]: CSSObject['lineHeight'];
+            };
         };
         subtext: {
             color: {

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

@@ -30,6 +30,7 @@ export type SidebarMerchantInfo = {
     selected: string;
     onSelect: (value: string) => void;
 };
+export type SidebarStateChangeType = 'collapsed' | 'expanded' | 'intermediate';
 export type SidebarProps = {
     showLeftPanel?: boolean;
     children: ReactNode;
@@ -47,6 +48,7 @@ export type SidebarProps = {
     defaultIsTopbarVisible?: boolean;
     isExpanded?: boolean;
     onExpandedChange?: (isExpanded: boolean) => void;
+    onSidebarStateChange?: (state: SidebarStateChangeType) => void;
     defaultIsExpanded?: boolean;
     panelOnlyMode?: boolean;
     disableIntermediateState?: boolean;

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

@@ -1,3 +1,3 @@
 import { SingleSelectProps } from './types';
-declare const SingleSelect: ({ label, subLabel, hintText, required, helpIconText, placeholder, error, errorMessage, size, items, name, variant, disabled, selected, onSelect, enableSearch, searchPlaceholder, slot, customTrigger, useDrawerOnMobile, alignment, side, sideOffset, alignOffset, minMenuWidth, maxMenuWidth, maxMenuHeight, onBlur, onFocus, inline, fullWidth, enableVirtualization, virtualListItemHeight, virtualListOverscan, onEndReached, endReachedThreshold, hasMore, loadingComponent, skeleton, maxTriggerWidth, minTriggerWidth, allowCustomValue, customValueLabel, singleSelectGroupPosition, ...rest }: SingleSelectProps) => import("react/jsx-runtime").JSX.Element;
+declare const SingleSelect: ({ label, subLabel, hintText, required, helpIconText, placeholder, error, errorMessage, size, items, name, variant, disabled, selected, onSelect, enableSearch, searchPlaceholder, slot, customTrigger, useDrawerOnMobile, alignment, side, sideOffset, alignOffset, minMenuWidth, maxMenuWidth, maxMenuHeight, onBlur, onFocus, inline, fullWidth, enableVirtualization, virtualListItemHeight, virtualListOverscan, onEndReached, endReachedThreshold, hasMore, loadingComponent, skeleton, maxTriggerWidth, minTriggerWidth, allowCustomValue, customValueLabel, singleSelectGroupPosition, allowDeselect, ...rest }: SingleSelectProps) => import("react/jsx-runtime").JSX.Element;
 export default SingleSelect;

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

@@ -114,4 +114,5 @@ export type SingleSelectProps = {
     allowCustomValue?: boolean;
     customValueLabel?: string;
     singleSelectGroupPosition?: 'center' | 'left' | 'right';
+    allowDeselect?: boolean;
 };

package/dist/components/Tags/Tag.d.ts

@@ -1,5 +1,7 @@
 import { TagColor, TagShape, TagSize, TagVariant } from './types';
 declare const Tag: import('react').ForwardRefExoticComponent<Omit<import('../Primitives/Block/Block').BlockProps, "children"> & {
+    maxWidth?: import('styled-components').CSSObject["maxWidth"];
+    width?: import('styled-components').CSSObject["width"];
     text: string;
     variant?: TagVariant;
     color?: TagColor;

package/dist/components/Tags/TagBase.d.ts

@@ -5,6 +5,8 @@ export type TagBaseProps = TagProps & {
     tokens?: TagTokensType;
 };
 declare const TagBase: import('react').ForwardRefExoticComponent<Omit<import('../Primitives/Block/Block').BlockProps, "children"> & {
+    maxWidth?: import('styled-components').CSSObject["maxWidth"];
+    width?: import('styled-components').CSSObject["width"];
     text: string;
     variant?: TagVariant;
     color?: TagColor;

package/dist/components/Tags/Tags.d.ts

@@ -1,5 +1,7 @@
 import { TagColor, TagShape, TagSize, TagVariant } from './types';
 declare const Tag: import('react').ForwardRefExoticComponent<Omit<import('../Primitives/Block/Block').BlockProps, "children"> & {
+    maxWidth?: import('styled-components').CSSObject["maxWidth"];
+    width?: import('styled-components').CSSObject["width"];
     text: string;
     variant?: TagVariant;
     color?: TagColor;

package/dist/components/Tags/tag.tokens.d.ts

@@ -17,6 +17,9 @@ import { Theme } from '../../context/theme.enum';
  * Size-dependent properties: borderRadius, padding, fontSize, fontWeight, gap, height
  */
 export type TagTokensType = Readonly<{
+    minWidth: CSSObject['minWidth'];
+    maxWidth: CSSObject['maxWidth'];
+    width: CSSObject['width'];
     gap: CSSObject['gap'];
     backgroundColor: {
         [key in TagVariant]: {

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

@@ -1,6 +1,7 @@
 import { ReactNode } from 'react';
 import { SkeletonVariant } from '../Skeleton/skeleton.tokens';
 import { BlockProps } from '../Primitives/Block/Block';
+import { CSSObject } from 'styled-components';
 export declare enum TagVariant {
     NO_FILL = "noFill",
     ATTENTIVE = "attentive",
@@ -25,6 +26,8 @@ export declare enum TagShape {
     SQUARICAL = "squarical"
 }
 export type TagProps = Omit<BlockProps, 'children'> & {
+    maxWidth?: CSSObject['maxWidth'];
+    width?: CSSObject['width'];
     text: string;
     variant?: TagVariant;
     color?: TagColor;

package/dist/components/common/TruncatedTextWithTooltip.d.ts

@@ -1,13 +1,14 @@
 import { default as React } from 'react';
-import { TooltipSize } from '../Tooltip/types';
+import { TooltipSide, TooltipSize } from '../Tooltip/types';
 export type TruncatedTextWithTooltipProps = {
     text: string;
     style?: React.CSSProperties;
     tooltipSize?: TooltipSize;
     delayDuration?: number;
+    side?: TooltipSide;
     'data-id'?: string;
     'data-element'?: string;
 } & {
     [key: `data-${string}`]: string | undefined;
 };
-export declare const TruncatedTextWithTooltip: ({ text, style, tooltipSize, delayDuration, "data-id": dataId, "data-element": dataElement, ...restProps }: TruncatedTextWithTooltipProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TruncatedTextWithTooltip: ({ text, style, tooltipSize, delayDuration, "data-id": dataId, "data-element": dataElement, side, ...restProps }: TruncatedTextWithTooltipProps) => import("react/jsx-runtime").JSX.Element;

package/dist/hooks/index.d.ts

@@ -1,3 +1,6 @@
 export { default as useClickOutside } from './useClickOutside';
 export { default as useScrollLock } from './useScrollLock';
 export { default as usePreventParentScroll } from './usePreventParentScroll';
+export { default as useDropdownInteractionLock } from './useDropdownInteractionLock';
+export { default as useTruncationDetection } from './useTruncationDetection';
+export type { UseTruncationDetectionOptions } from './useTruncationDetection';

package/dist/hooks/useDropdownInteractionLock.d.ts

@@ -0,0 +1,6 @@
+type DropdownSelectors = {
+    content?: string[];
+    trigger?: string[];
+};
+export default function useDropdownInteractionLock(isOpen?: boolean, selectors?: DropdownSelectors): void;
+export {};

package/dist/hooks/useTruncationDetection.d.ts

@@ -0,0 +1,6 @@
+import { DependencyList } from 'react';
+export type UseTruncationDetectionOptions = {
+    disabled?: boolean;
+    deps?: DependencyList;
+};
+export default function useTruncationDetection(elementRef: React.RefObject<HTMLElement>, selector?: string, options?: UseTruncationDetectionOptions): boolean;