@rabex-kit/rabex-ui 0.0.3 → 0.0.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.
@@ -5,21 +5,7 @@ export declare type ChipProps = Omit<MuiChipProps, 'size'> & {
5
5
  bulletColor?: string;
6
6
  labelColor?: string;
7
7
  mode?: 'normal' | 'light';
8
- size?: 'small' | 'medium' | 'large';
8
+ size?: 'sm' | 'xs';
9
9
  };
10
- /**
11
- * Chip component of Material is somthing like Badge ,
12
- * Material Ui Chip is wrapper for content that has
13
- * Background color and other various Props,
14
- * you can see Chip Documentation api that I mentioned below [here](https://mui.com/material-ui/api/chip)
15
- *
16
- * ```typescript
17
- * import { Chip } from '@rabex-kit/core';
18
- * ```
19
- *
20
- *
21
- * @param props
22
- * @returns
23
- */
24
10
  declare const Chip: React.FC<ChipProps>;
25
11
  export default Chip;
@@ -0,0 +1,18 @@
1
+ import React from 'react';
2
+ import { TabsProps as MuiTabsProps } from '@mui/material';
3
+ export declare type SegmentedControlProps = Omit<MuiTabsProps, 'indicatorColor' | 'textColor'> & {
4
+ size?: 'sm' | 'md' | 'lg';
5
+ isSeparate?: boolean;
6
+ hasBorder?: boolean;
7
+ };
8
+ /**
9
+ * SegmentedControl component for switching between views.
10
+ *
11
+ * This component is built on top of Material-UI Tabs and supports additional props
12
+ * for customizing size, border, and separation of tabs.
13
+ *
14
+ * @param props
15
+ * @returns JSX.Element
16
+ */
17
+ declare const SegmentedControl: React.FC<SegmentedControlProps>;
18
+ export default SegmentedControl;
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ import { TabProps as MuiTabProps } from '@mui/material';
3
+ export declare type SegmentedControlTabProps = MuiTabProps;
4
+ declare const SegmentedControlTab: React.FC<SegmentedControlTabProps>;
5
+ export default SegmentedControlTab;
@@ -13,13 +13,13 @@ export declare type TabsProps = Omit<MuiTabsProps, 'indicatorColor' | 'textColor
13
13
  * You can read Material-UI Tabs Documentation [here](https://mui.com/material-ui/api/tabs/).
14
14
  *
15
15
  * ```typescript
16
- * import { Tabs } from '@rabex-kit/core';
16
+ * import { Tabs } from '@rabex-kit/rabex-ui';
17
17
  * ```
18
18
  *
19
19
  * Also you can read Material-UI Tab Documentation [here](https://mui.com/material-ui/api/tab/).
20
20
  *
21
21
  * ```typescript
22
- * import { Tab } from '@rabex-kit/core';
22
+ * import { Tab } from '@rabex-kit/rabex-ui';
23
23
  * ```
24
24
  *
25
25
  *
@@ -15,22 +15,31 @@ declare module '@mui/material/Chip' {
15
15
  default: true;
16
16
  }
17
17
  interface ChipPropsSizeOverrides {
18
- small: true;
19
- medium: true;
20
- large: true;
18
+ xs: true;
19
+ sm: true;
21
20
  }
22
21
  }
23
22
  declare const _default: {
24
23
  components: {
25
24
  styleOverrides: {
26
- root: ({ theme }: {
25
+ root: ({ theme, ownerState, ...rest }: {
26
+ [x: string]: any;
27
27
  theme: any;
28
+ ownerState: any;
29
+ }) => any;
30
+ icon: ({ theme, ownerState }: {
31
+ theme: any;
32
+ ownerState: any;
28
33
  }) => {
29
- display: string;
30
- gap: any;
31
- borderRadius: number;
32
- fontWeight: number;
33
- fontSize: number;
34
+ margin: number;
35
+ fontSize: any;
36
+ };
37
+ deleteIcon: ({ theme, ownerState }: {
38
+ theme: any;
39
+ ownerState: any;
40
+ }) => {
41
+ margin: number;
42
+ fontSize: any;
34
43
  };
35
44
  label: ({ theme }: {
36
45
  theme: any;
@@ -41,12 +50,6 @@ declare const _default: {
41
50
  };
42
51
  };
43
52
  variants: ({
44
- props: ChipProps;
45
- style: ({ theme, ...ownerState }: any) => {
46
- color: any;
47
- backgroundColor: any;
48
- };
49
- } | {
50
53
  props: ChipProps;
51
54
  style: ({ theme, ...ownerState }: any) => {
52
55
  color: any;
@@ -5,11 +5,15 @@ declare module '@mui/material/styles/createPalette' {
5
5
  base: Palette['primary'];
6
6
  grayBackground: Palette['primary'];
7
7
  textColor: Palette['primary'];
8
+ backgroundColor: Palette['primary'];
9
+ neutral: Palette['primary'];
8
10
  }
9
11
  interface PaletteOptions {
10
12
  base: PaletteOptions['primary'];
11
13
  grayBackground: PaletteOptions['primary'];
12
14
  textColor: PaletteOptions['primary'];
15
+ backgroundColor: PaletteOptions['primary'];
16
+ neutral: PaletteOptions['primary'];
13
17
  }
14
18
  interface PaletteColor {
15
19
  950?: string;
@@ -61,9 +65,9 @@ declare module '@mui/material/styles/createPalette' {
61
65
  }
62
66
  }
63
67
  export interface PaletteColor {
64
- light: string;
65
- main: string;
66
- dark: string;
68
+ light?: string;
69
+ main?: string;
70
+ dark?: string;
67
71
  contrastText?: string;
68
72
  950?: string;
69
73
  900?: string;
@@ -84,5 +84,32 @@ declare const _default: {
84
84
  A10: string;
85
85
  A0: string;
86
86
  };
87
+ neutral: {
88
+ 950: string;
89
+ 900: string;
90
+ 800: string;
91
+ 700: string;
92
+ 600: string;
93
+ 500: string;
94
+ 400: string;
95
+ 300: string;
96
+ 200: string;
97
+ 100: string;
98
+ 50: string;
99
+ };
100
+ backgroundColor: {
101
+ main: string;
102
+ 950: string;
103
+ 900: string;
104
+ 800: string;
105
+ 700: string;
106
+ 600: string;
107
+ 500: string;
108
+ 400: string;
109
+ 300: string;
110
+ 200: string;
111
+ 100: string;
112
+ 50: string;
113
+ };
87
114
  };
88
115
  export default _default;
@@ -54,6 +54,7 @@ declare const _default: {
54
54
  50: string;
55
55
  };
56
56
  backgroundColor: {
57
+ main: string;
57
58
  950: string;
58
59
  900: string;
59
60
  800: string;
@@ -146,6 +147,16 @@ declare const _default: {
146
147
  A0: string;
147
148
  };
148
149
  base: {
150
+ 900: string;
151
+ 800: string;
152
+ 700: string;
153
+ 600: string;
154
+ 500: string;
155
+ 400: string;
156
+ 300: string;
157
+ 200: string;
158
+ 100: string;
159
+ 50: string;
149
160
  main: string;
150
161
  A100: string;
151
162
  A80: string;
@@ -0,0 +1,491 @@
1
+ declare const _default: {
2
+ components: {
3
+ styleOverrides: {
4
+ root: ({ ownerState, theme }: {
5
+ ownerState: any;
6
+ theme: any;
7
+ }) => {
8
+ '& .MuiTab-root::after': {
9
+ display: string;
10
+ content?: undefined;
11
+ } | {
12
+ content: string;
13
+ display: string;
14
+ };
15
+ width?: string;
16
+ border?: string;
17
+ '& .MuiTab-root': {
18
+ borderRadius: number;
19
+ padding: any;
20
+ border: string;
21
+ };
22
+ backgroundColor: string;
23
+ '& .MuiTabs-flexContainer': {
24
+ gridGap: any;
25
+ padding: any;
26
+ };
27
+ '& .MuiTab-root.Mui-selected': {
28
+ borderRadius: number;
29
+ color: any;
30
+ boxShadow: any;
31
+ };
32
+ borderRadius: number;
33
+ minHeight: string;
34
+ color: any;
35
+ } | {
36
+ '& .MuiTab-root::after': {
37
+ display: string;
38
+ content?: undefined;
39
+ } | {
40
+ content: string;
41
+ display: string;
42
+ };
43
+ width?: string;
44
+ border?: string;
45
+ '& .MuiTab-root': {
46
+ borderRadius: number;
47
+ padding: any;
48
+ border: string;
49
+ };
50
+ backgroundColor: string;
51
+ '& .MuiTabs-flexContainer': {
52
+ gridGap: any;
53
+ padding: any;
54
+ };
55
+ '& .MuiTab-root.Mui-selected': {
56
+ borderRadius: number;
57
+ color: any;
58
+ boxShadow: any;
59
+ };
60
+ height: any;
61
+ borderRadius: any;
62
+ padding: any;
63
+ minHeight: string;
64
+ color: any;
65
+ } | {
66
+ '& .MuiTab-root::after': {
67
+ display: string;
68
+ content?: undefined;
69
+ } | {
70
+ content: string;
71
+ display: string;
72
+ };
73
+ width?: string;
74
+ border?: string;
75
+ '& .MuiTab-root': {
76
+ borderRadius: number;
77
+ padding: any;
78
+ border: string;
79
+ };
80
+ backgroundColor: string;
81
+ '& .MuiTabs-flexContainer': {
82
+ gridGap: any;
83
+ padding: any;
84
+ };
85
+ '& .MuiTab-root.Mui-selected': {
86
+ borderRadius: number;
87
+ color: any;
88
+ boxShadow: any;
89
+ };
90
+ height: any;
91
+ borderRadius: any;
92
+ padding: any;
93
+ minHeight: string;
94
+ color: any;
95
+ } | {
96
+ '& .MuiTab-root::after': {
97
+ display: string;
98
+ content?: undefined;
99
+ } | {
100
+ content: string;
101
+ display: string;
102
+ };
103
+ width?: string;
104
+ border?: string;
105
+ '& .MuiTab-root': {
106
+ borderRadius: number;
107
+ padding: any;
108
+ border: string;
109
+ };
110
+ backgroundColor: string;
111
+ '& .MuiTabs-flexContainer': {
112
+ gridGap: any;
113
+ padding: any;
114
+ };
115
+ '& .MuiTab-root.Mui-selected': {
116
+ borderRadius: number;
117
+ color: any;
118
+ boxShadow: any;
119
+ };
120
+ height: any;
121
+ borderRadius: any;
122
+ padding: any;
123
+ minHeight: string;
124
+ color: any;
125
+ } | {
126
+ '& .MuiTab-root::after': {
127
+ display: string;
128
+ content?: undefined;
129
+ } | {
130
+ content: string;
131
+ display: string;
132
+ };
133
+ width?: string;
134
+ border?: string;
135
+ '& .MuiTab-root': {
136
+ borderRadius: number;
137
+ padding: any;
138
+ border: string;
139
+ };
140
+ backgroundColor: string;
141
+ '& .MuiTabs-flexContainer': {
142
+ gridGap: any;
143
+ padding: any;
144
+ };
145
+ '& .MuiTab-root.Mui-selected': {
146
+ borderRadius: number;
147
+ color: any;
148
+ boxShadow: any;
149
+ };
150
+ height: any;
151
+ borderRadius: any;
152
+ padding: any;
153
+ minHeight: string;
154
+ color: any;
155
+ } | {
156
+ '& .MuiTab-root::after': {
157
+ display: string;
158
+ content?: undefined;
159
+ } | {
160
+ content: string;
161
+ display: string;
162
+ };
163
+ width?: string;
164
+ border?: string;
165
+ '& .MuiTab-root': {
166
+ borderRadius: number;
167
+ padding: any;
168
+ border: string;
169
+ };
170
+ backgroundColor: string;
171
+ '& .MuiTabs-flexContainer': {
172
+ gridGap: any;
173
+ padding: any;
174
+ };
175
+ '& .MuiTab-root.Mui-selected': {
176
+ borderRadius: number;
177
+ color: any;
178
+ boxShadow: any;
179
+ };
180
+ height: any;
181
+ borderRadius: any;
182
+ padding: any;
183
+ minHeight: string;
184
+ color: any;
185
+ } | {
186
+ '& .MuiTab-root::after': {
187
+ display: string;
188
+ content?: undefined;
189
+ } | {
190
+ content: string;
191
+ display: string;
192
+ };
193
+ width?: string;
194
+ border?: string;
195
+ '& .MuiTab-root': {
196
+ borderRadius: number;
197
+ padding: any;
198
+ border: string;
199
+ };
200
+ backgroundColor: string;
201
+ '& .MuiTabs-flexContainer': {
202
+ gridGap: any;
203
+ padding: any;
204
+ };
205
+ '& .MuiTab-root.Mui-selected': {
206
+ borderRadius: number;
207
+ color: any;
208
+ boxShadow: any;
209
+ };
210
+ height: any;
211
+ borderRadius: any;
212
+ padding: any;
213
+ minHeight: string;
214
+ color: any;
215
+ } | {
216
+ '& .MuiTab-root::after': {
217
+ display: string;
218
+ content?: undefined;
219
+ } | {
220
+ content: string;
221
+ display: string;
222
+ };
223
+ width?: string;
224
+ border?: string;
225
+ '& .MuiTab-root': {
226
+ borderRadius: number;
227
+ padding: any;
228
+ border: string;
229
+ };
230
+ backgroundColor: string;
231
+ '& .MuiTabs-flexContainer': {
232
+ gridGap: any;
233
+ padding: any;
234
+ };
235
+ '& .MuiTab-root.Mui-selected': {
236
+ borderRadius: number;
237
+ color: any;
238
+ boxShadow: any;
239
+ };
240
+ height: any;
241
+ borderRadius: any;
242
+ padding: any;
243
+ minHeight: string;
244
+ color: any;
245
+ } | {
246
+ '& .MuiTab-root::after': {
247
+ display: string;
248
+ content?: undefined;
249
+ } | {
250
+ content: string;
251
+ display: string;
252
+ };
253
+ width?: string;
254
+ border?: string;
255
+ '& .MuiTab-root': {
256
+ borderRadius: number;
257
+ padding: any;
258
+ border: string;
259
+ };
260
+ backgroundColor: string;
261
+ '& .MuiTabs-flexContainer': {
262
+ gridGap: any;
263
+ padding: any;
264
+ };
265
+ '& .MuiTab-root.Mui-selected': {
266
+ borderRadius: number;
267
+ color: any;
268
+ boxShadow: any;
269
+ };
270
+ borderRadius: number;
271
+ minHeight: string;
272
+ color: any;
273
+ } | {
274
+ '& .MuiTab-root::after': {
275
+ display: string;
276
+ content?: undefined;
277
+ } | {
278
+ content: string;
279
+ display: string;
280
+ };
281
+ width?: string;
282
+ border?: string;
283
+ '& .MuiTab-root': {
284
+ borderRadius: number;
285
+ padding: any;
286
+ border: string;
287
+ };
288
+ backgroundColor: string;
289
+ '& .MuiTabs-flexContainer': {
290
+ gridGap: any;
291
+ padding: any;
292
+ };
293
+ '& .MuiTab-root.Mui-selected': {
294
+ borderRadius: number;
295
+ color: any;
296
+ boxShadow: any;
297
+ };
298
+ height: any;
299
+ borderRadius: any;
300
+ padding: any;
301
+ minHeight: string;
302
+ color: any;
303
+ } | {
304
+ '& .MuiTab-root::after': {
305
+ display: string;
306
+ content?: undefined;
307
+ } | {
308
+ content: string;
309
+ display: string;
310
+ };
311
+ width?: string;
312
+ border?: string;
313
+ '& .MuiTab-root': {
314
+ borderRadius: number;
315
+ padding: any;
316
+ border: string;
317
+ };
318
+ backgroundColor: string;
319
+ '& .MuiTabs-flexContainer': {
320
+ gridGap: any;
321
+ padding: any;
322
+ };
323
+ '& .MuiTab-root.Mui-selected': {
324
+ borderRadius: number;
325
+ color: any;
326
+ boxShadow: any;
327
+ };
328
+ height: any;
329
+ borderRadius: any;
330
+ padding: any;
331
+ minHeight: string;
332
+ color: any;
333
+ } | {
334
+ '& .MuiTab-root::after': {
335
+ display: string;
336
+ content?: undefined;
337
+ } | {
338
+ content: string;
339
+ display: string;
340
+ };
341
+ width?: string;
342
+ border?: string;
343
+ '& .MuiTab-root': {
344
+ borderRadius: number;
345
+ padding: any;
346
+ border: string;
347
+ };
348
+ backgroundColor: string;
349
+ '& .MuiTabs-flexContainer': {
350
+ gridGap: any;
351
+ padding: any;
352
+ };
353
+ '& .MuiTab-root.Mui-selected': {
354
+ borderRadius: number;
355
+ color: any;
356
+ boxShadow: any;
357
+ };
358
+ height: any;
359
+ borderRadius: any;
360
+ padding: any;
361
+ minHeight: string;
362
+ color: any;
363
+ } | {
364
+ '& .MuiTab-root::after': {
365
+ display: string;
366
+ content?: undefined;
367
+ } | {
368
+ content: string;
369
+ display: string;
370
+ };
371
+ width?: string;
372
+ border?: string;
373
+ '& .MuiTab-root': {
374
+ borderRadius: number;
375
+ padding: any;
376
+ border: string;
377
+ };
378
+ backgroundColor: string;
379
+ '& .MuiTabs-flexContainer': {
380
+ gridGap: any;
381
+ padding: any;
382
+ };
383
+ '& .MuiTab-root.Mui-selected': {
384
+ borderRadius: number;
385
+ color: any;
386
+ boxShadow: any;
387
+ };
388
+ height: any;
389
+ borderRadius: any;
390
+ padding: any;
391
+ minHeight: string;
392
+ color: any;
393
+ } | {
394
+ '& .MuiTab-root::after': {
395
+ display: string;
396
+ content?: undefined;
397
+ } | {
398
+ content: string;
399
+ display: string;
400
+ };
401
+ width?: string;
402
+ border?: string;
403
+ '& .MuiTab-root': {
404
+ borderRadius: number;
405
+ padding: any;
406
+ border: string;
407
+ };
408
+ backgroundColor: string;
409
+ '& .MuiTabs-flexContainer': {
410
+ gridGap: any;
411
+ padding: any;
412
+ };
413
+ '& .MuiTab-root.Mui-selected': {
414
+ borderRadius: number;
415
+ color: any;
416
+ boxShadow: any;
417
+ };
418
+ height: any;
419
+ borderRadius: any;
420
+ padding: any;
421
+ minHeight: string;
422
+ color: any;
423
+ } | {
424
+ '& .MuiTab-root::after': {
425
+ display: string;
426
+ content?: undefined;
427
+ } | {
428
+ content: string;
429
+ display: string;
430
+ };
431
+ width?: string;
432
+ border?: string;
433
+ '& .MuiTab-root': {
434
+ borderRadius: number;
435
+ padding: any;
436
+ border: string;
437
+ };
438
+ backgroundColor: string;
439
+ '& .MuiTabs-flexContainer': {
440
+ gridGap: any;
441
+ padding: any;
442
+ };
443
+ '& .MuiTab-root.Mui-selected': {
444
+ borderRadius: number;
445
+ color: any;
446
+ boxShadow: any;
447
+ };
448
+ height: any;
449
+ borderRadius: any;
450
+ padding: any;
451
+ minHeight: string;
452
+ color: any;
453
+ } | {
454
+ '& .MuiTab-root::after': {
455
+ display: string;
456
+ content?: undefined;
457
+ } | {
458
+ content: string;
459
+ display: string;
460
+ };
461
+ width?: string;
462
+ border?: string;
463
+ '& .MuiTab-root': {
464
+ borderRadius: number;
465
+ padding: any;
466
+ border: string;
467
+ };
468
+ backgroundColor: string;
469
+ '& .MuiTabs-flexContainer': {
470
+ gridGap: any;
471
+ padding: any;
472
+ };
473
+ '& .MuiTab-root.Mui-selected': {
474
+ borderRadius: number;
475
+ color: any;
476
+ boxShadow: any;
477
+ };
478
+ height: any;
479
+ borderRadius: any;
480
+ padding: any;
481
+ minHeight: string;
482
+ color: any;
483
+ };
484
+ indicator: {
485
+ display: string;
486
+ };
487
+ };
488
+ variants: never[];
489
+ };
490
+ };
491
+ export default _default;