@indusaction/cms-design-system 0.1.0 → 0.2.0
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/README.md +19 -0
- package/dist/index.cjs +1612 -19
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +60 -0
- package/dist/index.css.map +1 -0
- package/dist/index.d.cts +298 -6
- package/dist/index.d.ts +298 -6
- package/dist/index.js +1595 -23
- package/dist/index.js.map +1 -1
- package/package.json +3 -13
package/dist/index.d.cts
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
|
+
import * as antd from 'antd';
|
|
3
|
+
import { ButtonProps as ButtonProps$1, TabsProps as TabsProps$1, DropdownProps as DropdownProps$1, TablePaginationConfig, TagProps as TagProps$1, CardProps as CardProps$1, SkeletonProps as SkeletonProps$1, Skeleton as Skeleton$1, ModalProps as ModalProps$1, Modal as Modal$1, MenuProps, SiderProps, ResultProps, ThemeConfig } from 'antd';
|
|
4
|
+
export { MenuProps, ModalFuncProps, TabPaneProps } from 'antd';
|
|
5
|
+
import { DropdownButtonProps as DropdownButtonProps$1 } from 'antd/es/dropdown';
|
|
6
|
+
import { TableProps as TableProps$1, ColumnGroupType, ColumnType } from 'antd/es/table';
|
|
7
|
+
import { FilterValue, SorterResult, TableCurrentDataSource } from 'antd/es/table/interface';
|
|
8
|
+
import { LinkProps as LinkProps$1 } from 'antd/es/typography/Link';
|
|
3
9
|
|
|
4
10
|
type ButtonVariant = "primary" | "default" | "dashed" | "link" | "text";
|
|
5
11
|
type ButtonSize = "large" | "middle" | "small";
|
|
@@ -10,12 +16,253 @@ interface ButtonProps extends Omit<ButtonProps$1, "type" | "variant" | "size" |
|
|
|
10
16
|
}
|
|
11
17
|
declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
12
18
|
|
|
19
|
+
interface TabsProps extends Omit<TabsProps$1, "type"> {
|
|
20
|
+
type?: "line" | "card";
|
|
21
|
+
}
|
|
22
|
+
declare const Tabs: React.FC<TabsProps>;
|
|
23
|
+
|
|
24
|
+
interface DropdownProps extends DropdownProps$1 {
|
|
25
|
+
children?: React.ReactNode;
|
|
26
|
+
}
|
|
27
|
+
interface DropdownButtonProps extends DropdownButtonProps$1 {
|
|
28
|
+
children?: React.ReactNode;
|
|
29
|
+
}
|
|
30
|
+
declare const DropdownButton: React.FC<DropdownButtonProps>;
|
|
31
|
+
interface DropdownInterface extends React.FC<DropdownProps> {
|
|
32
|
+
Button: typeof DropdownButton;
|
|
33
|
+
}
|
|
34
|
+
declare const Dropdown: DropdownInterface;
|
|
35
|
+
|
|
36
|
+
type TableMode = "client" | "server";
|
|
37
|
+
type TableSortOrder = "ascend" | "descend" | null;
|
|
38
|
+
type TableQuery = {
|
|
39
|
+
search: string;
|
|
40
|
+
page: number;
|
|
41
|
+
pageSize: number;
|
|
42
|
+
sortField?: React.Key | readonly React.Key[];
|
|
43
|
+
sortOrder?: TableSortOrder;
|
|
44
|
+
filters: Record<string, FilterValue | null>;
|
|
45
|
+
};
|
|
46
|
+
type TableSearchConfig = {
|
|
47
|
+
placeholder?: string;
|
|
48
|
+
value?: string;
|
|
49
|
+
defaultValue?: string;
|
|
50
|
+
onChange?: (value: string) => void;
|
|
51
|
+
debounceMs?: number;
|
|
52
|
+
};
|
|
53
|
+
type TableColumnType<T> = ColumnType<T> & {
|
|
54
|
+
/** Include this column in free-text search. Default: true when `dataIndex` is set. */
|
|
55
|
+
searchable?: boolean;
|
|
56
|
+
};
|
|
57
|
+
type TableColumnGroupType<T> = Omit<ColumnGroupType<T>, "children"> & {
|
|
58
|
+
children: TableColumnsType<T>;
|
|
59
|
+
};
|
|
60
|
+
type TableColumnsType<T> = (TableColumnGroupType<T> | TableColumnType<T>)[];
|
|
61
|
+
interface TableProps<T extends object> extends Omit<TableProps$1<T>, "columns" | "onChange" | "pagination"> {
|
|
62
|
+
columns?: TableColumnsType<T>;
|
|
63
|
+
/**
|
|
64
|
+
* `client` (default): search, filters, sort, and pagination run on `dataSource`.
|
|
65
|
+
* `server`: `dataSource` is the current page only. Pass `pagination.total` from the
|
|
66
|
+
* API and handle `onQueryChange` to fetch the next page / search / sort / filters.
|
|
67
|
+
*/
|
|
68
|
+
mode?: TableMode;
|
|
69
|
+
/** Free-text search, shown on the same row as pagination above the table. Pass `false` to hide it. */
|
|
70
|
+
search?: boolean | TableSearchConfig;
|
|
71
|
+
pagination?: false | TablePaginationConfig;
|
|
72
|
+
onChange?: (pagination: TablePaginationConfig, filters: Record<string, FilterValue | null>, sorter: SorterResult<T> | SorterResult<T>[], extra: TableCurrentDataSource<T>) => void;
|
|
73
|
+
/** Fires whenever search, page, page size, sort, or column filters change. */
|
|
74
|
+
onQueryChange?: (query: TableQuery) => void;
|
|
75
|
+
}
|
|
76
|
+
declare function Table<T extends object>({ columns, dataSource, mode, search, pagination, onChange, onQueryChange, scroll, size, loading, rowKey, ...rest }: TableProps<T>): React.JSX.Element;
|
|
77
|
+
declare namespace Table {
|
|
78
|
+
var displayName: string;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
interface TagProps extends TagProps$1 {
|
|
82
|
+
children?: React.ReactNode;
|
|
83
|
+
}
|
|
84
|
+
declare const Tag: React.ForwardRefExoticComponent<TagProps & React.RefAttributes<HTMLSpanElement>>;
|
|
85
|
+
|
|
86
|
+
interface LinkProps extends LinkProps$1 {
|
|
87
|
+
children?: React.ReactNode;
|
|
88
|
+
}
|
|
89
|
+
declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLElement>>;
|
|
90
|
+
|
|
91
|
+
interface CardProps extends Omit<CardProps$1, "title" | "loading"> {
|
|
92
|
+
title?: React.ReactNode;
|
|
93
|
+
description?: React.ReactNode;
|
|
94
|
+
tags?: React.ReactNode;
|
|
95
|
+
extraInfo?: React.ReactNode;
|
|
96
|
+
ctas?: React.ReactNode;
|
|
97
|
+
layout?: "inline" | "grid";
|
|
98
|
+
children?: React.ReactNode;
|
|
99
|
+
/** Replace body content with a details skeleton while data is loading. */
|
|
100
|
+
loading?: boolean;
|
|
101
|
+
/** Placeholder field rows shown when `loading` is true. Default: 5 */
|
|
102
|
+
loadingRows?: number;
|
|
103
|
+
}
|
|
104
|
+
declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
|
|
105
|
+
|
|
106
|
+
type SkeletonProps = SkeletonProps$1;
|
|
107
|
+
interface DetailsSkeletonProps {
|
|
108
|
+
/** Number of label/value placeholder rows. Default: 5 */
|
|
109
|
+
rows?: number;
|
|
110
|
+
/** Show an avatar + title block above the fields. */
|
|
111
|
+
avatar?: boolean;
|
|
112
|
+
}
|
|
113
|
+
declare function DetailsSkeleton({ rows, avatar }: DetailsSkeletonProps): React.JSX.Element;
|
|
114
|
+
declare namespace DetailsSkeleton {
|
|
115
|
+
var displayName: string;
|
|
116
|
+
}
|
|
117
|
+
interface SkeletonInterface extends React.FC<SkeletonProps> {
|
|
118
|
+
Button: typeof Skeleton$1.Button;
|
|
119
|
+
Avatar: typeof Skeleton$1.Avatar;
|
|
120
|
+
Input: typeof Skeleton$1.Input;
|
|
121
|
+
Image: typeof Skeleton$1.Image;
|
|
122
|
+
Node: typeof Skeleton$1.Node;
|
|
123
|
+
Details: typeof DetailsSkeleton;
|
|
124
|
+
}
|
|
125
|
+
declare const Skeleton: SkeletonInterface;
|
|
126
|
+
|
|
127
|
+
interface ModalProps extends ModalProps$1 {
|
|
128
|
+
children?: React.ReactNode;
|
|
129
|
+
}
|
|
130
|
+
interface ModalInterface extends React.FC<ModalProps> {
|
|
131
|
+
info: typeof Modal$1.info;
|
|
132
|
+
success: typeof Modal$1.success;
|
|
133
|
+
error: typeof Modal$1.error;
|
|
134
|
+
warning: typeof Modal$1.warning;
|
|
135
|
+
warn: typeof Modal$1.warn;
|
|
136
|
+
confirm: typeof Modal$1.confirm;
|
|
137
|
+
destroyAll: typeof Modal$1.destroyAll;
|
|
138
|
+
config: typeof Modal$1.config;
|
|
139
|
+
useModal: typeof Modal$1.useModal;
|
|
140
|
+
}
|
|
141
|
+
declare const Modal: ModalInterface;
|
|
142
|
+
|
|
143
|
+
type HeaderBreadcrumb = {
|
|
144
|
+
title: React.ReactNode;
|
|
145
|
+
href?: string;
|
|
146
|
+
onClick?: () => void;
|
|
147
|
+
};
|
|
148
|
+
type HeaderUser = {
|
|
149
|
+
name: string;
|
|
150
|
+
role?: string;
|
|
151
|
+
avatarSrc?: string;
|
|
152
|
+
};
|
|
153
|
+
type HeaderAction = {
|
|
154
|
+
key: string;
|
|
155
|
+
label: React.ReactNode;
|
|
156
|
+
variant?: ButtonVariant;
|
|
157
|
+
icon?: React.ReactNode;
|
|
158
|
+
onClick?: () => void;
|
|
159
|
+
href?: string;
|
|
160
|
+
disabled?: boolean;
|
|
161
|
+
danger?: boolean;
|
|
162
|
+
};
|
|
163
|
+
interface HeaderProps {
|
|
164
|
+
/** Page title on the left of the bar. */
|
|
165
|
+
title?: React.ReactNode;
|
|
166
|
+
/** Supporting text under the title. `description` is preferred. */
|
|
167
|
+
description?: React.ReactNode;
|
|
168
|
+
/** @deprecated Use `description`. */
|
|
169
|
+
subtitle?: React.ReactNode;
|
|
170
|
+
breadcrumbs?: HeaderBreadcrumb[];
|
|
171
|
+
/** Primary CTAs, rendered on the top-right of the bar. */
|
|
172
|
+
actions?: HeaderAction[];
|
|
173
|
+
/** Extra nodes after the CTA buttons (filters, custom controls). */
|
|
174
|
+
extra?: React.ReactNode;
|
|
175
|
+
/** Slot before the title — typically a mobile menu button. */
|
|
176
|
+
leading?: React.ReactNode;
|
|
177
|
+
user?: HeaderUser | null;
|
|
178
|
+
userMenu?: MenuProps;
|
|
179
|
+
onLogout?: () => void;
|
|
180
|
+
sticky?: boolean;
|
|
181
|
+
className?: string;
|
|
182
|
+
style?: React.CSSProperties;
|
|
183
|
+
}
|
|
184
|
+
declare const Header: React.ForwardRefExoticComponent<HeaderProps & React.RefAttributes<HTMLElement>>;
|
|
185
|
+
|
|
186
|
+
declare const indusActionLogo: string;
|
|
187
|
+
|
|
188
|
+
type SideNavItem = NonNullable<NonNullable<MenuProps["items"]>[number]>;
|
|
189
|
+
interface SideNavUser {
|
|
190
|
+
name: string;
|
|
191
|
+
role?: string;
|
|
192
|
+
avatarSrc?: string;
|
|
193
|
+
}
|
|
194
|
+
interface SideNavProps extends Omit<SiderProps, "children" | "breakpoint"> {
|
|
195
|
+
items?: MenuProps["items"];
|
|
196
|
+
menu?: Omit<MenuProps, "items" | "mode">;
|
|
197
|
+
user?: SideNavUser | null;
|
|
198
|
+
onLogout?: () => void;
|
|
199
|
+
logoutLabel?: string;
|
|
200
|
+
logoSrc?: string;
|
|
201
|
+
logoAlt?: string;
|
|
202
|
+
logo?: ReactNode;
|
|
203
|
+
/**
|
|
204
|
+
* Below this breakpoint the sider becomes a drawer (phone layout).
|
|
205
|
+
* Set `false` to always keep the desktop sider.
|
|
206
|
+
* @default "md"
|
|
207
|
+
*/
|
|
208
|
+
breakpoint?: SiderProps["breakpoint"] | false;
|
|
209
|
+
/**
|
|
210
|
+
* When false, skip the fixed mobile logo bar. Use when a parent header
|
|
211
|
+
* already provides a menu trigger (for example AppShell).
|
|
212
|
+
* @default true
|
|
213
|
+
*/
|
|
214
|
+
showMobileBar?: boolean;
|
|
215
|
+
/** Replace or hide (`null`) the default mobile menu button. */
|
|
216
|
+
mobileTrigger?: ReactNode | null;
|
|
217
|
+
mobileOpen?: boolean;
|
|
218
|
+
onMobileOpenChange?: (open: boolean) => void;
|
|
219
|
+
}
|
|
220
|
+
declare function SideNav({ items, menu, user, onLogout, logoutLabel, logoSrc, logoAlt, logo, width, theme, collapsed: collapsedProp, defaultCollapsed, onCollapse, collapsible, trigger, style, breakpoint, showMobileBar, mobileTrigger, mobileOpen: mobileOpenProp, onMobileOpenChange, ...siderProps }: SideNavProps): React.JSX.Element;
|
|
221
|
+
declare namespace SideNav {
|
|
222
|
+
var displayName: string;
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
type StatusPageStatus = NonNullable<ResultProps["status"]>;
|
|
226
|
+
interface StatusPageProps {
|
|
227
|
+
status: StatusPageStatus;
|
|
228
|
+
title?: React.ReactNode;
|
|
229
|
+
subTitle?: React.ReactNode;
|
|
230
|
+
actionLabel?: string;
|
|
231
|
+
/** Click handler for the default action button. */
|
|
232
|
+
onAction?: () => void;
|
|
233
|
+
/** If set, the default action button renders as a link. */
|
|
234
|
+
actionHref?: string;
|
|
235
|
+
/** Replaces the default action button. */
|
|
236
|
+
extra?: React.ReactNode;
|
|
237
|
+
/** Fill the viewport and center the result. Default: true. */
|
|
238
|
+
fullPage?: boolean;
|
|
239
|
+
className?: string;
|
|
240
|
+
style?: React.CSSProperties;
|
|
241
|
+
}
|
|
242
|
+
declare function StatusPage({ status, title, subTitle, actionLabel, onAction, actionHref, extra, fullPage, className, style, }: StatusPageProps): React.JSX.Element;
|
|
243
|
+
declare namespace StatusPage {
|
|
244
|
+
var displayName: string;
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
type NotFoundPageProps = Omit<StatusPageProps, "status">;
|
|
248
|
+
declare function NotFoundPage({ title, subTitle, actionLabel, actionHref, onAction, extra, ...rest }: NotFoundPageProps): React.JSX.Element;
|
|
249
|
+
declare namespace NotFoundPage {
|
|
250
|
+
var displayName: string;
|
|
251
|
+
}
|
|
252
|
+
|
|
253
|
+
type UnauthorizedPageProps = Omit<StatusPageProps, "status">;
|
|
254
|
+
declare function UnauthorizedPage({ title, subTitle, actionLabel, actionHref, onAction, extra, ...rest }: UnauthorizedPageProps): React.JSX.Element;
|
|
255
|
+
declare namespace UnauthorizedPage {
|
|
256
|
+
var displayName: string;
|
|
257
|
+
}
|
|
258
|
+
|
|
13
259
|
declare const colors: {
|
|
14
260
|
readonly brand: {
|
|
15
261
|
readonly primary: "#596993";
|
|
16
262
|
readonly primaryHover: "#6B7BA5";
|
|
17
263
|
readonly primaryActive: "#4A587C";
|
|
18
264
|
readonly primaryLight: "#E8EBF2";
|
|
265
|
+
readonly accent: "#F69120";
|
|
19
266
|
};
|
|
20
267
|
readonly neutral: {
|
|
21
268
|
readonly white: "#FFFFFF";
|
|
@@ -38,13 +285,58 @@ declare const colors: {
|
|
|
38
285
|
readonly info: "#596993";
|
|
39
286
|
};
|
|
40
287
|
};
|
|
288
|
+
declare const spacing: {
|
|
289
|
+
readonly none: 0;
|
|
290
|
+
readonly xxs: 4;
|
|
291
|
+
readonly xs: 8;
|
|
292
|
+
readonly sm: 12;
|
|
293
|
+
readonly md: 16;
|
|
294
|
+
readonly lg: 24;
|
|
295
|
+
readonly xl: 32;
|
|
296
|
+
readonly xxl: 48;
|
|
297
|
+
};
|
|
298
|
+
declare const fontSize: {
|
|
299
|
+
readonly xxs: 11;
|
|
300
|
+
readonly xs: 12;
|
|
301
|
+
readonly sm: 14;
|
|
302
|
+
readonly md: 16;
|
|
303
|
+
readonly lg: 20;
|
|
304
|
+
readonly xl: 24;
|
|
305
|
+
readonly xxl: 30;
|
|
306
|
+
};
|
|
307
|
+
/** Viewport min-widths. Matches Ant Design's `Grid` / `Sider` breakpoint names. */
|
|
308
|
+
declare const breakpoints: {
|
|
309
|
+
readonly xs: 480;
|
|
310
|
+
readonly sm: 576;
|
|
311
|
+
readonly md: 768;
|
|
312
|
+
readonly lg: 992;
|
|
313
|
+
readonly xl: 1200;
|
|
314
|
+
readonly xxl: 1600;
|
|
315
|
+
};
|
|
41
316
|
type Colors = typeof colors;
|
|
42
|
-
|
|
317
|
+
type Spacing = typeof spacing;
|
|
318
|
+
type FontSize = typeof fontSize;
|
|
319
|
+
type Breakpoints = typeof breakpoints;
|
|
320
|
+
/**
|
|
321
|
+
* Seed + map tokens only. Ant Design's algorithm applies these to Button,
|
|
322
|
+
* Menu, Layout, and every other component — no per-component lists.
|
|
323
|
+
*/
|
|
43
324
|
declare const theme: ThemeConfig;
|
|
44
|
-
|
|
45
325
|
interface ThemeProviderProps {
|
|
46
326
|
children: React.ReactNode;
|
|
47
327
|
}
|
|
48
|
-
declare function ThemeProvider({ children }: ThemeProviderProps): React.
|
|
328
|
+
declare function ThemeProvider({ children }: ThemeProviderProps): React.FunctionComponentElement<antd.ConfigProviderProps>;
|
|
329
|
+
|
|
330
|
+
type IconProps = {
|
|
331
|
+
size?: number;
|
|
332
|
+
className?: string;
|
|
333
|
+
style?: React.CSSProperties;
|
|
334
|
+
};
|
|
335
|
+
declare function LogoutIcon({ size, className, style }: IconProps): React.JSX.Element;
|
|
336
|
+
declare function CollapseIcon({ collapsed, size, className, style, }: IconProps & {
|
|
337
|
+
collapsed?: boolean;
|
|
338
|
+
}): React.JSX.Element;
|
|
339
|
+
declare function MenuIcon({ size, className, style }: IconProps): React.JSX.Element;
|
|
340
|
+
declare function CloseIcon({ size, className, style }: IconProps): React.JSX.Element;
|
|
49
341
|
|
|
50
|
-
export { Button, type ButtonProps, type ButtonSize, type ButtonVariant, type Colors, ThemeProvider, type ThemeProviderProps, colors, theme };
|
|
342
|
+
export { type Breakpoints, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, CloseIcon, CollapseIcon, type Colors, type DetailsSkeletonProps, Dropdown, type DropdownButtonProps, type DropdownInterface, type DropdownProps, type FontSize, Header, type HeaderAction, type HeaderBreadcrumb, type HeaderProps, type HeaderUser, Link, type LinkProps, LogoutIcon, MenuIcon, Modal, type ModalInterface, type ModalProps, NotFoundPage, type NotFoundPageProps, SideNav, type SideNavItem, type SideNavProps, type SideNavUser, Skeleton, type SkeletonInterface, type SkeletonProps, type Spacing, StatusPage, type StatusPageProps, type StatusPageStatus, Table, type TableColumnGroupType, type TableColumnType, type TableColumnsType, type TableMode, type TableProps, type TableQuery, type TableSearchConfig, type TableSortOrder, Tabs, type TabsProps, Tag, type TagProps, ThemeProvider, type ThemeProviderProps, UnauthorizedPage, type UnauthorizedPageProps, breakpoints, colors, fontSize, indusActionLogo, spacing, theme };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
|
+
import * as antd from 'antd';
|
|
3
|
+
import { ButtonProps as ButtonProps$1, TabsProps as TabsProps$1, DropdownProps as DropdownProps$1, TablePaginationConfig, TagProps as TagProps$1, CardProps as CardProps$1, SkeletonProps as SkeletonProps$1, Skeleton as Skeleton$1, ModalProps as ModalProps$1, Modal as Modal$1, MenuProps, SiderProps, ResultProps, ThemeConfig } from 'antd';
|
|
4
|
+
export { MenuProps, ModalFuncProps, TabPaneProps } from 'antd';
|
|
5
|
+
import { DropdownButtonProps as DropdownButtonProps$1 } from 'antd/es/dropdown';
|
|
6
|
+
import { TableProps as TableProps$1, ColumnGroupType, ColumnType } from 'antd/es/table';
|
|
7
|
+
import { FilterValue, SorterResult, TableCurrentDataSource } from 'antd/es/table/interface';
|
|
8
|
+
import { LinkProps as LinkProps$1 } from 'antd/es/typography/Link';
|
|
3
9
|
|
|
4
10
|
type ButtonVariant = "primary" | "default" | "dashed" | "link" | "text";
|
|
5
11
|
type ButtonSize = "large" | "middle" | "small";
|
|
@@ -10,12 +16,253 @@ interface ButtonProps extends Omit<ButtonProps$1, "type" | "variant" | "size" |
|
|
|
10
16
|
}
|
|
11
17
|
declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
12
18
|
|
|
19
|
+
interface TabsProps extends Omit<TabsProps$1, "type"> {
|
|
20
|
+
type?: "line" | "card";
|
|
21
|
+
}
|
|
22
|
+
declare const Tabs: React.FC<TabsProps>;
|
|
23
|
+
|
|
24
|
+
interface DropdownProps extends DropdownProps$1 {
|
|
25
|
+
children?: React.ReactNode;
|
|
26
|
+
}
|
|
27
|
+
interface DropdownButtonProps extends DropdownButtonProps$1 {
|
|
28
|
+
children?: React.ReactNode;
|
|
29
|
+
}
|
|
30
|
+
declare const DropdownButton: React.FC<DropdownButtonProps>;
|
|
31
|
+
interface DropdownInterface extends React.FC<DropdownProps> {
|
|
32
|
+
Button: typeof DropdownButton;
|
|
33
|
+
}
|
|
34
|
+
declare const Dropdown: DropdownInterface;
|
|
35
|
+
|
|
36
|
+
type TableMode = "client" | "server";
|
|
37
|
+
type TableSortOrder = "ascend" | "descend" | null;
|
|
38
|
+
type TableQuery = {
|
|
39
|
+
search: string;
|
|
40
|
+
page: number;
|
|
41
|
+
pageSize: number;
|
|
42
|
+
sortField?: React.Key | readonly React.Key[];
|
|
43
|
+
sortOrder?: TableSortOrder;
|
|
44
|
+
filters: Record<string, FilterValue | null>;
|
|
45
|
+
};
|
|
46
|
+
type TableSearchConfig = {
|
|
47
|
+
placeholder?: string;
|
|
48
|
+
value?: string;
|
|
49
|
+
defaultValue?: string;
|
|
50
|
+
onChange?: (value: string) => void;
|
|
51
|
+
debounceMs?: number;
|
|
52
|
+
};
|
|
53
|
+
type TableColumnType<T> = ColumnType<T> & {
|
|
54
|
+
/** Include this column in free-text search. Default: true when `dataIndex` is set. */
|
|
55
|
+
searchable?: boolean;
|
|
56
|
+
};
|
|
57
|
+
type TableColumnGroupType<T> = Omit<ColumnGroupType<T>, "children"> & {
|
|
58
|
+
children: TableColumnsType<T>;
|
|
59
|
+
};
|
|
60
|
+
type TableColumnsType<T> = (TableColumnGroupType<T> | TableColumnType<T>)[];
|
|
61
|
+
interface TableProps<T extends object> extends Omit<TableProps$1<T>, "columns" | "onChange" | "pagination"> {
|
|
62
|
+
columns?: TableColumnsType<T>;
|
|
63
|
+
/**
|
|
64
|
+
* `client` (default): search, filters, sort, and pagination run on `dataSource`.
|
|
65
|
+
* `server`: `dataSource` is the current page only. Pass `pagination.total` from the
|
|
66
|
+
* API and handle `onQueryChange` to fetch the next page / search / sort / filters.
|
|
67
|
+
*/
|
|
68
|
+
mode?: TableMode;
|
|
69
|
+
/** Free-text search, shown on the same row as pagination above the table. Pass `false` to hide it. */
|
|
70
|
+
search?: boolean | TableSearchConfig;
|
|
71
|
+
pagination?: false | TablePaginationConfig;
|
|
72
|
+
onChange?: (pagination: TablePaginationConfig, filters: Record<string, FilterValue | null>, sorter: SorterResult<T> | SorterResult<T>[], extra: TableCurrentDataSource<T>) => void;
|
|
73
|
+
/** Fires whenever search, page, page size, sort, or column filters change. */
|
|
74
|
+
onQueryChange?: (query: TableQuery) => void;
|
|
75
|
+
}
|
|
76
|
+
declare function Table<T extends object>({ columns, dataSource, mode, search, pagination, onChange, onQueryChange, scroll, size, loading, rowKey, ...rest }: TableProps<T>): React.JSX.Element;
|
|
77
|
+
declare namespace Table {
|
|
78
|
+
var displayName: string;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
interface TagProps extends TagProps$1 {
|
|
82
|
+
children?: React.ReactNode;
|
|
83
|
+
}
|
|
84
|
+
declare const Tag: React.ForwardRefExoticComponent<TagProps & React.RefAttributes<HTMLSpanElement>>;
|
|
85
|
+
|
|
86
|
+
interface LinkProps extends LinkProps$1 {
|
|
87
|
+
children?: React.ReactNode;
|
|
88
|
+
}
|
|
89
|
+
declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLElement>>;
|
|
90
|
+
|
|
91
|
+
interface CardProps extends Omit<CardProps$1, "title" | "loading"> {
|
|
92
|
+
title?: React.ReactNode;
|
|
93
|
+
description?: React.ReactNode;
|
|
94
|
+
tags?: React.ReactNode;
|
|
95
|
+
extraInfo?: React.ReactNode;
|
|
96
|
+
ctas?: React.ReactNode;
|
|
97
|
+
layout?: "inline" | "grid";
|
|
98
|
+
children?: React.ReactNode;
|
|
99
|
+
/** Replace body content with a details skeleton while data is loading. */
|
|
100
|
+
loading?: boolean;
|
|
101
|
+
/** Placeholder field rows shown when `loading` is true. Default: 5 */
|
|
102
|
+
loadingRows?: number;
|
|
103
|
+
}
|
|
104
|
+
declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
|
|
105
|
+
|
|
106
|
+
type SkeletonProps = SkeletonProps$1;
|
|
107
|
+
interface DetailsSkeletonProps {
|
|
108
|
+
/** Number of label/value placeholder rows. Default: 5 */
|
|
109
|
+
rows?: number;
|
|
110
|
+
/** Show an avatar + title block above the fields. */
|
|
111
|
+
avatar?: boolean;
|
|
112
|
+
}
|
|
113
|
+
declare function DetailsSkeleton({ rows, avatar }: DetailsSkeletonProps): React.JSX.Element;
|
|
114
|
+
declare namespace DetailsSkeleton {
|
|
115
|
+
var displayName: string;
|
|
116
|
+
}
|
|
117
|
+
interface SkeletonInterface extends React.FC<SkeletonProps> {
|
|
118
|
+
Button: typeof Skeleton$1.Button;
|
|
119
|
+
Avatar: typeof Skeleton$1.Avatar;
|
|
120
|
+
Input: typeof Skeleton$1.Input;
|
|
121
|
+
Image: typeof Skeleton$1.Image;
|
|
122
|
+
Node: typeof Skeleton$1.Node;
|
|
123
|
+
Details: typeof DetailsSkeleton;
|
|
124
|
+
}
|
|
125
|
+
declare const Skeleton: SkeletonInterface;
|
|
126
|
+
|
|
127
|
+
interface ModalProps extends ModalProps$1 {
|
|
128
|
+
children?: React.ReactNode;
|
|
129
|
+
}
|
|
130
|
+
interface ModalInterface extends React.FC<ModalProps> {
|
|
131
|
+
info: typeof Modal$1.info;
|
|
132
|
+
success: typeof Modal$1.success;
|
|
133
|
+
error: typeof Modal$1.error;
|
|
134
|
+
warning: typeof Modal$1.warning;
|
|
135
|
+
warn: typeof Modal$1.warn;
|
|
136
|
+
confirm: typeof Modal$1.confirm;
|
|
137
|
+
destroyAll: typeof Modal$1.destroyAll;
|
|
138
|
+
config: typeof Modal$1.config;
|
|
139
|
+
useModal: typeof Modal$1.useModal;
|
|
140
|
+
}
|
|
141
|
+
declare const Modal: ModalInterface;
|
|
142
|
+
|
|
143
|
+
type HeaderBreadcrumb = {
|
|
144
|
+
title: React.ReactNode;
|
|
145
|
+
href?: string;
|
|
146
|
+
onClick?: () => void;
|
|
147
|
+
};
|
|
148
|
+
type HeaderUser = {
|
|
149
|
+
name: string;
|
|
150
|
+
role?: string;
|
|
151
|
+
avatarSrc?: string;
|
|
152
|
+
};
|
|
153
|
+
type HeaderAction = {
|
|
154
|
+
key: string;
|
|
155
|
+
label: React.ReactNode;
|
|
156
|
+
variant?: ButtonVariant;
|
|
157
|
+
icon?: React.ReactNode;
|
|
158
|
+
onClick?: () => void;
|
|
159
|
+
href?: string;
|
|
160
|
+
disabled?: boolean;
|
|
161
|
+
danger?: boolean;
|
|
162
|
+
};
|
|
163
|
+
interface HeaderProps {
|
|
164
|
+
/** Page title on the left of the bar. */
|
|
165
|
+
title?: React.ReactNode;
|
|
166
|
+
/** Supporting text under the title. `description` is preferred. */
|
|
167
|
+
description?: React.ReactNode;
|
|
168
|
+
/** @deprecated Use `description`. */
|
|
169
|
+
subtitle?: React.ReactNode;
|
|
170
|
+
breadcrumbs?: HeaderBreadcrumb[];
|
|
171
|
+
/** Primary CTAs, rendered on the top-right of the bar. */
|
|
172
|
+
actions?: HeaderAction[];
|
|
173
|
+
/** Extra nodes after the CTA buttons (filters, custom controls). */
|
|
174
|
+
extra?: React.ReactNode;
|
|
175
|
+
/** Slot before the title — typically a mobile menu button. */
|
|
176
|
+
leading?: React.ReactNode;
|
|
177
|
+
user?: HeaderUser | null;
|
|
178
|
+
userMenu?: MenuProps;
|
|
179
|
+
onLogout?: () => void;
|
|
180
|
+
sticky?: boolean;
|
|
181
|
+
className?: string;
|
|
182
|
+
style?: React.CSSProperties;
|
|
183
|
+
}
|
|
184
|
+
declare const Header: React.ForwardRefExoticComponent<HeaderProps & React.RefAttributes<HTMLElement>>;
|
|
185
|
+
|
|
186
|
+
declare const indusActionLogo: string;
|
|
187
|
+
|
|
188
|
+
type SideNavItem = NonNullable<NonNullable<MenuProps["items"]>[number]>;
|
|
189
|
+
interface SideNavUser {
|
|
190
|
+
name: string;
|
|
191
|
+
role?: string;
|
|
192
|
+
avatarSrc?: string;
|
|
193
|
+
}
|
|
194
|
+
interface SideNavProps extends Omit<SiderProps, "children" | "breakpoint"> {
|
|
195
|
+
items?: MenuProps["items"];
|
|
196
|
+
menu?: Omit<MenuProps, "items" | "mode">;
|
|
197
|
+
user?: SideNavUser | null;
|
|
198
|
+
onLogout?: () => void;
|
|
199
|
+
logoutLabel?: string;
|
|
200
|
+
logoSrc?: string;
|
|
201
|
+
logoAlt?: string;
|
|
202
|
+
logo?: ReactNode;
|
|
203
|
+
/**
|
|
204
|
+
* Below this breakpoint the sider becomes a drawer (phone layout).
|
|
205
|
+
* Set `false` to always keep the desktop sider.
|
|
206
|
+
* @default "md"
|
|
207
|
+
*/
|
|
208
|
+
breakpoint?: SiderProps["breakpoint"] | false;
|
|
209
|
+
/**
|
|
210
|
+
* When false, skip the fixed mobile logo bar. Use when a parent header
|
|
211
|
+
* already provides a menu trigger (for example AppShell).
|
|
212
|
+
* @default true
|
|
213
|
+
*/
|
|
214
|
+
showMobileBar?: boolean;
|
|
215
|
+
/** Replace or hide (`null`) the default mobile menu button. */
|
|
216
|
+
mobileTrigger?: ReactNode | null;
|
|
217
|
+
mobileOpen?: boolean;
|
|
218
|
+
onMobileOpenChange?: (open: boolean) => void;
|
|
219
|
+
}
|
|
220
|
+
declare function SideNav({ items, menu, user, onLogout, logoutLabel, logoSrc, logoAlt, logo, width, theme, collapsed: collapsedProp, defaultCollapsed, onCollapse, collapsible, trigger, style, breakpoint, showMobileBar, mobileTrigger, mobileOpen: mobileOpenProp, onMobileOpenChange, ...siderProps }: SideNavProps): React.JSX.Element;
|
|
221
|
+
declare namespace SideNav {
|
|
222
|
+
var displayName: string;
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
type StatusPageStatus = NonNullable<ResultProps["status"]>;
|
|
226
|
+
interface StatusPageProps {
|
|
227
|
+
status: StatusPageStatus;
|
|
228
|
+
title?: React.ReactNode;
|
|
229
|
+
subTitle?: React.ReactNode;
|
|
230
|
+
actionLabel?: string;
|
|
231
|
+
/** Click handler for the default action button. */
|
|
232
|
+
onAction?: () => void;
|
|
233
|
+
/** If set, the default action button renders as a link. */
|
|
234
|
+
actionHref?: string;
|
|
235
|
+
/** Replaces the default action button. */
|
|
236
|
+
extra?: React.ReactNode;
|
|
237
|
+
/** Fill the viewport and center the result. Default: true. */
|
|
238
|
+
fullPage?: boolean;
|
|
239
|
+
className?: string;
|
|
240
|
+
style?: React.CSSProperties;
|
|
241
|
+
}
|
|
242
|
+
declare function StatusPage({ status, title, subTitle, actionLabel, onAction, actionHref, extra, fullPage, className, style, }: StatusPageProps): React.JSX.Element;
|
|
243
|
+
declare namespace StatusPage {
|
|
244
|
+
var displayName: string;
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
type NotFoundPageProps = Omit<StatusPageProps, "status">;
|
|
248
|
+
declare function NotFoundPage({ title, subTitle, actionLabel, actionHref, onAction, extra, ...rest }: NotFoundPageProps): React.JSX.Element;
|
|
249
|
+
declare namespace NotFoundPage {
|
|
250
|
+
var displayName: string;
|
|
251
|
+
}
|
|
252
|
+
|
|
253
|
+
type UnauthorizedPageProps = Omit<StatusPageProps, "status">;
|
|
254
|
+
declare function UnauthorizedPage({ title, subTitle, actionLabel, actionHref, onAction, extra, ...rest }: UnauthorizedPageProps): React.JSX.Element;
|
|
255
|
+
declare namespace UnauthorizedPage {
|
|
256
|
+
var displayName: string;
|
|
257
|
+
}
|
|
258
|
+
|
|
13
259
|
declare const colors: {
|
|
14
260
|
readonly brand: {
|
|
15
261
|
readonly primary: "#596993";
|
|
16
262
|
readonly primaryHover: "#6B7BA5";
|
|
17
263
|
readonly primaryActive: "#4A587C";
|
|
18
264
|
readonly primaryLight: "#E8EBF2";
|
|
265
|
+
readonly accent: "#F69120";
|
|
19
266
|
};
|
|
20
267
|
readonly neutral: {
|
|
21
268
|
readonly white: "#FFFFFF";
|
|
@@ -38,13 +285,58 @@ declare const colors: {
|
|
|
38
285
|
readonly info: "#596993";
|
|
39
286
|
};
|
|
40
287
|
};
|
|
288
|
+
declare const spacing: {
|
|
289
|
+
readonly none: 0;
|
|
290
|
+
readonly xxs: 4;
|
|
291
|
+
readonly xs: 8;
|
|
292
|
+
readonly sm: 12;
|
|
293
|
+
readonly md: 16;
|
|
294
|
+
readonly lg: 24;
|
|
295
|
+
readonly xl: 32;
|
|
296
|
+
readonly xxl: 48;
|
|
297
|
+
};
|
|
298
|
+
declare const fontSize: {
|
|
299
|
+
readonly xxs: 11;
|
|
300
|
+
readonly xs: 12;
|
|
301
|
+
readonly sm: 14;
|
|
302
|
+
readonly md: 16;
|
|
303
|
+
readonly lg: 20;
|
|
304
|
+
readonly xl: 24;
|
|
305
|
+
readonly xxl: 30;
|
|
306
|
+
};
|
|
307
|
+
/** Viewport min-widths. Matches Ant Design's `Grid` / `Sider` breakpoint names. */
|
|
308
|
+
declare const breakpoints: {
|
|
309
|
+
readonly xs: 480;
|
|
310
|
+
readonly sm: 576;
|
|
311
|
+
readonly md: 768;
|
|
312
|
+
readonly lg: 992;
|
|
313
|
+
readonly xl: 1200;
|
|
314
|
+
readonly xxl: 1600;
|
|
315
|
+
};
|
|
41
316
|
type Colors = typeof colors;
|
|
42
|
-
|
|
317
|
+
type Spacing = typeof spacing;
|
|
318
|
+
type FontSize = typeof fontSize;
|
|
319
|
+
type Breakpoints = typeof breakpoints;
|
|
320
|
+
/**
|
|
321
|
+
* Seed + map tokens only. Ant Design's algorithm applies these to Button,
|
|
322
|
+
* Menu, Layout, and every other component — no per-component lists.
|
|
323
|
+
*/
|
|
43
324
|
declare const theme: ThemeConfig;
|
|
44
|
-
|
|
45
325
|
interface ThemeProviderProps {
|
|
46
326
|
children: React.ReactNode;
|
|
47
327
|
}
|
|
48
|
-
declare function ThemeProvider({ children }: ThemeProviderProps): React.
|
|
328
|
+
declare function ThemeProvider({ children }: ThemeProviderProps): React.FunctionComponentElement<antd.ConfigProviderProps>;
|
|
329
|
+
|
|
330
|
+
type IconProps = {
|
|
331
|
+
size?: number;
|
|
332
|
+
className?: string;
|
|
333
|
+
style?: React.CSSProperties;
|
|
334
|
+
};
|
|
335
|
+
declare function LogoutIcon({ size, className, style }: IconProps): React.JSX.Element;
|
|
336
|
+
declare function CollapseIcon({ collapsed, size, className, style, }: IconProps & {
|
|
337
|
+
collapsed?: boolean;
|
|
338
|
+
}): React.JSX.Element;
|
|
339
|
+
declare function MenuIcon({ size, className, style }: IconProps): React.JSX.Element;
|
|
340
|
+
declare function CloseIcon({ size, className, style }: IconProps): React.JSX.Element;
|
|
49
341
|
|
|
50
|
-
export { Button, type ButtonProps, type ButtonSize, type ButtonVariant, type Colors, ThemeProvider, type ThemeProviderProps, colors, theme };
|
|
342
|
+
export { type Breakpoints, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, CloseIcon, CollapseIcon, type Colors, type DetailsSkeletonProps, Dropdown, type DropdownButtonProps, type DropdownInterface, type DropdownProps, type FontSize, Header, type HeaderAction, type HeaderBreadcrumb, type HeaderProps, type HeaderUser, Link, type LinkProps, LogoutIcon, MenuIcon, Modal, type ModalInterface, type ModalProps, NotFoundPage, type NotFoundPageProps, SideNav, type SideNavItem, type SideNavProps, type SideNavUser, Skeleton, type SkeletonInterface, type SkeletonProps, type Spacing, StatusPage, type StatusPageProps, type StatusPageStatus, Table, type TableColumnGroupType, type TableColumnType, type TableColumnsType, type TableMode, type TableProps, type TableQuery, type TableSearchConfig, type TableSortOrder, Tabs, type TabsProps, Tag, type TagProps, ThemeProvider, type ThemeProviderProps, UnauthorizedPage, type UnauthorizedPageProps, breakpoints, colors, fontSize, indusActionLogo, spacing, theme };
|