@juspay/blend-design-system 0.0.22-beta → 0.0.22

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

@@ -5,5 +5,6 @@ declare const AccordionItem: import('react').ForwardRefExoticComponent<Accordion
     isFirst?: boolean;
     isLast?: boolean;
     isIntermediate?: boolean;
+    currentValue?: string | string[];
 } & import('react').RefAttributes<HTMLDivElement>>;
 export default AccordionItem;

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

@@ -41,7 +41,6 @@ export type CustomCardProps = {
     children: ReactNode;
 };
 export type CardProps = {
-    className?: string;
     maxWidth?: string;
     /**
      * Height of the card. Accepts any valid CSS height value.

package/dist/components/Charts/renderChart.d.ts

@@ -1,2 +1,2 @@
 import { RenderChartProps } from './types';
-export declare const renderChart: ({ flattenedData, chartType, hoveredKey, lineKeys, colors, setHoveredKey, data: originalData, selectedKeys, isSmallScreen, barsize, xAxis, yAxis, noData, }: RenderChartProps) => import("react/jsx-runtime").JSX.Element;
+export declare const renderChart: ({ chartName, flattenedData, chartType, hoveredKey, lineKeys, colors, setHoveredKey, data: originalData, selectedKeys, isSmallScreen, barsize, xAxis, yAxis, noData, }: RenderChartProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -90,6 +90,7 @@ export type StackedLegendsDataPoint = {
     changeType: LegendsChangeType;
 };
 export type RenderChartProps = {
+    chartName?: string;
     flattenedData: FlattenedDataPoint[];
     chartType: ChartType;
     hoveredKey: string | null;
@@ -139,6 +140,7 @@ export type ChartsProps = {
     showCollapseIcon?: boolean;
     isExpanded?: boolean;
     onExpandedChange?: (isExpanded: boolean) => void;
+    chartName?: string;
 };
 export type FlattenedDataPoint = {
     name: string;

package/dist/components/DataTable/TableHeader/handlers.d.ts

@@ -19,10 +19,10 @@ export type SortHandlers = {
     handleSortAscending: (field: string) => void;
     handleSortDescending: (field: string) => void;
 };
+export declare const createSortHandlers: (sortState: SortState, onSort: (field: keyof Record<string, unknown>) => void, onSortAscending?: (field: keyof Record<string, unknown>) => void, onSortDescending?: (field: keyof Record<string, unknown>) => void) => SortHandlers;
 export type FilterHandlers = {
     handleSearchChange: (fieldKey: string, value: string) => void;
     handleSelectFilter: (column: ColumnDefinition<Record<string, unknown>>, fieldKey: string, value: string, onColumnFilter?: ColumnFilterHandler) => void;
     handleMultiSelectFilter: (column: ColumnDefinition<Record<string, unknown>>, fieldKey: string, value: string, onColumnFilter?: ColumnFilterHandler) => void;
 };
-export declare const createSortHandlers: (sortState: SortState, setSortState: React.Dispatch<React.SetStateAction<SortState>>, onSort: (field: keyof Record<string, unknown>) => void) => SortHandlers;
 export declare const createFilterHandlers: (setFilterState: React.Dispatch<React.SetStateAction<FilterState>>) => FilterHandlers;

package/dist/components/DataTable/TableHeader/types.d.ts

@@ -1,10 +1,11 @@
-import { ColumnDefinition, FilterType, RowActionsConfig } from '../types';
+import { ColumnDefinition, FilterType, RowActionsConfig, SortConfig } from '../types';
 import { MobileDataTableConfig } from '../hooks/useMobileDataTable';
 export type TableHeaderProps<T extends Record<string, unknown>> = {
     visibleColumns: ColumnDefinition<T>[];
     allVisibleColumns?: ColumnDefinition<T>[];
     initialColumns: ColumnDefinition<T>[];
     selectAll: boolean | 'indeterminate';
+    sortConfig?: SortConfig | null;
     enableInlineEdit?: boolean;
     enableColumnManager?: boolean;
     columnManagerMaxSelections?: number;
@@ -31,6 +32,8 @@ export type TableHeaderProps<T extends Record<string, unknown>> = {
     mobileOverflowColumns?: ColumnDefinition<T>[];
     onMobileOverflowClick?: (row: T) => void;
     onSort: (field: keyof T) => void;
+    onSortAscending?: (field: keyof T) => void;
+    onSortDescending?: (field: keyof T) => void;
     onSelectAll: (checked: boolean | 'indeterminate') => void;
     onColumnChange: (columns: ColumnDefinition<T>[]) => void;
     onColumnFilter?: (field: string, type: FilterType, value: string | string[] | {

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

@@ -100,7 +100,6 @@ export type TriggerConfig = {
     placeholder?: string;
     showIcon?: boolean;
     icon?: ReactNode;
-    className?: string;
     style?: React.CSSProperties;
     renderTrigger?: (props: {
         selectedRange: DateRange | undefined;

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

@@ -69,18 +69,6 @@ export type DrawerProps = {
         left?: string;
         right?: string;
     };
-    /**
-     * Custom class name for the drawer content
-     */
-    className?: string;
-    /**
-     * Custom class name for the overlay
-     */
-    overlayClassName?: string;
-    /**
-     * Custom styles for the drawer content
-     */
-    style?: React.CSSProperties;
     /**
      * Children content
      */

package/dist/components/Inputs/NumberInput/numberInput.tokens.d.ts

@@ -2,6 +2,7 @@ import { CSSObject } from 'styled-components';
 import { FoundationTokenType } from '../../../tokens/theme.token';
 import { BreakpointType } from '../../../breakpoints/breakPoints';
 declare enum TextInputSize {
+    SM = "sm",
     MD = "md",
     LG = "lg"
 }

package/dist/components/Inputs/UnitInput/types.d.ts

@@ -1,4 +1,5 @@
 export declare enum UnitInputSize {
+    SMALL = "sm",
     MEDIUM = "md",
     LARGE = "lg"
 }

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

@@ -9,7 +9,6 @@ export type ModalProps = {
     children: ReactNode;
     primaryAction?: ModalButtonAction;
     secondaryAction?: ModalButtonAction;
-    className?: string;
     showCloseButton?: boolean;
     showHeader?: boolean;
     showFooter?: boolean;

package/dist/components/MultiSelect/MultiSelectMenuItem.d.ts

@@ -1,11 +1,12 @@
 import { MultiSelectMenuItemType } from './types';
 declare const MultiSelectMenuItem: {
-    ({ item, onSelect, selected, maxSelections, allItems, }: {
+    ({ item, onSelect, selected, maxSelections, allItems, index, }: {
         item: MultiSelectMenuItemType;
         onSelect: (value: string) => void;
         selected: string[];
         maxSelections?: number;
         allItems?: MultiSelectMenuItemType[];
+        index?: number;
     }): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/dist/components/MultiSelect/MultiSelectTrigger.d.ts

@@ -19,6 +19,7 @@ export type MultiSelectTriggerProps = {
     multiSelectTokens: MultiSelectTokensType;
     inline?: boolean;
     error?: boolean;
+    disabled?: boolean;
 };
-declare const MultiSelectTrigger: ({ selectedValues, slot, variant, size, isSmallScreen, onChange, name, label, placeholder, required, selectionTagType, valueLabelMap, open, onClick, multiSelectTokens, inline, error, }: MultiSelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
+declare const MultiSelectTrigger: ({ selectedValues, slot, variant, size, isSmallScreen, onChange, name, label, placeholder, required, selectionTagType, valueLabelMap, open, onClick, multiSelectTokens, inline, error, disabled, }: MultiSelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
 export default MultiSelectTrigger;

package/dist/components/MultiSelect/multiSelect.tokens.d.ts

@@ -76,6 +76,11 @@ export type MultiSelectTokensType = {
                 };
             };
         };
+        placeholder: {
+            color: CSSObject['color'];
+            fontSize: CSSObject['fontSize'];
+            fontWeight: CSSObject['fontWeight'];
+        };
     };
     menu: {
         backgroundColor: CSSObject['backgroundColor'];

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

@@ -18,5 +18,4 @@ export type ProgressBarProps = {
     variant?: ProgressBarVariant;
     type?: ProgressBarType;
     showLabel?: boolean;
-    className?: string;
 };

package/dist/components/Select/SelectItem/types.d.ts

@@ -35,4 +35,5 @@ export type SelectItemProps = {
     showCheckmark?: boolean;
     className?: string;
     selectedPosition?: 'first' | 'middle' | 'last' | 'only' | 'none';
+    index?: number;
 };

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

@@ -37,4 +37,20 @@ export type SidebarProps = {
     merchantInfo?: MerchantInfo;
     rightActions?: ReactNode;
     enableTopbarAutoHide?: boolean;
+    /**
+     * Controlled state: Current expanded state of the sidebar
+     * When provided, sidebar operates in controlled mode - parent must handle state updates
+     */
+    isExpanded?: boolean;
+    /**
+     * Callback fired when sidebar expand/collapse state should change
+     * In controlled mode: Parent should update isExpanded prop based on this callback
+     * In uncontrolled mode: Optional callback for state change notifications
+     */
+    onExpandedChange?: (isExpanded: boolean) => void;
+    /**
+     * Uncontrolled mode: Initial expanded state (defaults to true)
+     * Only used when isExpanded is not provided
+     */
+    defaultIsExpanded?: boolean;
 };

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

@@ -24,3 +24,4 @@ export declare const getDefaultMerchantInfo: () => {
     onSelect: (value: string) => void;
 };
 export declare const useTopbarAutoHide: (enableTopbarAutoHide: boolean) => boolean;
+export declare const isControlledSidebar: (isExpanded: boolean | undefined) => boolean;

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

@@ -19,6 +19,7 @@ export type SingleSelectTriggerProps = {
     inline?: boolean;
     error?: boolean;
     errorMessage?: string;
+    disabled?: boolean;
 };
-declare const SingleSelectTrigger: ({ size, selected, label, name, placeholder, required, valueLabelMap, open, onClick, slot, variant, isSmallScreenWithLargeSize, isItemSelected, singleSelectTokens, inline, error, }: SingleSelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
+declare const SingleSelectTrigger: ({ size, selected, label, name, placeholder, required, valueLabelMap, open, onClick, slot, variant, isSmallScreenWithLargeSize, isItemSelected, singleSelectTokens, inline, error, disabled, }: SingleSelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
 export default SingleSelectTrigger;

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

@@ -67,6 +67,16 @@ export type SingleSelectTokensType = {
                 [key in TriggerStates]: CSSObject['outline'];
             };
         };
+        placeholder: {
+            color: CSSObject['color'];
+            fontSize: CSSObject['fontSize'];
+            fontWeight: CSSObject['fontWeight'];
+        };
+        selectedValue: {
+            color: CSSObject['color'];
+            fontSize: CSSObject['fontSize'];
+            fontWeight: CSSObject['fontWeight'];
+        };
     };
     menu: {
         backgroundColor: CSSObject['backgroundColor'];

package/dist/components/StatCard/StatCard.d.ts

@@ -1,6 +1,6 @@
 import { StatCardProps } from './types';
 declare const StatCard: {
-    ({ title, value, valueTooltip, change, subtitle, variant, chartData, progressValue, titleIcon, actionIcon, helpIconText, dropdownProps, maxWidth, xAxis, yAxis, valueFormatter, height, direction, }: StatCardProps): import("react/jsx-runtime").JSX.Element;
+    ({ title, value, valueTooltip, change, subtitle, variant, chartData, progressValue, titleIcon, actionIcon, helpIconText, dropdownProps, maxWidth, xAxis, yAxis, valueFormatter, height, direction, ...props }: StatCardProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default StatCard;

package/dist/components/Tabs/Tabs.d.ts

@@ -1,4 +1,5 @@
-declare const Tabs: import('react').ForwardRefExoticComponent<Omit<import('@radix-ui/react-tabs').TabsProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
+import * as React from 'react';
+declare const Tabs: React.ForwardRefExoticComponent<Omit<import('@radix-ui/react-tabs').TabsProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
     variant?: import('./types').TabsVariant;
     size?: import('./types').TabsSize;
     items?: import('./types').TabItem[];
@@ -9,5 +10,6 @@ declare const Tabs: import('react').ForwardRefExoticComponent<Omit<import('@radi
     dropdownTooltip?: string;
     addButtonTooltip?: string;
     maxDisplayTabs?: number;
-} & import('react').RefAttributes<HTMLDivElement>>;
+    disable?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
 export default Tabs;

package/dist/components/Tabs/TabsList.d.ts

@@ -1,5 +1,6 @@
 import { TabsSize, TabsVariant } from './types';
-declare const TabsList: import('react').ForwardRefExoticComponent<Omit<import('@radix-ui/react-tabs').TabsListProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
+import * as React from 'react';
+declare const TabsList: React.ForwardRefExoticComponent<Omit<import('@radix-ui/react-tabs').TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
     variant?: TabsVariant;
     size?: TabsSize;
     expanded?: boolean;
@@ -14,5 +15,6 @@ declare const TabsList: import('react').ForwardRefExoticComponent<Omit<import('@
     maxDisplayTabs?: number;
     onTabChange?: (value: string) => void;
     activeTab?: string;
-} & import('react').RefAttributes<HTMLDivElement>>;
+    disable?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
 export default TabsList;

package/dist/components/Tabs/TabsTrigger.d.ts

@@ -8,5 +8,6 @@ declare const TabsTrigger: import('react').ForwardRefExoticComponent<Omit<import
     children: string | number;
     closable?: boolean;
     onClose?: () => void;
+    disable?: boolean;
 } & import('react').RefAttributes<HTMLButtonElement>>;
 export default TabsTrigger;

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

@@ -16,6 +16,7 @@ export type TabItem = {
     content: ReactNode;
     closable?: boolean;
     isDefault?: boolean;
+    disable?: boolean;
 };
 export type TabsProps = ComponentPropsWithoutRef<typeof TabsPrimitive.Root> & {
     variant?: TabsVariant;
@@ -28,6 +29,7 @@ export type TabsProps = ComponentPropsWithoutRef<typeof TabsPrimitive.Root> & {
     dropdownTooltip?: string;
     addButtonTooltip?: string;
     maxDisplayTabs?: number;
+    disable?: boolean;
 };
 export type TabsListProps = ComponentPropsWithoutRef<typeof TabsPrimitive.List> & {
     variant?: TabsVariant;
@@ -44,6 +46,7 @@ export type TabsListProps = ComponentPropsWithoutRef<typeof TabsPrimitive.List>
     maxDisplayTabs?: number;
     onTabChange?: (value: string) => void;
     activeTab?: string;
+    disable?: boolean;
 };
 export type TabsTriggerProps = ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger> & {
     value: string;
@@ -54,6 +57,7 @@ export type TabsTriggerProps = ComponentPropsWithoutRef<typeof TabsPrimitive.Tri
     children: string | number;
     closable?: boolean;
     onClose?: () => void;
+    disable?: boolean;
 };
 export type TabsContentProps = ComponentPropsWithoutRef<typeof TabsPrimitive.Content>;
 export type TabsStyles = {