@juspay/blend-design-system 0.0.37-beta.4 → 0.0.37-beta.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Breadcrumb/Breadcrumb.d.ts +2 -5
- package/dist/components/Breadcrumb/types.d.ts +6 -0
- package/dist/components/Charts/ChartUtils.d.ts +2 -0
- package/dist/components/Charts/types.d.ts +2 -2
- package/dist/components/DateRangePicker/types.d.ts +1 -1
- package/dist/components/DateRangePicker/utils.d.ts +2 -0
- package/dist/components/Directory/Directory.d.ts +1 -1
- package/dist/components/Directory/types.d.ts +1 -1
- package/dist/components/Directory/utils.d.ts +2 -0
- package/dist/components/Radio/StyledRadio.d.ts +0 -1
- package/dist/components/Sidebar/SidebarContent.d.ts +1 -1
- package/dist/components/Sidebar/types.d.ts +10 -1
- package/dist/components/Sidebar/utils.d.ts +1 -1
- package/dist/components/SidebarV2/SidebarV2Panel.d.ts +1 -1
- package/dist/components/SidebarV2/index.d.ts +1 -1
- package/dist/components/SidebarV2/types.d.ts +3 -0
- package/dist/components/Stepper/types.d.ts +2 -0
- package/dist/main.js +27657 -27314
- package/dist/tokens.js +17 -16
- package/lib/components/Avatar/Avatar.tsx +6 -1
- package/lib/components/AvatarGroup/AvatarGroup.tsx +1 -1
- package/lib/components/AvatarV2/AvatarV2.tsx +10 -1
- package/lib/components/Breadcrumb/Breadcrumb.tsx +9 -8
- package/lib/components/Breadcrumb/types.ts +12 -0
- package/lib/components/Button/ButtonBase.tsx +1 -1
- package/lib/components/Card/CardComponents.tsx +52 -17
- package/lib/components/Charts/ChartUtils.tsx +7 -0
- package/lib/components/Charts/Charts.tsx +4 -2
- package/lib/components/Charts/CoreChart.tsx +4 -2
- package/lib/components/Charts/types.tsx +2 -2
- package/lib/components/ChartsV2/ChartV2.tsx +1 -1
- package/lib/components/Checkbox/Checkbox.tsx +29 -7
- package/lib/components/CodeBlock/CodeBlock.tsx +47 -1
- package/lib/components/CodeBlock/codeBlock.token.ts +5 -5
- package/lib/components/CodeEditor/CodeEditor.tsx +26 -4
- package/lib/components/CodeEditor/MonacoEditorWrapper.tsx +13 -1
- package/lib/components/DataTable/DataTable.tsx +8 -0
- package/lib/components/DataTable/TableHeader/FilterComponents.tsx +4 -0
- package/lib/components/DateRangePicker/DateRangePicker.tsx +34 -17
- package/lib/components/DateRangePicker/types.ts +5 -5
- package/lib/components/DateRangePicker/utils.ts +5 -0
- package/lib/components/Directory/Directory.tsx +3 -2
- package/lib/components/Directory/types.ts +1 -1
- package/lib/components/Directory/utils.ts +6 -0
- package/lib/components/Drawer/components/DrawerBase.tsx +16 -0
- package/lib/components/Drawer/components/NestedSelectDrawer.tsx +13 -1
- package/lib/components/Drawer/components/SelectDrawer.tsx +9 -1
- package/lib/components/Inputs/OTPInput/OTPInput.tsx +5 -3
- package/lib/components/Menu/Menu.tsx +9 -1
- package/lib/components/Modal/useModal.ts +7 -0
- package/lib/components/Radio/Radio.tsx +12 -5
- package/lib/components/Radio/StyledRadio.tsx +33 -17
- package/lib/components/Sidebar/Sidebar.tsx +11 -1
- package/lib/components/Sidebar/SidebarContent.tsx +5 -2
- package/lib/components/Sidebar/TenantPanel.tsx +52 -34
- package/lib/components/Sidebar/types.ts +11 -1
- package/lib/components/Sidebar/utils.ts +1 -1
- package/lib/components/SidebarV2/SecondarySidebar.tsx +86 -44
- package/lib/components/SidebarV2/SidebarV2Panel.tsx +4 -2
- package/lib/components/SidebarV2/index.ts +1 -0
- package/lib/components/SidebarV2/types.ts +4 -0
- package/lib/components/StatCard/statcard.tokens.ts +1 -1
- package/lib/components/Stepper/VerticalStepper.tsx +209 -171
- package/lib/components/Stepper/types.ts +2 -0
- package/lib/components/StepperV2/Stepper/Steps.tsx +15 -1
- package/lib/components/Text/Text.tsx +1 -0
- package/lib/components/Upload/Upload.tsx +6 -0
- package/lib/components/Upload/components/FileListDisplay.tsx +159 -16
- package/lib/components/Upload/utils.ts +10 -2
- package/lib/context/ThemeProvider.tsx +19 -8
- package/lib/hooks/useDebounce.ts +9 -1
- package/package.json +1 -1
|
@@ -1,9 +1,6 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { BreadcrumbProps } from './types';
|
|
2
2
|
declare const Breadcrumb: {
|
|
3
|
-
({ items, skeleton
|
|
4
|
-
items: BreadcrumbItemType[];
|
|
5
|
-
skeleton?: BreadcrumbSkeletonProps;
|
|
6
|
-
}): import("react/jsx-runtime").JSX.Element | null;
|
|
3
|
+
({ items: itemsProp, skeleton }: BreadcrumbProps): import("react/jsx-runtime").JSX.Element | null;
|
|
7
4
|
displayName: string;
|
|
8
5
|
};
|
|
9
6
|
export default Breadcrumb;
|
|
@@ -3,6 +3,12 @@ export type BreadcrumbSkeletonProps = {
|
|
|
3
3
|
show: boolean;
|
|
4
4
|
variant: SkeletonVariant;
|
|
5
5
|
};
|
|
6
|
+
/** Replace null, undefined, or non-array `items` with `[]`. */
|
|
7
|
+
export declare function normalizeBreadcrumbItems(items: BreadcrumbItemType[] | null | undefined): BreadcrumbItemType[];
|
|
8
|
+
export type BreadcrumbProps = {
|
|
9
|
+
items: BreadcrumbItemType[] | null;
|
|
10
|
+
skeleton?: BreadcrumbSkeletonProps;
|
|
11
|
+
};
|
|
6
12
|
export type BreadcrumbItemType = {
|
|
7
13
|
leftSlot?: React.ReactNode;
|
|
8
14
|
rightSlot?: React.ReactNode;
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import { NewNestedDataPoint, FlattenedDataPoint, AxisConfig } from './types';
|
|
2
|
+
/** Replace null, undefined, or non-array `data` with `[]` (empty / no-data state). */
|
|
3
|
+
export declare function normalizeChartData(data: NewNestedDataPoint[] | null | undefined): NewNestedDataPoint[];
|
|
2
4
|
export declare function transformNestedData(data: NewNestedDataPoint[], selectedKeys?: string[]): FlattenedDataPoint[];
|
|
3
5
|
export declare function transformScatterData(data: NewNestedDataPoint[], selectedKeys?: string[]): Array<{
|
|
4
6
|
name: string;
|
|
@@ -144,7 +144,7 @@ export type RenderChartProps = {
|
|
|
144
144
|
};
|
|
145
145
|
export type CoreChartProps = {
|
|
146
146
|
chartType?: ChartType;
|
|
147
|
-
data
|
|
147
|
+
data?: NewNestedDataPoint[] | null;
|
|
148
148
|
colors?: {
|
|
149
149
|
key: string;
|
|
150
150
|
color: string;
|
|
@@ -168,7 +168,7 @@ export type ChartsSkeletonProps = {
|
|
|
168
168
|
};
|
|
169
169
|
export type ChartsProps = {
|
|
170
170
|
chartType?: ChartType;
|
|
171
|
-
data
|
|
171
|
+
data?: NewNestedDataPoint[] | null;
|
|
172
172
|
colors?: {
|
|
173
173
|
key: string;
|
|
174
174
|
color: string;
|
|
@@ -165,7 +165,7 @@ export type CustomPresetDefinition = {
|
|
|
165
165
|
/**
|
|
166
166
|
* Presets configuration - can be predefined presets, custom configs, or custom definitions
|
|
167
167
|
*/
|
|
168
|
-
export type PresetsConfig =
|
|
168
|
+
export type PresetsConfig = (DateRangePreset | CustomPresetConfig | CustomPresetDefinition)[];
|
|
169
169
|
/**
|
|
170
170
|
* Function type for custom date disabling logic
|
|
171
171
|
* @param date The date to check
|
|
@@ -62,6 +62,8 @@ export declare const parseDate: (dateString: string, format: string, hour: numbe
|
|
|
62
62
|
* @returns True if the date is valid
|
|
63
63
|
*/
|
|
64
64
|
export declare const isValidDate: (date: Date) => boolean;
|
|
65
|
+
/** True when a controlled `value` has a usable start date (avoids `.getTime()` on undefined). */
|
|
66
|
+
export declare const isControlledDateRange: (value?: DateRange | null) => value is DateRange;
|
|
65
67
|
/**
|
|
66
68
|
* Formats time in 12-hour format
|
|
67
69
|
* @param date The date to format
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { DirectoryProps } from './types';
|
|
2
2
|
declare const Directory: {
|
|
3
|
-
({ directoryData, idPrefix, activeItem, onActiveItemChange, defaultActiveItem, iconOnlyMode, }: DirectoryProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
({ directoryData: directoryDataProp, idPrefix, activeItem, onActiveItemChange, defaultActiveItem, iconOnlyMode, }: DirectoryProps): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
displayName: string;
|
|
5
5
|
};
|
|
6
6
|
export default Directory;
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { DirectoryData } from './types';
|
|
2
|
+
export declare const normalizeDirectoryData: (directoryData: DirectoryData[] | null) => DirectoryData[];
|
|
1
3
|
export declare const handleSectionNavigation: (direction: "up" | "down", currentIndex: number, totalItems: number, selector?: string, childSelector?: string) => number;
|
|
2
4
|
export declare const handleKeyDown: (e: React.KeyboardEvent, options: {
|
|
3
5
|
hasChildren?: boolean;
|
|
@@ -3,7 +3,6 @@ import { RadioTokensType } from './radio.token';
|
|
|
3
3
|
export declare const StyledRadioInput: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {
|
|
4
4
|
size: RadioSize;
|
|
5
5
|
$isDisabled: boolean;
|
|
6
|
-
$isChecked: boolean;
|
|
7
6
|
$error?: boolean;
|
|
8
7
|
$tokens: RadioTokensType;
|
|
9
8
|
}>> & string;
|
|
@@ -11,7 +11,7 @@ export type SidebarContentProps = {
|
|
|
11
11
|
sidebarNavId?: string;
|
|
12
12
|
showTopBlur: boolean;
|
|
13
13
|
showBottomBlur: boolean;
|
|
14
|
-
data: DirectoryData[];
|
|
14
|
+
data: DirectoryData[] | null;
|
|
15
15
|
idPrefix: string;
|
|
16
16
|
activeItem?: string | null;
|
|
17
17
|
onActiveItemChange?: (item: string | null) => void;
|
|
@@ -1,11 +1,19 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
+
import { BadgeColor, BadgePosition, BadgeSize } from '../Badge/Badge.types';
|
|
2
3
|
import { DirectoryData, NavbarItem } from '../Directory/types';
|
|
3
4
|
import { MerchantInfo } from '../Topbar/types';
|
|
5
|
+
export type TenantBadge = {
|
|
6
|
+
text: string;
|
|
7
|
+
size?: BadgeSize;
|
|
8
|
+
color?: BadgeColor;
|
|
9
|
+
position?: BadgePosition;
|
|
10
|
+
};
|
|
4
11
|
export type LeftPanelItem = {
|
|
5
12
|
label: string;
|
|
6
13
|
icon: ReactNode;
|
|
7
14
|
value?: string;
|
|
8
15
|
showInPanel?: boolean;
|
|
16
|
+
badge?: TenantBadge;
|
|
9
17
|
};
|
|
10
18
|
export type LeftPanelInfo = {
|
|
11
19
|
items: LeftPanelItem[];
|
|
@@ -20,6 +28,7 @@ export type TenantItem = {
|
|
|
20
28
|
value?: string;
|
|
21
29
|
icon: ReactNode;
|
|
22
30
|
showInPanel?: boolean;
|
|
31
|
+
badge?: TenantBadge;
|
|
23
32
|
};
|
|
24
33
|
export type SidebarMerchantInfo = {
|
|
25
34
|
items: Array<{
|
|
@@ -34,7 +43,7 @@ export type SidebarStateChangeType = 'collapsed' | 'expanded' | 'intermediate';
|
|
|
34
43
|
export type SidebarProps = {
|
|
35
44
|
showLeftPanel?: boolean;
|
|
36
45
|
children: ReactNode;
|
|
37
|
-
data: DirectoryData[];
|
|
46
|
+
data: DirectoryData[] | null;
|
|
38
47
|
leftPanel?: LeftPanelInfo;
|
|
39
48
|
topbar: ReactNode;
|
|
40
49
|
footer?: ReactNode;
|
|
@@ -20,7 +20,7 @@ export declare const getDefaultMerchantInfo: () => {
|
|
|
20
20
|
};
|
|
21
21
|
export declare const useTopbarAutoHide: (enableTopbarAutoHide: boolean) => boolean;
|
|
22
22
|
export declare const isControlledSidebar: (isExpanded: boolean | undefined) => boolean;
|
|
23
|
-
export declare const getMobileNavigationItems: (directory
|
|
23
|
+
export declare const getMobileNavigationItems: (directory?: DirectoryData[] | null) => MobileNavigationItem[];
|
|
24
24
|
/**
|
|
25
25
|
* Parse CSS unit values to numbers (e.g., "16px" -> 16)
|
|
26
26
|
* Returns 0 for invalid values
|
|
@@ -18,7 +18,7 @@ export type SidebarV2PanelProps = {
|
|
|
18
18
|
sidebarCollapseKey: string;
|
|
19
19
|
onToggle: () => void;
|
|
20
20
|
sidebarNavId?: string;
|
|
21
|
-
data: DirectoryData[];
|
|
21
|
+
data: DirectoryData[] | null;
|
|
22
22
|
idPrefix: string;
|
|
23
23
|
activeItem?: string | null;
|
|
24
24
|
onActiveItemChange?: (item: string | null) => void;
|
|
@@ -3,7 +3,7 @@ export { default as SidebarV2Panel } from './SidebarV2Panel';
|
|
|
3
3
|
export { default as SidebarV2Header } from './SidebarV2Header';
|
|
4
4
|
export { default as SidebarV2Footer } from './SidebarV2Footer';
|
|
5
5
|
export { SecondarySidebar } from './SecondarySidebar';
|
|
6
|
-
export type { SecondarySidebarInfo, SecondarySidebarItem, SidebarV2Props, SidebarV2StateChangeType, } from './types';
|
|
6
|
+
export type { SecondarySidebarInfo, SecondarySidebarItem, SidebarV2Props, SidebarV2StateChangeType, TenantBadge, } from './types';
|
|
7
7
|
export { SidebarV2StateChange } from './types';
|
|
8
8
|
export type { SidebarV2PanelProps } from './SidebarV2Panel';
|
|
9
9
|
export * from './sidebarV2.tokens';
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { ButtonHTMLAttributes, ReactNode } from 'react';
|
|
2
2
|
import { DirectoryData } from '../Directory/types';
|
|
3
3
|
import { MerchantInfo } from '../Topbar/types';
|
|
4
|
+
import { TenantBadge } from '../Sidebar/types';
|
|
5
|
+
export type { TenantBadge } from '../Sidebar/types';
|
|
4
6
|
export declare enum SidebarV2StateChange {
|
|
5
7
|
COLLAPSED = "collapsed",
|
|
6
8
|
EXPANDED = "expanded",
|
|
@@ -11,6 +13,7 @@ export type SecondarySidebarItem = {
|
|
|
11
13
|
label: string;
|
|
12
14
|
value: string;
|
|
13
15
|
icon: ReactNode;
|
|
16
|
+
badge?: TenantBadge;
|
|
14
17
|
};
|
|
15
18
|
export type SecondarySidebarInfo = {
|
|
16
19
|
items: SecondarySidebarItem[];
|
|
@@ -22,6 +22,7 @@ export type SubStep = {
|
|
|
22
22
|
title: string;
|
|
23
23
|
status?: StepState;
|
|
24
24
|
disabled?: boolean;
|
|
25
|
+
slot?: ReactNode;
|
|
25
26
|
};
|
|
26
27
|
export type Step = {
|
|
27
28
|
id: number;
|
|
@@ -30,6 +31,7 @@ export type Step = {
|
|
|
30
31
|
disabled?: boolean;
|
|
31
32
|
description?: string;
|
|
32
33
|
icon?: ReactNode;
|
|
34
|
+
slot?: ReactNode;
|
|
33
35
|
substeps?: SubStep[];
|
|
34
36
|
isExpandable?: boolean;
|
|
35
37
|
isExpanded?: boolean;
|