1mpacto-react-ui 1.0.0 → 1.0.2
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/assets/_mixins.scss +43 -43
- package/dist/assets/core.css +1 -1
- package/dist/assets/fontfamily.css +1 -1
- package/dist/assets/icons/arrow-narrow-down.svg +3 -3
- package/dist/index.cjs +65 -65
- package/dist/index.mjs +2104 -2091
- package/dist/package.json.d.ts +131 -131
- package/dist/src/components/Table/Table.d.ts +1 -1
- package/dist/src/components/Table/Table.stories.d.ts +16 -2
- package/dist/src/hooks/useAsyncDebounce.d.ts +9 -0
- package/dist/src/hooks/useCombinedResizeObserver.d.ts +66 -0
- package/dist/src/hooks/useCountdown.d.ts +61 -0
- package/dist/src/hooks/useDeepCompareEffect.d.ts +13 -0
- package/dist/src/hooks/useElementOrWindowMediaQuery.d.ts +9 -0
- package/dist/src/hooks/useEventListener.d.ts +27 -0
- package/dist/src/hooks/useMasonry.d.ts +79 -0
- package/dist/src/hooks/useMergeRefs.d.ts +26 -0
- package/dist/src/hooks/useOtpInput.d.ts +157 -0
- package/dist/src/hooks/useStateRef.d.ts +8 -0
- package/dist/src/interfaces/components/Alert/index.d.ts +9 -1
- package/dist/src/interfaces/components/Badges/index.d.ts +28 -0
- package/dist/src/interfaces/components/Breadcrumbs/index.d.ts +79 -0
- package/dist/src/interfaces/components/Button/index.d.ts +44 -0
- package/dist/src/interfaces/components/ButtonIcon/index.d.ts +36 -0
- package/dist/src/interfaces/components/ButtonPopover/index.d.ts +78 -0
- package/dist/src/interfaces/components/Calendar/index.d.ts +364 -0
- package/dist/src/interfaces/components/Chart/index.d.ts +460 -0
- package/dist/src/interfaces/components/Checkbox/index.d.ts +12 -0
- package/dist/src/interfaces/components/Chips/index.d.ts +36 -0
- package/dist/src/interfaces/components/Collapse/index.d.ts +60 -0
- package/dist/src/interfaces/components/DatePicker/index.d.ts +274 -0
- package/dist/src/interfaces/components/ErrorMessage/index.d.ts +16 -0
- package/dist/src/interfaces/components/FilterContainer/index.d.ts +102 -0
- package/dist/src/interfaces/components/Input/index.d.ts +180 -0
- package/dist/src/interfaces/components/Modal/index.d.ts +45 -0
- package/dist/src/interfaces/components/NumberFormat/index.d.ts +25 -0
- package/dist/src/interfaces/components/Pagination/index.d.ts +81 -0
- package/dist/src/interfaces/components/Popover/index.d.ts +95 -0
- package/dist/src/interfaces/components/RadioCheckbox/RadioCheckbox.d.ts +56 -0
- package/dist/src/interfaces/components/RadioCheckbox/RadioCheckboxLabel.d.ts +44 -0
- package/dist/src/interfaces/components/SelectDropdownContainer/index.d.ts +195 -1
- package/dist/src/interfaces/components/Sidebar/index.d.ts +226 -0
- package/dist/src/interfaces/components/Step/index.d.ts +153 -0
- package/dist/src/interfaces/components/Switch/index.d.ts +53 -0
- package/dist/src/interfaces/components/Table/index.d.ts +386 -1
- package/dist/src/interfaces/components/Tabs/index.d.ts +126 -0
- package/dist/src/interfaces/components/TextEditor/index.d.ts +12 -0
- package/dist/src/interfaces/components/Textarea/index.d.ts +156 -0
- package/dist/src/interfaces/components/TimeRange/index.d.ts +100 -0
- package/dist/src/interfaces/components/Timeline/index.d.ts +36 -0
- package/dist/src/interfaces/components/Tooltip/index.d.ts +56 -0
- package/dist/src/interfaces/components/TruncateComponent/index.d.ts +34 -0
- package/dist/src/interfaces/components/UploadFile/index.d.ts +184 -1
- package/dist/src/interfaces/components/Virtualization/ListVirtualization.d.ts +138 -0
- package/dist/src/interfaces/components/Virtualization/TableVirtualization.d.ts +143 -0
- package/dist/tinymce/CHANGELOG.md +3785 -3785
- package/dist/tinymce/js/tinymce/langs/README.md +3 -3
- package/dist/tinymce/js/tinymce/license.md +6 -6
- package/dist/tinymce/js/tinymce/notices.txt +21 -21
- package/dist/tinymce/js/tinymce/plugins/codesample/plugin.min.js +8 -8
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/ar.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/bg_BG.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/ca.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/cs.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/da.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/de.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/el.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/en.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/es.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/eu.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/fa.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/fi.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/fr_FR.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/he_IL.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/hi.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/hr.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/hu_HU.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/id.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/it.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/ja.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/kk.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/ko_KR.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/ms.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/nb_NO.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/nl.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/pl.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/pt_BR.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/pt_PT.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/ro.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/ru.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/sk.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/sl_SI.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/sv_SE.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/th_TH.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/tr.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/uk.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/vi.js +92 -92
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/zh_CN.js +86 -86
- package/dist/tinymce/js/tinymce/plugins/help/js/i18n/keynav/zh_TW.js +92 -92
- package/dist/tinymce/js/tinymce/skins/content/dark/content.js +9 -9
- package/dist/tinymce/js/tinymce/skins/content/dark/content.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/content/default/content.js +9 -9
- package/dist/tinymce/js/tinymce/skins/content/default/content.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/content/document/content.js +9 -9
- package/dist/tinymce/js/tinymce/skins/content/document/content.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/content/tinymce-5/content.js +9 -9
- package/dist/tinymce/js/tinymce/skins/content/tinymce-5/content.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/content/tinymce-5-dark/content.js +9 -9
- package/dist/tinymce/js/tinymce/skins/content/tinymce-5-dark/content.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/content/writer/content.js +9 -9
- package/dist/tinymce/js/tinymce/skins/content/writer/content.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/ui/oxide/content.inline.js +9 -9
- package/dist/tinymce/js/tinymce/skins/ui/oxide/content.inline.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/ui/oxide/content.js +9 -9
- package/dist/tinymce/js/tinymce/skins/ui/oxide/content.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/ui/oxide/skin.min.css +1 -1
- package/dist/tinymce/js/tinymce/skins/ui/oxide/skin.shadowdom.min.css +1 -1
- package/dist/tinymce/js/tinymce/skins/ui/oxide-dark/content.inline.js +9 -9
- package/dist/tinymce/js/tinymce/skins/ui/oxide-dark/content.inline.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/ui/oxide-dark/content.js +9 -9
- package/dist/tinymce/js/tinymce/skins/ui/oxide-dark/content.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/ui/oxide-dark/skin.min.css +1 -1
- package/dist/tinymce/js/tinymce/skins/ui/oxide-dark/skin.shadowdom.min.css +1 -1
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5/content.inline.js +9 -9
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5/content.inline.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5/content.js +9 -9
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5/content.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5/skin.min.css +1 -1
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5/skin.shadowdom.min.css +1 -1
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5-dark/content.inline.js +9 -9
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5-dark/content.inline.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5-dark/content.js +9 -9
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5-dark/content.min.css +10 -10
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5-dark/skin.min.css +1 -1
- package/dist/tinymce/js/tinymce/skins/ui/tinymce-5-dark/skin.shadowdom.min.css +1 -1
- package/dist/tinymce/js/tinymce/tinymce.d.ts +3350 -3350
- package/dist/tinymce/js/tinymce/tinymce.min.js +10 -10
- package/dist/types-external/table.d.ts +15 -15
- package/package.json +131 -131
|
@@ -1,69 +1,285 @@
|
|
|
1
1
|
import { ChartArea, ChartData, ChartDataset, ChartOptions, CoreScaleOptions, Scale, TooltipItem } from 'chart.js';
|
|
2
2
|
import { default as React } from 'react';
|
|
3
3
|
|
|
4
|
+
/**
|
|
5
|
+
* [ID] : Opsi untuk grafik donat.
|
|
6
|
+
* [EN] : Options for doughnut chart.
|
|
7
|
+
*/
|
|
4
8
|
export type TOptionsDoughnutChart = ChartOptions<'doughnut'>;
|
|
9
|
+
/**
|
|
10
|
+
* [ID] : Interface untuk data grafik donat.
|
|
11
|
+
* [EN] : Interface for doughnut chart data.
|
|
12
|
+
*/
|
|
5
13
|
export interface IDataDoughnutChart {
|
|
14
|
+
/**
|
|
15
|
+
* [ID] : Properti dinamis lainnya.
|
|
16
|
+
* [EN] : Other dynamic properties.
|
|
17
|
+
*/
|
|
6
18
|
[key: string]: unknown;
|
|
19
|
+
/**
|
|
20
|
+
* [ID] : Nilai data.
|
|
21
|
+
* [EN] : Data value.
|
|
22
|
+
*/
|
|
7
23
|
value: string | number;
|
|
24
|
+
/**
|
|
25
|
+
* [ID] : Judul data.
|
|
26
|
+
* [EN] : Data title.
|
|
27
|
+
*/
|
|
8
28
|
title: string;
|
|
29
|
+
/**
|
|
30
|
+
* [ID] : Nilai asli (opsional).
|
|
31
|
+
* [EN] : Original value (optional).
|
|
32
|
+
*/
|
|
9
33
|
originalValue?: string | number;
|
|
34
|
+
/**
|
|
35
|
+
* [ID] : Warna latar belakang (opsional).
|
|
36
|
+
* [EN] : Background color (optional).
|
|
37
|
+
*/
|
|
10
38
|
backgroundColor?: string;
|
|
11
39
|
}
|
|
40
|
+
/**
|
|
41
|
+
* [ID] : Interface untuk label dalam grafik donat.
|
|
42
|
+
* [EN] : Interface for inner label of doughnut chart.
|
|
43
|
+
*/
|
|
12
44
|
export interface IDataInnerLabelDoughnutChart {
|
|
45
|
+
/**
|
|
46
|
+
* [ID] : ID label.
|
|
47
|
+
* [EN] : Label ID.
|
|
48
|
+
*/
|
|
13
49
|
id: string;
|
|
50
|
+
/**
|
|
51
|
+
* [ID] : Teks label.
|
|
52
|
+
* [EN] : Label text.
|
|
53
|
+
*/
|
|
14
54
|
text: string;
|
|
55
|
+
/**
|
|
56
|
+
* [ID] : Konfigurasi font (opsional).
|
|
57
|
+
* [EN] : Font configuration (optional).
|
|
58
|
+
*/
|
|
15
59
|
font?: {
|
|
60
|
+
/**
|
|
61
|
+
* [ID] : Ukuran font.
|
|
62
|
+
* [EN] : Font size.
|
|
63
|
+
*/
|
|
16
64
|
size: number;
|
|
65
|
+
/**
|
|
66
|
+
* [ID] : Tinggi baris.
|
|
67
|
+
* [EN] : Line height.
|
|
68
|
+
*/
|
|
17
69
|
lineHeight: number;
|
|
18
70
|
};
|
|
71
|
+
/**
|
|
72
|
+
* [ID] : Persentase (opsional).
|
|
73
|
+
* [EN] : Percentage (optional).
|
|
74
|
+
*/
|
|
19
75
|
percentage?: string;
|
|
76
|
+
/**
|
|
77
|
+
* [ID] : Warna teks (opsional).
|
|
78
|
+
* [EN] : Text color (optional).
|
|
79
|
+
*/
|
|
20
80
|
color?: string;
|
|
81
|
+
/**
|
|
82
|
+
* [ID] : URL ikon deskripsi (opsional).
|
|
83
|
+
* [EN] : Description icon URL (optional).
|
|
84
|
+
*/
|
|
21
85
|
urlIconDesc?: string;
|
|
22
86
|
}
|
|
87
|
+
/**
|
|
88
|
+
* [ID] : Interface untuk komponen grafik donat.
|
|
89
|
+
* [EN] : Interface for doughnut chart component.
|
|
90
|
+
*/
|
|
23
91
|
export interface IDoughnutChart {
|
|
92
|
+
/**
|
|
93
|
+
* [ID] : Data grafik.
|
|
94
|
+
* [EN] : Chart data.
|
|
95
|
+
*/
|
|
24
96
|
data: IDataDoughnutChart[];
|
|
97
|
+
/**
|
|
98
|
+
* [ID] : Lebar donat bagian dalam.
|
|
99
|
+
* [EN] : Inner doughnut width.
|
|
100
|
+
*/
|
|
25
101
|
widthInnerDoughnut: number;
|
|
102
|
+
/**
|
|
103
|
+
* [ID] : Label bagian dalam.
|
|
104
|
+
* [EN] : Inner labels.
|
|
105
|
+
*/
|
|
26
106
|
innerLabels: IDataInnerLabelDoughnutChart[];
|
|
107
|
+
/**
|
|
108
|
+
* [ID] : Status terbuka (opsional).
|
|
109
|
+
* [EN] : Open status (optional).
|
|
110
|
+
*/
|
|
27
111
|
open?: boolean;
|
|
112
|
+
/**
|
|
113
|
+
* [ID] : Label-label grafik (opsional).
|
|
114
|
+
* [EN] : Chart labels (optional).
|
|
115
|
+
*/
|
|
28
116
|
labels?: string[];
|
|
117
|
+
/**
|
|
118
|
+
* [ID] : Warna latar belakang (opsional).
|
|
119
|
+
* [EN] : Background colors (optional).
|
|
120
|
+
*/
|
|
29
121
|
backgroundColor?: string[];
|
|
122
|
+
/**
|
|
123
|
+
* [ID] : Opsi grafik (opsional).
|
|
124
|
+
* [EN] : Chart options (optional).
|
|
125
|
+
*/
|
|
30
126
|
options?: TOptionsDoughnutChart;
|
|
127
|
+
/**
|
|
128
|
+
* [ID] : Menggambar ulang grafik (opsional).
|
|
129
|
+
* [EN] : Redraw chart (optional).
|
|
130
|
+
*/
|
|
31
131
|
redraw?: boolean;
|
|
132
|
+
/**
|
|
133
|
+
* [ID] : Kunci untuk label (opsional).
|
|
134
|
+
* [EN] : Key for label (optional).
|
|
135
|
+
*/
|
|
32
136
|
keyLabel?: string;
|
|
137
|
+
/**
|
|
138
|
+
* [ID] : Kunci untuk nilai (opsional).
|
|
139
|
+
* [EN] : Key for value (optional).
|
|
140
|
+
*/
|
|
33
141
|
keyValue?: string;
|
|
142
|
+
/**
|
|
143
|
+
* [ID] : Kunci untuk menghapus data saat terbuka (opsional).
|
|
144
|
+
* [EN] : Key to remove data when open (optional).
|
|
145
|
+
*/
|
|
34
146
|
keyRemoveDataOpen?: string;
|
|
147
|
+
/**
|
|
148
|
+
* [ID] : Kunci untuk latar belakang (opsional).
|
|
149
|
+
* [EN] : Key for background (optional).
|
|
150
|
+
*/
|
|
35
151
|
keyBackground?: string;
|
|
152
|
+
/**
|
|
153
|
+
* [ID] : Nama kelas CSS (opsional).
|
|
154
|
+
* [EN] : CSS class name (optional).
|
|
155
|
+
*/
|
|
36
156
|
className?: string;
|
|
37
157
|
}
|
|
158
|
+
/**
|
|
159
|
+
* [ID] : Interface untuk data grafik garis.
|
|
160
|
+
* [EN] : Interface for line chart data.
|
|
161
|
+
*/
|
|
38
162
|
export interface IDataLineChart {
|
|
163
|
+
/**
|
|
164
|
+
* [ID] : Menandakan data saat ini.
|
|
165
|
+
* [EN] : Indicates current data.
|
|
166
|
+
*/
|
|
39
167
|
isCurrent: boolean;
|
|
168
|
+
/**
|
|
169
|
+
* [ID] : Menandakan data terakhir.
|
|
170
|
+
* [EN] : Indicates last data.
|
|
171
|
+
*/
|
|
40
172
|
isLast: boolean;
|
|
173
|
+
/**
|
|
174
|
+
* [ID] : Label data.
|
|
175
|
+
* [EN] : Data label.
|
|
176
|
+
*/
|
|
41
177
|
label: string;
|
|
178
|
+
/**
|
|
179
|
+
* [ID] : Nilai data (bisa null).
|
|
180
|
+
* [EN] : Data value (can be null).
|
|
181
|
+
*/
|
|
42
182
|
value: number | null;
|
|
183
|
+
/**
|
|
184
|
+
* [ID] : Tahun data.
|
|
185
|
+
* [EN] : Data year.
|
|
186
|
+
*/
|
|
43
187
|
year: number;
|
|
44
188
|
}
|
|
189
|
+
/**
|
|
190
|
+
* [ID] : Interface untuk komponen grafik garis.
|
|
191
|
+
* [EN] : Interface for line chart component.
|
|
192
|
+
*/
|
|
45
193
|
export interface ILineChart {
|
|
194
|
+
/**
|
|
195
|
+
* [ID] : Data grafik.
|
|
196
|
+
* [EN] : Chart data.
|
|
197
|
+
*/
|
|
46
198
|
data: IDataLineChart[];
|
|
199
|
+
/**
|
|
200
|
+
* [ID] : Nama kelas CSS (opsional).
|
|
201
|
+
* [EN] : CSS class name (optional).
|
|
202
|
+
*/
|
|
47
203
|
className?: string;
|
|
204
|
+
/**
|
|
205
|
+
* [ID] : Tinggi grafik (opsional).
|
|
206
|
+
* [EN] : Chart height (optional).
|
|
207
|
+
*/
|
|
48
208
|
height?: number;
|
|
49
209
|
}
|
|
50
210
|
type TGradientLineChartScales = Record<string, Scale<CoreScaleOptions>>;
|
|
51
211
|
type TGradientLineChartGradientFor = 'background' | 'border';
|
|
212
|
+
/**
|
|
213
|
+
* [ID] : Parameter untuk mengatur gradien grafik garis.
|
|
214
|
+
* [EN] : Parameters to set gradient line chart.
|
|
215
|
+
*/
|
|
52
216
|
export interface TSetGradientLineParams {
|
|
217
|
+
/**
|
|
218
|
+
* [ID] : Konteks rendering canvas.
|
|
219
|
+
* [EN] : Canvas rendering context.
|
|
220
|
+
*/
|
|
53
221
|
ctx: CanvasRenderingContext2D;
|
|
222
|
+
/**
|
|
223
|
+
* [ID] : Area grafik.
|
|
224
|
+
* [EN] : Chart area.
|
|
225
|
+
*/
|
|
54
226
|
chartArea: ChartArea;
|
|
227
|
+
/**
|
|
228
|
+
* [ID] : Skala grafik.
|
|
229
|
+
* [EN] : Chart scales.
|
|
230
|
+
*/
|
|
55
231
|
scales: TGradientLineChartScales;
|
|
232
|
+
/**
|
|
233
|
+
* [ID] : Tinggi grafik.
|
|
234
|
+
* [EN] : Chart height.
|
|
235
|
+
*/
|
|
56
236
|
chartHeight: number;
|
|
237
|
+
/**
|
|
238
|
+
* [ID] : Target gradien (background atau border).
|
|
239
|
+
* [EN] : Gradient target (background or border).
|
|
240
|
+
*/
|
|
57
241
|
gradientFor: TGradientLineChartGradientFor;
|
|
242
|
+
/**
|
|
243
|
+
* [ID] : Dataset item.
|
|
244
|
+
* [EN] : Dataset item.
|
|
245
|
+
*/
|
|
58
246
|
item: IGradientLineChartDataSet;
|
|
59
247
|
}
|
|
248
|
+
/**
|
|
249
|
+
* [ID] : Parameter untuk mendapatkan gradien grafik garis.
|
|
250
|
+
* [EN] : Parameters to get gradient line chart.
|
|
251
|
+
*/
|
|
60
252
|
export interface TGetGradientLineParams {
|
|
253
|
+
/**
|
|
254
|
+
* [ID] : Konteks rendering canvas.
|
|
255
|
+
* [EN] : Canvas rendering context.
|
|
256
|
+
*/
|
|
61
257
|
ctx: CanvasRenderingContext2D;
|
|
258
|
+
/**
|
|
259
|
+
* [ID] : Area grafik.
|
|
260
|
+
* [EN] : Chart area.
|
|
261
|
+
*/
|
|
62
262
|
chartArea: ChartArea;
|
|
263
|
+
/**
|
|
264
|
+
* [ID] : Skala grafik.
|
|
265
|
+
* [EN] : Chart scales.
|
|
266
|
+
*/
|
|
63
267
|
scales: TGradientLineChartScales;
|
|
268
|
+
/**
|
|
269
|
+
* [ID] : Target gradien.
|
|
270
|
+
* [EN] : Gradient target.
|
|
271
|
+
*/
|
|
64
272
|
gradientFor: TGradientLineChartGradientFor;
|
|
273
|
+
/**
|
|
274
|
+
* [ID] : Dataset item.
|
|
275
|
+
* [EN] : Dataset item.
|
|
276
|
+
*/
|
|
65
277
|
item: IGradientLineChartDataSet;
|
|
66
278
|
}
|
|
279
|
+
/**
|
|
280
|
+
* [ID] : Tipe komponen tooltip kustom untuk grafik garis gradien.
|
|
281
|
+
* [EN] : Custom tooltip component type for gradient line chart.
|
|
282
|
+
*/
|
|
67
283
|
export type TGradientLineChartCustomTooltip = React.ComponentType<{
|
|
68
284
|
label: string;
|
|
69
285
|
dataset: string;
|
|
@@ -71,49 +287,193 @@ export type TGradientLineChartCustomTooltip = React.ComponentType<{
|
|
|
71
287
|
style: React.CSSProperties;
|
|
72
288
|
dataPoints: TooltipItem<'line'>[];
|
|
73
289
|
}>;
|
|
290
|
+
/**
|
|
291
|
+
* [ID] : Interface untuk dataset grafik garis gradien.
|
|
292
|
+
* [EN] : Interface for gradient line chart dataset.
|
|
293
|
+
*/
|
|
74
294
|
export interface IGradientLineChartDataSet extends ChartDataset<'line'> {
|
|
295
|
+
/**
|
|
296
|
+
* [ID] : Warna background positif nol (opsional).
|
|
297
|
+
* [EN] : Positive zero background color (optional).
|
|
298
|
+
*/
|
|
75
299
|
colorBackgroundPositiveZero?: string;
|
|
300
|
+
/**
|
|
301
|
+
* [ID] : Warna background persentase positif (opsional).
|
|
302
|
+
* [EN] : Positive percentage background color (optional).
|
|
303
|
+
*/
|
|
76
304
|
colorBackgroundPositivePercentage?: string;
|
|
305
|
+
/**
|
|
306
|
+
* [ID] : Warna background negatif satu (opsional).
|
|
307
|
+
* [EN] : Negative one background color (optional).
|
|
308
|
+
*/
|
|
77
309
|
colorBackgroundNegativeOne?: string;
|
|
310
|
+
/**
|
|
311
|
+
* [ID] : Warna background persentase negatif (opsional).
|
|
312
|
+
* [EN] : Negative percentage background color (optional).
|
|
313
|
+
*/
|
|
78
314
|
colorBackgroundNegativePercentage?: string;
|
|
315
|
+
/**
|
|
316
|
+
* [ID] : Warna border positif (opsional).
|
|
317
|
+
* [EN] : Positive border color (optional).
|
|
318
|
+
*/
|
|
79
319
|
colorBorderPositive?: string;
|
|
320
|
+
/**
|
|
321
|
+
* [ID] : Warna border negatif (opsional).
|
|
322
|
+
* [EN] : Negative border color (optional).
|
|
323
|
+
*/
|
|
80
324
|
colorBorderNegative?: string;
|
|
81
325
|
}
|
|
326
|
+
/**
|
|
327
|
+
* [ID] : Interface untuk data grafik garis gradien.
|
|
328
|
+
* [EN] : Interface for gradient line chart data.
|
|
329
|
+
*/
|
|
82
330
|
export interface IGradientLineChartData extends Omit<ChartData<'line'>, 'datasets'> {
|
|
331
|
+
/**
|
|
332
|
+
* [ID] : Kumpulan dataset.
|
|
333
|
+
* [EN] : Collection of datasets.
|
|
334
|
+
*/
|
|
83
335
|
datasets: IGradientLineChartDataSet[];
|
|
84
336
|
}
|
|
337
|
+
/**
|
|
338
|
+
* [ID] : Interface untuk komponen grafik garis gradien.
|
|
339
|
+
* [EN] : Interface for gradient line chart component.
|
|
340
|
+
*/
|
|
85
341
|
export interface IGradientLineChart {
|
|
342
|
+
/**
|
|
343
|
+
* [ID] : Data grafik.
|
|
344
|
+
* [EN] : Chart data.
|
|
345
|
+
*/
|
|
86
346
|
data: IGradientLineChartData;
|
|
347
|
+
/**
|
|
348
|
+
* [ID] : Opsi grafik (opsional).
|
|
349
|
+
* [EN] : Chart options (optional).
|
|
350
|
+
*/
|
|
87
351
|
options?: ChartOptions<'line'>;
|
|
352
|
+
/**
|
|
353
|
+
* [ID] : ID grafik.
|
|
354
|
+
* [EN] : Chart ID.
|
|
355
|
+
*/
|
|
88
356
|
id: string;
|
|
357
|
+
/**
|
|
358
|
+
* [ID] : Nama kelas CSS kontainer (opsional).
|
|
359
|
+
* [EN] : Container CSS class name (optional).
|
|
360
|
+
*/
|
|
89
361
|
classNameContainer?: string;
|
|
362
|
+
/**
|
|
363
|
+
* [ID] : Tinggi grafik (opsional).
|
|
364
|
+
* [EN] : Chart height (optional).
|
|
365
|
+
*/
|
|
90
366
|
height?: number;
|
|
367
|
+
/**
|
|
368
|
+
* [ID] : Tooltip kustom (opsional).
|
|
369
|
+
* [EN] : Custom tooltip (optional).
|
|
370
|
+
*/
|
|
91
371
|
CustomTooltip?: TGradientLineChartCustomTooltip;
|
|
92
372
|
}
|
|
373
|
+
/**
|
|
374
|
+
* [ID] : Interface untuk data tooltip kustom grafik garis gradien.
|
|
375
|
+
* [EN] : Interface for gradient line chart custom tooltip data.
|
|
376
|
+
*/
|
|
93
377
|
export interface IDataGradientLineChartCustomTooltip {
|
|
378
|
+
/**
|
|
379
|
+
* [ID] : Gaya CSS.
|
|
380
|
+
* [EN] : CSS style.
|
|
381
|
+
*/
|
|
94
382
|
style: React.CSSProperties;
|
|
383
|
+
/**
|
|
384
|
+
* [ID] : Label tooltip.
|
|
385
|
+
* [EN] : Tooltip label.
|
|
386
|
+
*/
|
|
95
387
|
label: string;
|
|
388
|
+
/**
|
|
389
|
+
* [ID] : Dataset tooltip.
|
|
390
|
+
* [EN] : Tooltip dataset.
|
|
391
|
+
*/
|
|
96
392
|
dataset: string;
|
|
393
|
+
/**
|
|
394
|
+
* [ID] : Nilai tooltip.
|
|
395
|
+
* [EN] : Tooltip value.
|
|
396
|
+
*/
|
|
97
397
|
value: number;
|
|
398
|
+
/**
|
|
399
|
+
* [ID] : Titik data tooltip.
|
|
400
|
+
* [EN] : Tooltip data points.
|
|
401
|
+
*/
|
|
98
402
|
dataPoints: TooltipItem<'line'>[];
|
|
99
403
|
}
|
|
100
404
|
type TGradientBarChartScales = Record<string, Scale<CoreScaleOptions>>;
|
|
101
405
|
type TGradientBarChartGradientFor = 'background' | 'border';
|
|
406
|
+
/**
|
|
407
|
+
* [ID] : Parameter untuk mengatur gradien grafik batang.
|
|
408
|
+
* [EN] : Parameters to set gradient bar chart.
|
|
409
|
+
*/
|
|
102
410
|
export interface TSetGradientBarParams {
|
|
411
|
+
/**
|
|
412
|
+
* [ID] : Konteks rendering canvas.
|
|
413
|
+
* [EN] : Canvas rendering context.
|
|
414
|
+
*/
|
|
103
415
|
ctx: CanvasRenderingContext2D;
|
|
416
|
+
/**
|
|
417
|
+
* [ID] : Area grafik.
|
|
418
|
+
* [EN] : Chart area.
|
|
419
|
+
*/
|
|
104
420
|
chartArea: ChartArea;
|
|
421
|
+
/**
|
|
422
|
+
* [ID] : Skala grafik.
|
|
423
|
+
* [EN] : Chart scales.
|
|
424
|
+
*/
|
|
105
425
|
scales: TGradientBarChartScales;
|
|
426
|
+
/**
|
|
427
|
+
* [ID] : Tinggi grafik.
|
|
428
|
+
* [EN] : Chart height.
|
|
429
|
+
*/
|
|
106
430
|
chartHeight: number;
|
|
431
|
+
/**
|
|
432
|
+
* [ID] : Target gradien.
|
|
433
|
+
* [EN] : Gradient target.
|
|
434
|
+
*/
|
|
107
435
|
gradientFor: TGradientBarChartGradientFor;
|
|
436
|
+
/**
|
|
437
|
+
* [ID] : Dataset item.
|
|
438
|
+
* [EN] : Dataset item.
|
|
439
|
+
*/
|
|
108
440
|
item: IGradientBarChartDataSet;
|
|
109
441
|
}
|
|
442
|
+
/**
|
|
443
|
+
* [ID] : Parameter untuk mendapatkan gradien grafik batang.
|
|
444
|
+
* [EN] : Parameters to get gradient bar chart.
|
|
445
|
+
*/
|
|
110
446
|
export interface TGetGradientBarParams {
|
|
447
|
+
/**
|
|
448
|
+
* [ID] : Konteks rendering canvas.
|
|
449
|
+
* [EN] : Canvas rendering context.
|
|
450
|
+
*/
|
|
111
451
|
ctx: CanvasRenderingContext2D;
|
|
452
|
+
/**
|
|
453
|
+
* [ID] : Area grafik.
|
|
454
|
+
* [EN] : Chart area.
|
|
455
|
+
*/
|
|
112
456
|
chartArea: ChartArea;
|
|
457
|
+
/**
|
|
458
|
+
* [ID] : Skala grafik.
|
|
459
|
+
* [EN] : Chart scales.
|
|
460
|
+
*/
|
|
113
461
|
scales: TGradientBarChartScales;
|
|
462
|
+
/**
|
|
463
|
+
* [ID] : Target gradien.
|
|
464
|
+
* [EN] : Gradient target.
|
|
465
|
+
*/
|
|
114
466
|
gradientFor: TGradientBarChartGradientFor;
|
|
467
|
+
/**
|
|
468
|
+
* [ID] : Dataset item.
|
|
469
|
+
* [EN] : Dataset item.
|
|
470
|
+
*/
|
|
115
471
|
item: IGradientBarChartDataSet;
|
|
116
472
|
}
|
|
473
|
+
/**
|
|
474
|
+
* [ID] : Tipe komponen tooltip kustom untuk grafik batang gradien.
|
|
475
|
+
* [EN] : Custom tooltip component type for gradient bar chart.
|
|
476
|
+
*/
|
|
117
477
|
export type TGradientBarChartCustomTooltip = React.ComponentType<{
|
|
118
478
|
label: string;
|
|
119
479
|
dataset: string;
|
|
@@ -121,33 +481,133 @@ export type TGradientBarChartCustomTooltip = React.ComponentType<{
|
|
|
121
481
|
style: React.CSSProperties;
|
|
122
482
|
dataPoints: TooltipItem<'bar'>[];
|
|
123
483
|
}>;
|
|
484
|
+
/**
|
|
485
|
+
* [ID] : Interface untuk dataset grafik batang gradien.
|
|
486
|
+
* [EN] : Interface for gradient bar chart dataset.
|
|
487
|
+
*/
|
|
124
488
|
export interface IGradientBarChartDataSet extends ChartDataset<'bar'> {
|
|
489
|
+
/**
|
|
490
|
+
* [ID] : Warna background positif nol (opsional).
|
|
491
|
+
* [EN] : Positive zero background color (optional).
|
|
492
|
+
*/
|
|
125
493
|
colorBackgroundPositiveZero?: string;
|
|
494
|
+
/**
|
|
495
|
+
* [ID] : Warna background persentase positif (opsional).
|
|
496
|
+
* [EN] : Positive percentage background color (optional).
|
|
497
|
+
*/
|
|
126
498
|
colorBackgroundPositivePercentage?: string;
|
|
499
|
+
/**
|
|
500
|
+
* [ID] : Warna background negatif satu (opsional).
|
|
501
|
+
* [EN] : Negative one background color (optional).
|
|
502
|
+
*/
|
|
127
503
|
colorBackgroundNegativeOne?: string;
|
|
504
|
+
/**
|
|
505
|
+
* [ID] : Warna background persentase negatif (opsional).
|
|
506
|
+
* [EN] : Negative percentage background color (optional).
|
|
507
|
+
*/
|
|
128
508
|
colorBackgroundNegativePercentage?: string;
|
|
509
|
+
/**
|
|
510
|
+
* [ID] : Warna border positif (opsional).
|
|
511
|
+
* [EN] : Positive border color (optional).
|
|
512
|
+
*/
|
|
129
513
|
colorBorderPositive?: string;
|
|
514
|
+
/**
|
|
515
|
+
* [ID] : Warna border negatif (opsional).
|
|
516
|
+
* [EN] : Negative border color (optional).
|
|
517
|
+
*/
|
|
130
518
|
colorBorderNegative?: string;
|
|
519
|
+
/**
|
|
520
|
+
* [ID] : Warna teks label positif (opsional).
|
|
521
|
+
* [EN] : Positive label text color (optional).
|
|
522
|
+
*/
|
|
131
523
|
colorTextLabelPositive?: string;
|
|
524
|
+
/**
|
|
525
|
+
* [ID] : Warna teks label negatif (opsional).
|
|
526
|
+
* [EN] : Negative label text color (optional).
|
|
527
|
+
*/
|
|
132
528
|
colorTextLabelNegative?: string;
|
|
529
|
+
/**
|
|
530
|
+
* [ID] : Mengatur digit (opsional).
|
|
531
|
+
* [EN] : Set digit (optional).
|
|
532
|
+
*/
|
|
133
533
|
setDigit?: boolean;
|
|
134
534
|
}
|
|
535
|
+
/**
|
|
536
|
+
* [ID] : Interface untuk data grafik batang gradien.
|
|
537
|
+
* [EN] : Interface for gradient bar chart data.
|
|
538
|
+
*/
|
|
135
539
|
export interface IGradientBarChartData extends Omit<ChartData<'bar'>, 'datasets'> {
|
|
540
|
+
/**
|
|
541
|
+
* [ID] : Kumpulan dataset.
|
|
542
|
+
* [EN] : Collection of datasets.
|
|
543
|
+
*/
|
|
136
544
|
datasets: IGradientBarChartDataSet[];
|
|
137
545
|
}
|
|
546
|
+
/**
|
|
547
|
+
* [ID] : Interface untuk komponen grafik batang gradien.
|
|
548
|
+
* [EN] : Interface for gradient bar chart component.
|
|
549
|
+
*/
|
|
138
550
|
export interface IGradientBarChart {
|
|
551
|
+
/**
|
|
552
|
+
* [ID] : Data grafik.
|
|
553
|
+
* [EN] : Chart data.
|
|
554
|
+
*/
|
|
139
555
|
data: IGradientBarChartData;
|
|
556
|
+
/**
|
|
557
|
+
* [ID] : Opsi grafik (opsional).
|
|
558
|
+
* [EN] : Chart options (optional).
|
|
559
|
+
*/
|
|
140
560
|
options?: ChartOptions<'bar'>;
|
|
561
|
+
/**
|
|
562
|
+
* [ID] : ID grafik.
|
|
563
|
+
* [EN] : Chart ID.
|
|
564
|
+
*/
|
|
141
565
|
id: string;
|
|
566
|
+
/**
|
|
567
|
+
* [ID] : Nama kelas CSS kontainer (opsional).
|
|
568
|
+
* [EN] : Container CSS class name (optional).
|
|
569
|
+
*/
|
|
142
570
|
classNameContainer?: string;
|
|
571
|
+
/**
|
|
572
|
+
* [ID] : Tinggi grafik (opsional).
|
|
573
|
+
* [EN] : Chart height (optional).
|
|
574
|
+
*/
|
|
143
575
|
height?: number;
|
|
576
|
+
/**
|
|
577
|
+
* [ID] : Tooltip kustom (opsional).
|
|
578
|
+
* [EN] : Custom tooltip (optional).
|
|
579
|
+
*/
|
|
144
580
|
CustomTooltip?: TGradientBarChartCustomTooltip;
|
|
145
581
|
}
|
|
582
|
+
/**
|
|
583
|
+
* [ID] : Interface untuk data tooltip kustom grafik batang gradien.
|
|
584
|
+
* [EN] : Interface for gradient bar chart custom tooltip data.
|
|
585
|
+
*/
|
|
146
586
|
export interface IDataGradientBarChartCustomTooltip {
|
|
587
|
+
/**
|
|
588
|
+
* [ID] : Gaya CSS.
|
|
589
|
+
* [EN] : CSS style.
|
|
590
|
+
*/
|
|
147
591
|
style: React.CSSProperties;
|
|
592
|
+
/**
|
|
593
|
+
* [ID] : Label tooltip.
|
|
594
|
+
* [EN] : Tooltip label.
|
|
595
|
+
*/
|
|
148
596
|
label: string;
|
|
597
|
+
/**
|
|
598
|
+
* [ID] : Dataset tooltip.
|
|
599
|
+
* [EN] : Tooltip dataset.
|
|
600
|
+
*/
|
|
149
601
|
dataset: string;
|
|
602
|
+
/**
|
|
603
|
+
* [ID] : Nilai tooltip.
|
|
604
|
+
* [EN] : Tooltip value.
|
|
605
|
+
*/
|
|
150
606
|
value: number;
|
|
607
|
+
/**
|
|
608
|
+
* [ID] : Titik data tooltip.
|
|
609
|
+
* [EN] : Tooltip data points.
|
|
610
|
+
*/
|
|
151
611
|
dataPoints: TooltipItem<'bar'>[];
|
|
152
612
|
}
|
|
153
613
|
export {};
|
|
@@ -1,6 +1,18 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
|
|
3
|
+
/**
|
|
4
|
+
* [ID] : Interface untuk komponen CheckboxTable.
|
|
5
|
+
* [EN] : Interface for CheckboxTable component.
|
|
6
|
+
*/
|
|
3
7
|
export interface ICheckboxTable extends React.HTMLProps<HTMLInputElement> {
|
|
8
|
+
/**
|
|
9
|
+
* [ID] : Menentukan status indeterminate (setengah dicentang) (opsional).
|
|
10
|
+
* [EN] : Determines indeterminate status (half-checked) (optional).
|
|
11
|
+
*/
|
|
4
12
|
indeterminate?: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* [ID] : Nama kelas CSS untuk kontainer (opsional).
|
|
15
|
+
* [EN] : CSS class name for container (optional).
|
|
16
|
+
*/
|
|
5
17
|
classNameContainer?: string;
|
|
6
18
|
}
|
|
@@ -2,13 +2,49 @@ import { ReactNode } from 'react';
|
|
|
2
2
|
import { Itypography } from '../../../config/components/typography';
|
|
3
3
|
import { TFont } from '../../../config/components/font';
|
|
4
4
|
|
|
5
|
+
/**
|
|
6
|
+
* [ID] : Interface untuk komponen Chips.
|
|
7
|
+
* [EN] : Interface for Chips component.
|
|
8
|
+
*/
|
|
5
9
|
export interface IChips extends React.HTMLAttributes<HTMLSpanElement> {
|
|
10
|
+
/**
|
|
11
|
+
* [ID] : Konten anak di dalam chips.
|
|
12
|
+
* [EN] : Child content inside the chips.
|
|
13
|
+
*/
|
|
6
14
|
children: ReactNode | ReactNode[];
|
|
15
|
+
/**
|
|
16
|
+
* [ID] : Nama kelas CSS tambahan (opsional).
|
|
17
|
+
* [EN] : Additional CSS class name (optional).
|
|
18
|
+
*/
|
|
7
19
|
className?: string | undefined;
|
|
20
|
+
/**
|
|
21
|
+
* [ID] : Konfigurasi font (opsional).
|
|
22
|
+
* [EN] : Font configuration (optional).
|
|
23
|
+
*/
|
|
8
24
|
fonts?: TFont;
|
|
25
|
+
/**
|
|
26
|
+
* [ID] : Ukuran chips (opsional).
|
|
27
|
+
* [EN] : Chips size (optional).
|
|
28
|
+
*/
|
|
9
29
|
size?: 'reguler' | 'small' | 'l' | 's';
|
|
30
|
+
/**
|
|
31
|
+
* [ID] : Varian gaya chips (opsional).
|
|
32
|
+
* [EN] : Chips style variant (optional).
|
|
33
|
+
*/
|
|
10
34
|
variants?: 'filled-laba-blue-10' | 'ghost-laba-grey-02' | 'nude-laba-grey-10' | 'filled-blue-gray-100' | 'filled-gray-300';
|
|
35
|
+
/**
|
|
36
|
+
* [ID] : Ikon utama (opsional).
|
|
37
|
+
* [EN] : Main icon (optional).
|
|
38
|
+
*/
|
|
11
39
|
icon?: ReactNode | ReactNode[] | (() => ReactNode) | (() => ReactNode[]);
|
|
40
|
+
/**
|
|
41
|
+
* [ID] : Ikon hapus (opsional).
|
|
42
|
+
* [EN] : Remove icon (optional).
|
|
43
|
+
*/
|
|
12
44
|
removeIcon?: ReactNode | ReactNode[] | (() => ReactNode) | (() => ReactNode[]);
|
|
45
|
+
/**
|
|
46
|
+
* [ID] : Konfigurasi tipografi (opsional).
|
|
47
|
+
* [EN] : Typography configuration (optional).
|
|
48
|
+
*/
|
|
13
49
|
typography?: Itypography;
|
|
14
50
|
}
|