@attrus-ds/core 0.2.0 → 0.3.1
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/LICENSE +27 -27
- package/dist/assets/flags/Brazil-rounded.svg +15 -15
- package/dist/assets/flags/Brazil-square.svg +16 -16
- package/dist/assets/flags/Chile-rounded.svg +10 -10
- package/dist/assets/flags/Chile-square.svg +10 -10
- package/dist/assets/flags/Colombia-rounded.svg +9 -9
- package/dist/assets/flags/Colombia-square.svg +9 -9
- package/dist/assets/flags/EUA-rounded.svg +10 -10
- package/dist/assets/flags/EUA-square.svg +10 -10
- package/dist/assets/flags/EUR-rounded.svg +8 -8
- package/dist/assets/flags/EUR-square.svg +8 -8
- package/dist/assets/flags/Mexico-rounded.svg +18 -18
- package/dist/assets/flags/Mexico-square.svg +18 -18
- package/dist/assets/icon-attrus-dark.svg +2 -2
- package/dist/assets/icon-attrus-light.svg +2 -2
- package/dist/assets/logo-attrus-dark.svg +7 -7
- package/dist/assets/logo-attrus-light.svg +7 -7
- package/dist/css/components/buttons.css +301 -301
- package/dist/css/components/callout.css +195 -195
- package/dist/css/components/cards.css +272 -272
- package/dist/css/components/combobox.css +319 -319
- package/dist/css/components/empty-states.css +61 -61
- package/dist/css/components/inputs.css +975 -975
- package/dist/css/components/number-input.css +138 -138
- package/dist/css/components/overlays.css +374 -374
- package/dist/css/components/primitives.css +314 -314
- package/dist/css/components/sidebar.css +179 -179
- package/dist/css/components/smart-search.css +91 -91
- package/dist/css/components/status-pills.css +207 -207
- package/dist/css/components/stepper.css +309 -309
- package/dist/css/components/table.css +602 -602
- package/dist/css/components/tabs.css +319 -319
- package/dist/css/components/toast.css +243 -243
- package/dist/css/components/tooltip.css +231 -231
- package/dist/css/components/topbar.css +148 -148
- package/dist/css/tokens.css +666 -666
- package/dist/react/AppSidebar/AppSidebar.d.ts +50 -50
- package/dist/react/AppSidebar/AppSidebar.tsx +197 -197
- package/dist/react/AppTopbar/AppTopbar.d.ts +58 -58
- package/dist/react/AppTopbar/AppTopbar.tsx +203 -203
- package/dist/react/Atoms/Atoms.d.ts +149 -149
- package/dist/react/Atoms/Atoms.tsx +407 -407
- package/dist/react/Button/Button.d.ts +25 -25
- package/dist/react/Button/Button.tsx +83 -83
- package/dist/react/Callout/Callout.d.ts +29 -29
- package/dist/react/Callout/Callout.tsx +98 -98
- package/dist/react/Card/Card.d.ts +38 -38
- package/dist/react/Card/Card.tsx +93 -93
- package/dist/react/Combobox/Combobox.d.ts +52 -52
- package/dist/react/Combobox/Combobox.tsx +254 -254
- package/dist/react/DataTable/DataTable.d.ts +81 -81
- package/dist/react/DataTable/DataTable.tsx +308 -308
- package/dist/react/Drawer/Drawer.d.ts +35 -35
- package/dist/react/Drawer/Drawer.tsx +226 -226
- package/dist/react/Input/Input.d.ts +155 -155
- package/dist/react/Input/Input.tsx +478 -478
- package/dist/react/Modal/Modal.d.ts +27 -27
- package/dist/react/Modal/Modal.tsx +173 -173
- package/dist/react/NumberInput/NumberInput.d.ts +25 -25
- package/dist/react/NumberInput/NumberInput.tsx +117 -117
- package/dist/react/Pill/Pill.d.ts +31 -31
- package/dist/react/Pill/Pill.tsx +104 -104
- package/dist/react/SearchPill/SearchPill.d.ts +14 -14
- package/dist/react/SearchPill/SearchPill.tsx +40 -40
- package/dist/react/SmartSearch/SmartSearch.d.ts +65 -65
- package/dist/react/SmartSearch/SmartSearch.tsx +271 -271
- package/dist/react/Stepper/Stepper.d.ts +25 -25
- package/dist/react/Stepper/Stepper.tsx +94 -94
- package/dist/react/Tabs/Tabs.d.ts +32 -32
- package/dist/react/Tabs/Tabs.tsx +147 -147
- package/dist/react/Toast/Toast.d.ts +30 -30
- package/dist/react/Toast/Toast.tsx +94 -94
- package/dist/react/Tooltip/Tooltip.d.ts +23 -23
- package/dist/react/Tooltip/Tooltip.tsx +80 -80
- package/dist/react/ZeroState/ZeroState.d.ts +17 -17
- package/dist/react/ZeroState/ZeroState.tsx +45 -45
- package/dist/react/index.ts +35 -35
- package/dist/tokens/attrus-tokens.flat.json +1234 -1234
- package/dist/tokens/attrus-tokens.json +1089 -1089
- package/package.json +64 -64
|
@@ -1,81 +1,81 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
export type SortDir = 'asc' | 'desc';
|
|
4
|
-
export type DataTableSize = 'sm' | 'md' | 'lg';
|
|
5
|
-
export type RowState = 'muted' | 'error' | undefined;
|
|
6
|
-
|
|
7
|
-
export interface DataTableColumn<T> {
|
|
8
|
-
/** Unique column id — also what onSort receives. */
|
|
9
|
-
key: string;
|
|
10
|
-
/** Column header. Strings also become the responsive data-label. */
|
|
11
|
-
header: React.ReactNode;
|
|
12
|
-
/** Right-aligned tabular numerals (.dt-num). */
|
|
13
|
-
numeric?: boolean;
|
|
14
|
-
/** Monospace identifier (.dt-id). */
|
|
15
|
-
id?: boolean;
|
|
16
|
-
/** Sortable header (.dt-th-sort with chevron). */
|
|
17
|
-
sortable?: boolean;
|
|
18
|
-
/** Cell renderer — defaults to String(row[key]). */
|
|
19
|
-
render?: (row: T) => React.ReactNode;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
export interface DataTableProps<T> {
|
|
23
|
-
columns: Array<DataTableColumn<T>>;
|
|
24
|
-
rows: T[];
|
|
25
|
-
/** Stable row identity. */
|
|
26
|
-
rowKey: (row: T) => string;
|
|
27
|
-
/** Makes rows hoverable + clickable (tr.hov). */
|
|
28
|
-
onRowClick?: (row: T) => void;
|
|
29
|
-
/** Row tint: 'muted' (cancelled) or 'error' (danger). */
|
|
30
|
-
rowState?: (row: T) => RowState;
|
|
31
|
-
/** Keys of persistently selected rows (.is-selected). */
|
|
32
|
-
selectedKeys?: string[];
|
|
33
|
-
/** Renders the `.col-select` checkbox column; called with the row key. Pair with selectedKeys. */
|
|
34
|
-
onSelectToggle?: (key: string) => void;
|
|
35
|
-
/** Header checkbox — toggle all. */
|
|
36
|
-
onSelectAll?: () => void;
|
|
37
|
-
/** Loading state — `.dt-skeleton` shimmer rows instead of the body. */
|
|
38
|
-
loading?: boolean;
|
|
39
|
-
/** How many skeleton rows. Default 4. */
|
|
40
|
-
loadingRows?: number;
|
|
41
|
-
/** sm | md (default) | lg — .dt--sm / .dt--lg. */
|
|
42
|
-
size?: DataTableSize;
|
|
43
|
-
zebra?: boolean;
|
|
44
|
-
sticky?: boolean;
|
|
45
|
-
bordered?: boolean;
|
|
46
|
-
/** Dark-surface treatment (.dt.on-inverse). */
|
|
47
|
-
onInverse?: boolean;
|
|
48
|
-
/** Toolbar slot (.dt-toolbar) above the table. */
|
|
49
|
-
toolbar?: React.ReactNode;
|
|
50
|
-
/** Pagination slot (.dt-pagination) below the table. */
|
|
51
|
-
pagination?: React.ReactNode;
|
|
52
|
-
/** Surrounding card (.dt-wrap). Default true; disable inside a Card. */
|
|
53
|
-
wrap?: boolean;
|
|
54
|
-
/** Responsive card-collapse wrapper (.dt-responsive). Default true. */
|
|
55
|
-
responsive?: boolean;
|
|
56
|
-
/** Zero state when rows is empty. */
|
|
57
|
-
empty?: { icon?: React.ReactNode; title: React.ReactNode; sub?: React.ReactNode };
|
|
58
|
-
/** Controlled sorting (visual). */
|
|
59
|
-
sortKey?: string;
|
|
60
|
-
sortDir?: SortDir;
|
|
61
|
-
onSort?: (key: string) => void;
|
|
62
|
-
className?: string;
|
|
63
|
-
style?: React.CSSProperties;
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
export declare function DataTable<T>(props: DataTableProps<T>): React.ReactElement;
|
|
67
|
-
export declare const DTCellStack: React.FC<{ pri: React.ReactNode; sec?: React.ReactNode } & React.HTMLAttributes<HTMLDivElement>>;
|
|
68
|
-
export declare const DTCellLead: React.FC<{ lead: React.ReactNode; pri: React.ReactNode; sec?: React.ReactNode } & React.HTMLAttributes<HTMLDivElement>>;
|
|
69
|
-
export declare const DTActions: React.FC<React.HTMLAttributes<HTMLDivElement>>;
|
|
70
|
-
|
|
71
|
-
export interface DTPaginationProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
72
|
-
/** Left-side mono range text (e.g. "1–10 of 42"). */
|
|
73
|
-
range?: React.ReactNode;
|
|
74
|
-
/** Current page (1-based). */
|
|
75
|
-
page: number;
|
|
76
|
-
pages: number;
|
|
77
|
-
onPage?: (page: number) => void;
|
|
78
|
-
}
|
|
79
|
-
export declare const DTPagination: React.FC<DTPaginationProps>;
|
|
80
|
-
|
|
81
|
-
export default DataTable;
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
export type SortDir = 'asc' | 'desc';
|
|
4
|
+
export type DataTableSize = 'sm' | 'md' | 'lg';
|
|
5
|
+
export type RowState = 'muted' | 'error' | undefined;
|
|
6
|
+
|
|
7
|
+
export interface DataTableColumn<T> {
|
|
8
|
+
/** Unique column id — also what onSort receives. */
|
|
9
|
+
key: string;
|
|
10
|
+
/** Column header. Strings also become the responsive data-label. */
|
|
11
|
+
header: React.ReactNode;
|
|
12
|
+
/** Right-aligned tabular numerals (.dt-num). */
|
|
13
|
+
numeric?: boolean;
|
|
14
|
+
/** Monospace identifier (.dt-id). */
|
|
15
|
+
id?: boolean;
|
|
16
|
+
/** Sortable header (.dt-th-sort with chevron). */
|
|
17
|
+
sortable?: boolean;
|
|
18
|
+
/** Cell renderer — defaults to String(row[key]). */
|
|
19
|
+
render?: (row: T) => React.ReactNode;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export interface DataTableProps<T> {
|
|
23
|
+
columns: Array<DataTableColumn<T>>;
|
|
24
|
+
rows: T[];
|
|
25
|
+
/** Stable row identity. */
|
|
26
|
+
rowKey: (row: T) => string;
|
|
27
|
+
/** Makes rows hoverable + clickable (tr.hov). */
|
|
28
|
+
onRowClick?: (row: T) => void;
|
|
29
|
+
/** Row tint: 'muted' (cancelled) or 'error' (danger). */
|
|
30
|
+
rowState?: (row: T) => RowState;
|
|
31
|
+
/** Keys of persistently selected rows (.is-selected). */
|
|
32
|
+
selectedKeys?: string[];
|
|
33
|
+
/** Renders the `.col-select` checkbox column; called with the row key. Pair with selectedKeys. */
|
|
34
|
+
onSelectToggle?: (key: string) => void;
|
|
35
|
+
/** Header checkbox — toggle all. */
|
|
36
|
+
onSelectAll?: () => void;
|
|
37
|
+
/** Loading state — `.dt-skeleton` shimmer rows instead of the body. */
|
|
38
|
+
loading?: boolean;
|
|
39
|
+
/** How many skeleton rows. Default 4. */
|
|
40
|
+
loadingRows?: number;
|
|
41
|
+
/** sm | md (default) | lg — .dt--sm / .dt--lg. */
|
|
42
|
+
size?: DataTableSize;
|
|
43
|
+
zebra?: boolean;
|
|
44
|
+
sticky?: boolean;
|
|
45
|
+
bordered?: boolean;
|
|
46
|
+
/** Dark-surface treatment (.dt.on-inverse). */
|
|
47
|
+
onInverse?: boolean;
|
|
48
|
+
/** Toolbar slot (.dt-toolbar) above the table. */
|
|
49
|
+
toolbar?: React.ReactNode;
|
|
50
|
+
/** Pagination slot (.dt-pagination) below the table. */
|
|
51
|
+
pagination?: React.ReactNode;
|
|
52
|
+
/** Surrounding card (.dt-wrap). Default true; disable inside a Card. */
|
|
53
|
+
wrap?: boolean;
|
|
54
|
+
/** Responsive card-collapse wrapper (.dt-responsive). Default true. */
|
|
55
|
+
responsive?: boolean;
|
|
56
|
+
/** Zero state when rows is empty. */
|
|
57
|
+
empty?: { icon?: React.ReactNode; title: React.ReactNode; sub?: React.ReactNode };
|
|
58
|
+
/** Controlled sorting (visual). */
|
|
59
|
+
sortKey?: string;
|
|
60
|
+
sortDir?: SortDir;
|
|
61
|
+
onSort?: (key: string) => void;
|
|
62
|
+
className?: string;
|
|
63
|
+
style?: React.CSSProperties;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
export declare function DataTable<T>(props: DataTableProps<T>): React.ReactElement;
|
|
67
|
+
export declare const DTCellStack: React.FC<{ pri: React.ReactNode; sec?: React.ReactNode } & React.HTMLAttributes<HTMLDivElement>>;
|
|
68
|
+
export declare const DTCellLead: React.FC<{ lead: React.ReactNode; pri: React.ReactNode; sec?: React.ReactNode } & React.HTMLAttributes<HTMLDivElement>>;
|
|
69
|
+
export declare const DTActions: React.FC<React.HTMLAttributes<HTMLDivElement>>;
|
|
70
|
+
|
|
71
|
+
export interface DTPaginationProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
72
|
+
/** Left-side mono range text (e.g. "1–10 of 42"). */
|
|
73
|
+
range?: React.ReactNode;
|
|
74
|
+
/** Current page (1-based). */
|
|
75
|
+
page: number;
|
|
76
|
+
pages: number;
|
|
77
|
+
onPage?: (page: number) => void;
|
|
78
|
+
}
|
|
79
|
+
export declare const DTPagination: React.FC<DTPaginationProps>;
|
|
80
|
+
|
|
81
|
+
export default DataTable;
|