easykar-backoffice-ui 0.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/index.cjs +4124 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +702 -0
- package/dist/index.d.ts +702 -0
- package/dist/index.js +4035 -0
- package/dist/index.js.map +1 -0
- package/dist/styles.css +1 -0
- package/package.json +89 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,702 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { ReactNode } from 'react';
|
|
4
|
+
import { ClassValue } from 'clsx';
|
|
5
|
+
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
6
|
+
import { VariantProps } from 'class-variance-authority';
|
|
7
|
+
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
|
|
8
|
+
import * as TabsPrimitive from '@radix-ui/react-tabs';
|
|
9
|
+
|
|
10
|
+
type TypographyToken = {
|
|
11
|
+
fontSize: string;
|
|
12
|
+
lineHeight: string;
|
|
13
|
+
fontWeight: number;
|
|
14
|
+
letterSpacing?: string;
|
|
15
|
+
};
|
|
16
|
+
declare const typographyScale: {
|
|
17
|
+
"display-xsmall": TypographyToken;
|
|
18
|
+
"display-small": TypographyToken;
|
|
19
|
+
"display-medium": TypographyToken;
|
|
20
|
+
"display-large": TypographyToken;
|
|
21
|
+
"heading-xsmall": TypographyToken;
|
|
22
|
+
"heading-small": TypographyToken;
|
|
23
|
+
"heading-medium": TypographyToken;
|
|
24
|
+
"heading-large": TypographyToken;
|
|
25
|
+
"label-xsmall": TypographyToken;
|
|
26
|
+
"label-small": TypographyToken;
|
|
27
|
+
"label-medium": TypographyToken;
|
|
28
|
+
"label-large": TypographyToken;
|
|
29
|
+
"body-xsmall": TypographyToken;
|
|
30
|
+
"body-small": TypographyToken;
|
|
31
|
+
"body-medium": TypographyToken;
|
|
32
|
+
"body-large": TypographyToken;
|
|
33
|
+
};
|
|
34
|
+
declare const semanticColors: {
|
|
35
|
+
readonly text: {
|
|
36
|
+
readonly 900: "#111927";
|
|
37
|
+
readonly 600: "#4d5761";
|
|
38
|
+
readonly 500: "#6c737f";
|
|
39
|
+
readonly 400: "#9da4ae";
|
|
40
|
+
readonly 0: "#ffffff";
|
|
41
|
+
};
|
|
42
|
+
readonly background: {
|
|
43
|
+
readonly 900: "#111927";
|
|
44
|
+
readonly 700: "#384250";
|
|
45
|
+
readonly 200: "#e5e7eb";
|
|
46
|
+
readonly 100: "#f3f4f6";
|
|
47
|
+
readonly 50: "#f9fafb";
|
|
48
|
+
readonly 0: "#ffffff";
|
|
49
|
+
};
|
|
50
|
+
readonly border: {
|
|
51
|
+
readonly 900: "#111927";
|
|
52
|
+
readonly 300: "#d2d6da";
|
|
53
|
+
readonly 200: "#e5e7eb";
|
|
54
|
+
readonly 0: "#ffffff";
|
|
55
|
+
};
|
|
56
|
+
readonly icon: {
|
|
57
|
+
readonly 900: "#111927";
|
|
58
|
+
readonly 600: "#4d5761";
|
|
59
|
+
readonly 500: "#6c737f";
|
|
60
|
+
readonly 400: "#9da4ae";
|
|
61
|
+
readonly 0: "#ffffff";
|
|
62
|
+
};
|
|
63
|
+
readonly primary: {
|
|
64
|
+
readonly 900: "#0e391f";
|
|
65
|
+
readonly 700: "#248a4b";
|
|
66
|
+
readonly 500: "#2fb563";
|
|
67
|
+
readonly 300: "#acd38d";
|
|
68
|
+
readonly 100: "#eaf4e1";
|
|
69
|
+
};
|
|
70
|
+
readonly success: {
|
|
71
|
+
readonly dark: "#1b7f3c";
|
|
72
|
+
readonly base: "#29c95f";
|
|
73
|
+
readonly light: "#c3ffd6";
|
|
74
|
+
readonly lighter: "#f5fff7";
|
|
75
|
+
};
|
|
76
|
+
readonly warning: {
|
|
77
|
+
readonly dark: "#996004";
|
|
78
|
+
readonly base: "#f7bb0a";
|
|
79
|
+
readonly light: "#ffefc7";
|
|
80
|
+
readonly lighter: "#fffaea";
|
|
81
|
+
};
|
|
82
|
+
readonly danger: {
|
|
83
|
+
readonly dark: "#c92b2a";
|
|
84
|
+
readonly base: "#e93534";
|
|
85
|
+
readonly light: "#ffdbdb";
|
|
86
|
+
readonly lighter: "#fffafa";
|
|
87
|
+
};
|
|
88
|
+
};
|
|
89
|
+
declare const primitiveColors: {
|
|
90
|
+
readonly neutral: {
|
|
91
|
+
readonly 900: "#111927";
|
|
92
|
+
readonly 800: "#1f2a37";
|
|
93
|
+
readonly 700: "#384250";
|
|
94
|
+
readonly 600: "#4d5761";
|
|
95
|
+
readonly 500: "#6c737f";
|
|
96
|
+
readonly 400: "#9da4ae";
|
|
97
|
+
readonly 300: "#d2d6db";
|
|
98
|
+
readonly 200: "#e5e7eb";
|
|
99
|
+
readonly 100: "#f3f4f6";
|
|
100
|
+
readonly 0: "#ffffff";
|
|
101
|
+
};
|
|
102
|
+
readonly blue: {
|
|
103
|
+
readonly dark: "#1b6480";
|
|
104
|
+
readonly base: "#00aeef";
|
|
105
|
+
readonly light: "#c2eeff";
|
|
106
|
+
readonly lighter: "#f5fcff";
|
|
107
|
+
};
|
|
108
|
+
readonly cabir: {
|
|
109
|
+
readonly yellow: "#ffce04";
|
|
110
|
+
readonly carbonDark: "#231f20";
|
|
111
|
+
};
|
|
112
|
+
readonly decorative: {
|
|
113
|
+
readonly green: "#ebf5f0";
|
|
114
|
+
};
|
|
115
|
+
};
|
|
116
|
+
type PaletteMode = "light" | "dark";
|
|
117
|
+
type SemanticPalette = {
|
|
118
|
+
background: string;
|
|
119
|
+
foreground: string;
|
|
120
|
+
primary: string;
|
|
121
|
+
"primary-foreground": string;
|
|
122
|
+
secondary: string;
|
|
123
|
+
"secondary-foreground": string;
|
|
124
|
+
accent: string;
|
|
125
|
+
"accent-foreground": string;
|
|
126
|
+
destructive: string;
|
|
127
|
+
"destructive-foreground": string;
|
|
128
|
+
muted: string;
|
|
129
|
+
"muted-foreground": string;
|
|
130
|
+
border: string;
|
|
131
|
+
input: string;
|
|
132
|
+
ring: string;
|
|
133
|
+
success: string;
|
|
134
|
+
"success-foreground": string;
|
|
135
|
+
warning: string;
|
|
136
|
+
"warning-foreground": string;
|
|
137
|
+
info: string;
|
|
138
|
+
"info-foreground": string;
|
|
139
|
+
card: string;
|
|
140
|
+
"card-foreground": string;
|
|
141
|
+
};
|
|
142
|
+
declare const colorPalette: Record<PaletteMode, SemanticPalette>;
|
|
143
|
+
declare const spacingScale: {
|
|
144
|
+
0: string;
|
|
145
|
+
1: string;
|
|
146
|
+
2: string;
|
|
147
|
+
3: string;
|
|
148
|
+
4: string;
|
|
149
|
+
5: string;
|
|
150
|
+
6: string;
|
|
151
|
+
7: string;
|
|
152
|
+
8: string;
|
|
153
|
+
};
|
|
154
|
+
declare const radii: {
|
|
155
|
+
sm: string;
|
|
156
|
+
md: string;
|
|
157
|
+
lg: string;
|
|
158
|
+
full: string;
|
|
159
|
+
};
|
|
160
|
+
declare const elevations: {
|
|
161
|
+
xs: string;
|
|
162
|
+
sm: string;
|
|
163
|
+
md: string;
|
|
164
|
+
lg: string;
|
|
165
|
+
xl: string;
|
|
166
|
+
};
|
|
167
|
+
declare const breakpoints: {
|
|
168
|
+
xs: number;
|
|
169
|
+
sm: number;
|
|
170
|
+
md: number;
|
|
171
|
+
lg: number;
|
|
172
|
+
xl: number;
|
|
173
|
+
"2xl": number;
|
|
174
|
+
};
|
|
175
|
+
declare const designTokens: {
|
|
176
|
+
typography: {
|
|
177
|
+
"display-xsmall": TypographyToken;
|
|
178
|
+
"display-small": TypographyToken;
|
|
179
|
+
"display-medium": TypographyToken;
|
|
180
|
+
"display-large": TypographyToken;
|
|
181
|
+
"heading-xsmall": TypographyToken;
|
|
182
|
+
"heading-small": TypographyToken;
|
|
183
|
+
"heading-medium": TypographyToken;
|
|
184
|
+
"heading-large": TypographyToken;
|
|
185
|
+
"label-xsmall": TypographyToken;
|
|
186
|
+
"label-small": TypographyToken;
|
|
187
|
+
"label-medium": TypographyToken;
|
|
188
|
+
"label-large": TypographyToken;
|
|
189
|
+
"body-xsmall": TypographyToken;
|
|
190
|
+
"body-small": TypographyToken;
|
|
191
|
+
"body-medium": TypographyToken;
|
|
192
|
+
"body-large": TypographyToken;
|
|
193
|
+
};
|
|
194
|
+
colors: {
|
|
195
|
+
semantic: {
|
|
196
|
+
readonly text: {
|
|
197
|
+
readonly 900: "#111927";
|
|
198
|
+
readonly 600: "#4d5761";
|
|
199
|
+
readonly 500: "#6c737f";
|
|
200
|
+
readonly 400: "#9da4ae";
|
|
201
|
+
readonly 0: "#ffffff";
|
|
202
|
+
};
|
|
203
|
+
readonly background: {
|
|
204
|
+
readonly 900: "#111927";
|
|
205
|
+
readonly 700: "#384250";
|
|
206
|
+
readonly 200: "#e5e7eb";
|
|
207
|
+
readonly 100: "#f3f4f6";
|
|
208
|
+
readonly 50: "#f9fafb";
|
|
209
|
+
readonly 0: "#ffffff";
|
|
210
|
+
};
|
|
211
|
+
readonly border: {
|
|
212
|
+
readonly 900: "#111927";
|
|
213
|
+
readonly 300: "#d2d6da";
|
|
214
|
+
readonly 200: "#e5e7eb";
|
|
215
|
+
readonly 0: "#ffffff";
|
|
216
|
+
};
|
|
217
|
+
readonly icon: {
|
|
218
|
+
readonly 900: "#111927";
|
|
219
|
+
readonly 600: "#4d5761";
|
|
220
|
+
readonly 500: "#6c737f";
|
|
221
|
+
readonly 400: "#9da4ae";
|
|
222
|
+
readonly 0: "#ffffff";
|
|
223
|
+
};
|
|
224
|
+
readonly primary: {
|
|
225
|
+
readonly 900: "#0e391f";
|
|
226
|
+
readonly 700: "#248a4b";
|
|
227
|
+
readonly 500: "#2fb563";
|
|
228
|
+
readonly 300: "#acd38d";
|
|
229
|
+
readonly 100: "#eaf4e1";
|
|
230
|
+
};
|
|
231
|
+
readonly success: {
|
|
232
|
+
readonly dark: "#1b7f3c";
|
|
233
|
+
readonly base: "#29c95f";
|
|
234
|
+
readonly light: "#c3ffd6";
|
|
235
|
+
readonly lighter: "#f5fff7";
|
|
236
|
+
};
|
|
237
|
+
readonly warning: {
|
|
238
|
+
readonly dark: "#996004";
|
|
239
|
+
readonly base: "#f7bb0a";
|
|
240
|
+
readonly light: "#ffefc7";
|
|
241
|
+
readonly lighter: "#fffaea";
|
|
242
|
+
};
|
|
243
|
+
readonly danger: {
|
|
244
|
+
readonly dark: "#c92b2a";
|
|
245
|
+
readonly base: "#e93534";
|
|
246
|
+
readonly light: "#ffdbdb";
|
|
247
|
+
readonly lighter: "#fffafa";
|
|
248
|
+
};
|
|
249
|
+
};
|
|
250
|
+
primitives: {
|
|
251
|
+
readonly neutral: {
|
|
252
|
+
readonly 900: "#111927";
|
|
253
|
+
readonly 800: "#1f2a37";
|
|
254
|
+
readonly 700: "#384250";
|
|
255
|
+
readonly 600: "#4d5761";
|
|
256
|
+
readonly 500: "#6c737f";
|
|
257
|
+
readonly 400: "#9da4ae";
|
|
258
|
+
readonly 300: "#d2d6db";
|
|
259
|
+
readonly 200: "#e5e7eb";
|
|
260
|
+
readonly 100: "#f3f4f6";
|
|
261
|
+
readonly 0: "#ffffff";
|
|
262
|
+
};
|
|
263
|
+
readonly blue: {
|
|
264
|
+
readonly dark: "#1b6480";
|
|
265
|
+
readonly base: "#00aeef";
|
|
266
|
+
readonly light: "#c2eeff";
|
|
267
|
+
readonly lighter: "#f5fcff";
|
|
268
|
+
};
|
|
269
|
+
readonly cabir: {
|
|
270
|
+
readonly yellow: "#ffce04";
|
|
271
|
+
readonly carbonDark: "#231f20";
|
|
272
|
+
};
|
|
273
|
+
readonly decorative: {
|
|
274
|
+
readonly green: "#ebf5f0";
|
|
275
|
+
};
|
|
276
|
+
};
|
|
277
|
+
modes: Record<PaletteMode, SemanticPalette>;
|
|
278
|
+
gradients: {
|
|
279
|
+
border: string;
|
|
280
|
+
borderReverse: string;
|
|
281
|
+
overlay: string;
|
|
282
|
+
};
|
|
283
|
+
};
|
|
284
|
+
spacing: {
|
|
285
|
+
0: string;
|
|
286
|
+
1: string;
|
|
287
|
+
2: string;
|
|
288
|
+
3: string;
|
|
289
|
+
4: string;
|
|
290
|
+
5: string;
|
|
291
|
+
6: string;
|
|
292
|
+
7: string;
|
|
293
|
+
8: string;
|
|
294
|
+
};
|
|
295
|
+
radii: {
|
|
296
|
+
sm: string;
|
|
297
|
+
md: string;
|
|
298
|
+
lg: string;
|
|
299
|
+
full: string;
|
|
300
|
+
};
|
|
301
|
+
elevations: {
|
|
302
|
+
xs: string;
|
|
303
|
+
sm: string;
|
|
304
|
+
md: string;
|
|
305
|
+
lg: string;
|
|
306
|
+
xl: string;
|
|
307
|
+
};
|
|
308
|
+
breakpoints: {
|
|
309
|
+
xs: number;
|
|
310
|
+
sm: number;
|
|
311
|
+
md: number;
|
|
312
|
+
lg: number;
|
|
313
|
+
xl: number;
|
|
314
|
+
"2xl": number;
|
|
315
|
+
};
|
|
316
|
+
};
|
|
317
|
+
type DesignTokens = typeof designTokens;
|
|
318
|
+
|
|
319
|
+
declare const typographyClasses: {
|
|
320
|
+
readonly "display-xsmall": "text-[32px] leading-[40px] tracking-[-1px] font-normal";
|
|
321
|
+
readonly "display-small": "text-[36px] leading-[44px] tracking-[-1.16px] font-normal";
|
|
322
|
+
readonly "display-medium": "text-[40px] leading-[48px] tracking-[-1.24px] font-normal";
|
|
323
|
+
readonly "display-large": "text-[48px] leading-[56px] tracking-[-1.32px] font-normal";
|
|
324
|
+
readonly "heading-xsmall": "text-[12px] leading-[16px] tracking-[-0.24px] font-normal";
|
|
325
|
+
readonly "heading-small": "text-[16px] leading-[24px] tracking-[-0.40px] font-normal";
|
|
326
|
+
readonly "heading-medium": "text-[18px] leading-[28px] tracking-[-0.48px] font-normal";
|
|
327
|
+
readonly "heading-large": "text-[20px] leading-[32px] tracking-[-0.56px] font-normal";
|
|
328
|
+
readonly "label-xsmall": "text-[12px] leading-[16px] tracking-[-0.24px] font-normal";
|
|
329
|
+
readonly "label-small": "text-[14px] leading-[20px] tracking-[-0.48px] font-normal";
|
|
330
|
+
readonly "label-medium": "text-[18px] leading-[24px] tracking-[-0.56px] font-normal";
|
|
331
|
+
readonly "label-large": "text-[20px] leading-[28px] tracking-[-0.64px] font-normal";
|
|
332
|
+
readonly "body-xsmall": "text-[12px] leading-[16px] tracking-[-0.24px] font-normal";
|
|
333
|
+
readonly "body-small": "text-[14px] leading-[20px] tracking-[-0.48px] font-normal";
|
|
334
|
+
readonly "body-medium": "text-[16px] leading-[24px] tracking-[-0.56px] font-normal";
|
|
335
|
+
readonly "body-large": "text-[18px] leading-[28px] tracking-[-0.64px] font-normal";
|
|
336
|
+
};
|
|
337
|
+
type TypographyVariant = keyof typeof typographyClasses;
|
|
338
|
+
declare const getTypographyClass: (variant: TypographyVariant, additional?: string) => string;
|
|
339
|
+
declare const typographyTokens: {
|
|
340
|
+
"display-xsmall": TypographyToken;
|
|
341
|
+
"display-small": TypographyToken;
|
|
342
|
+
"display-medium": TypographyToken;
|
|
343
|
+
"display-large": TypographyToken;
|
|
344
|
+
"heading-xsmall": TypographyToken;
|
|
345
|
+
"heading-small": TypographyToken;
|
|
346
|
+
"heading-medium": TypographyToken;
|
|
347
|
+
"heading-large": TypographyToken;
|
|
348
|
+
"label-xsmall": TypographyToken;
|
|
349
|
+
"label-small": TypographyToken;
|
|
350
|
+
"label-medium": TypographyToken;
|
|
351
|
+
"label-large": TypographyToken;
|
|
352
|
+
"body-xsmall": TypographyToken;
|
|
353
|
+
"body-small": TypographyToken;
|
|
354
|
+
"body-medium": TypographyToken;
|
|
355
|
+
"body-large": TypographyToken;
|
|
356
|
+
};
|
|
357
|
+
|
|
358
|
+
type ThemeContextValue = {
|
|
359
|
+
mode: PaletteMode;
|
|
360
|
+
setMode: (mode: PaletteMode) => void;
|
|
361
|
+
toggleMode: () => void;
|
|
362
|
+
};
|
|
363
|
+
declare const ThemeProvider: ({ children, initialMode, }: {
|
|
364
|
+
children: ReactNode;
|
|
365
|
+
initialMode?: PaletteMode;
|
|
366
|
+
}) => react_jsx_runtime.JSX.Element;
|
|
367
|
+
declare const useTheme: () => ThemeContextValue;
|
|
368
|
+
|
|
369
|
+
declare function cn(...inputs: ClassValue[]): string;
|
|
370
|
+
declare function formatPhoneNumberWithPattern(value: string, format: string): string;
|
|
371
|
+
|
|
372
|
+
declare const shadcnButtonVariants: (props?: ({
|
|
373
|
+
variant?: "link" | null | undefined;
|
|
374
|
+
size?: "icon" | null | undefined;
|
|
375
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
376
|
+
type ShadcnButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<typeof shadcnButtonVariants> & {
|
|
377
|
+
asChild?: boolean;
|
|
378
|
+
};
|
|
379
|
+
declare const ShadcnButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<(props?: ({
|
|
380
|
+
variant?: "link" | null | undefined;
|
|
381
|
+
size?: "icon" | null | undefined;
|
|
382
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string> & {
|
|
383
|
+
asChild?: boolean;
|
|
384
|
+
} & React.RefAttributes<HTMLButtonElement>>;
|
|
385
|
+
|
|
386
|
+
type ShadcnInputProps = React.InputHTMLAttributes<HTMLInputElement>;
|
|
387
|
+
declare const ShadcnInput: React.ForwardRefExoticComponent<ShadcnInputProps & React.RefAttributes<HTMLInputElement>>;
|
|
388
|
+
|
|
389
|
+
type ShadcnCheckboxProps = React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>;
|
|
390
|
+
declare const ShadcnCheckbox: React.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
391
|
+
|
|
392
|
+
declare const Tabs: React.ForwardRefExoticComponent<TabsPrimitive.TabsProps & React.RefAttributes<HTMLDivElement>>;
|
|
393
|
+
type TabsProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root>;
|
|
394
|
+
declare const TabsList: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
395
|
+
declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
396
|
+
declare const TabsContent: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
397
|
+
|
|
398
|
+
declare const easyButtonVariants: (props?: ({
|
|
399
|
+
variant?: "primary" | "text" | "important" | "gradient" | "loginbutton" | "editbutton" | null | undefined;
|
|
400
|
+
appearance?: "light" | "stroke" | "filled" | null | undefined;
|
|
401
|
+
size?: "small" | "icon" | "default" | "large" | "medium" | null | undefined;
|
|
402
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
403
|
+
type EasyButtonProps = Omit<ShadcnButtonProps, "variant" | "size"> & VariantProps<typeof easyButtonVariants> & {
|
|
404
|
+
asChild?: boolean;
|
|
405
|
+
};
|
|
406
|
+
declare const EasyButton: React.ForwardRefExoticComponent<Omit<ShadcnButtonProps, "variant" | "size"> & VariantProps<(props?: ({
|
|
407
|
+
variant?: "primary" | "text" | "important" | "gradient" | "loginbutton" | "editbutton" | null | undefined;
|
|
408
|
+
appearance?: "light" | "stroke" | "filled" | null | undefined;
|
|
409
|
+
size?: "small" | "icon" | "default" | "large" | "medium" | null | undefined;
|
|
410
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string> & {
|
|
411
|
+
asChild?: boolean;
|
|
412
|
+
} & React.RefAttributes<HTMLButtonElement>>;
|
|
413
|
+
|
|
414
|
+
type InputProps = ShadcnInputProps & {
|
|
415
|
+
invalid?: boolean;
|
|
416
|
+
};
|
|
417
|
+
declare const Input: React.ForwardRefExoticComponent<ShadcnInputProps & {
|
|
418
|
+
invalid?: boolean;
|
|
419
|
+
} & React.RefAttributes<HTMLInputElement>>;
|
|
420
|
+
|
|
421
|
+
interface EasyEmailInputProps extends Omit<InputProps, "type" | "inputMode" | "autoComplete" | "aria-invalid"> {
|
|
422
|
+
label?: React.ReactNode;
|
|
423
|
+
helperText?: React.ReactNode;
|
|
424
|
+
errorText?: React.ReactNode;
|
|
425
|
+
}
|
|
426
|
+
declare const EasyEmailInput: React.ForwardRefExoticComponent<EasyEmailInputProps & React.RefAttributes<HTMLInputElement>>;
|
|
427
|
+
|
|
428
|
+
interface EasyPasswordInputProps extends Omit<InputProps, "type" | "autoComplete" | "inputMode" | "aria-invalid"> {
|
|
429
|
+
label?: React.ReactNode;
|
|
430
|
+
helperText?: React.ReactNode;
|
|
431
|
+
errorText?: React.ReactNode | string[];
|
|
432
|
+
errorIcon?: React.ReactNode;
|
|
433
|
+
helperIcon?: React.ReactNode;
|
|
434
|
+
}
|
|
435
|
+
declare const EasyPasswordInput: React.ForwardRefExoticComponent<EasyPasswordInputProps & React.RefAttributes<HTMLInputElement>>;
|
|
436
|
+
|
|
437
|
+
interface EasyPhoneInputProps extends Omit<InputProps, "type" | "onChange" | "value" | "defaultValue"> {
|
|
438
|
+
label?: React.ReactNode;
|
|
439
|
+
helperText?: React.ReactNode;
|
|
440
|
+
errorText?: React.ReactNode;
|
|
441
|
+
value?: string;
|
|
442
|
+
onChange?: (value: string) => void;
|
|
443
|
+
actionButton?: React.ReactNode;
|
|
444
|
+
}
|
|
445
|
+
declare const EasyPhoneInput: React.ForwardRefExoticComponent<EasyPhoneInputProps & React.RefAttributes<HTMLInputElement>>;
|
|
446
|
+
|
|
447
|
+
interface EasyTextInputProps extends Omit<InputProps, "type" | "aria-invalid"> {
|
|
448
|
+
label?: React.ReactNode;
|
|
449
|
+
helperText?: React.ReactNode;
|
|
450
|
+
errorText?: React.ReactNode;
|
|
451
|
+
}
|
|
452
|
+
declare const EasyTextInput: React.ForwardRefExoticComponent<EasyTextInputProps & React.RefAttributes<HTMLInputElement>>;
|
|
453
|
+
|
|
454
|
+
interface EasyCheckboxProps extends Omit<ShadcnCheckboxProps, "className" | "children"> {
|
|
455
|
+
label?: React.ReactNode;
|
|
456
|
+
helperText?: React.ReactNode;
|
|
457
|
+
errorText?: React.ReactNode;
|
|
458
|
+
className?: string;
|
|
459
|
+
checkboxClassName?: string;
|
|
460
|
+
}
|
|
461
|
+
declare const EasyCheckbox: React.ForwardRefExoticComponent<EasyCheckboxProps & React.RefAttributes<HTMLButtonElement>>;
|
|
462
|
+
|
|
463
|
+
declare const containerVariants: (props?: ({
|
|
464
|
+
size?: "sm" | "md" | "lg" | "xl" | "2xl" | "full" | null | undefined;
|
|
465
|
+
padding?: "none" | "sm" | "md" | "lg" | null | undefined;
|
|
466
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
467
|
+
type EasyContainerProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof containerVariants>;
|
|
468
|
+
declare const EasyContainer: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
|
|
469
|
+
size?: "sm" | "md" | "lg" | "xl" | "2xl" | "full" | null | undefined;
|
|
470
|
+
padding?: "none" | "sm" | "md" | "lg" | null | undefined;
|
|
471
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
|
|
472
|
+
|
|
473
|
+
type EasyBodyVariant = "xsmall" | "small" | "medium" | "large";
|
|
474
|
+
interface EasyBodyProps extends React.HTMLAttributes<HTMLElement> {
|
|
475
|
+
variant?: EasyBodyVariant;
|
|
476
|
+
as?: "p" | "span" | "div" | "li" | "td" | "th";
|
|
477
|
+
}
|
|
478
|
+
declare const EasyBody: React.ForwardRefExoticComponent<EasyBodyProps & React.RefAttributes<HTMLElement>>;
|
|
479
|
+
|
|
480
|
+
type EasyLabelVariant = "xsmall" | "small" | "medium" | "large";
|
|
481
|
+
interface EasyLabelProps extends React.LabelHTMLAttributes<HTMLElement> {
|
|
482
|
+
variant?: EasyLabelVariant;
|
|
483
|
+
as?: "label" | "span" | "div" | "p";
|
|
484
|
+
}
|
|
485
|
+
declare const EasyLabel: React.ForwardRefExoticComponent<EasyLabelProps & React.RefAttributes<HTMLElement>>;
|
|
486
|
+
|
|
487
|
+
type EasyHeadingVariant = "xsmall" | "small" | "medium" | "large";
|
|
488
|
+
interface EasyHeadingProps extends React.HTMLAttributes<HTMLElement> {
|
|
489
|
+
variant?: EasyHeadingVariant;
|
|
490
|
+
as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div" | "span";
|
|
491
|
+
}
|
|
492
|
+
declare const EasyHeading: React.ForwardRefExoticComponent<EasyHeadingProps & React.RefAttributes<HTMLElement>>;
|
|
493
|
+
|
|
494
|
+
type EasyDisplayVariant = "xsmall" | "small" | "medium" | "large";
|
|
495
|
+
interface EasyDisplayProps extends React.HTMLAttributes<HTMLElement> {
|
|
496
|
+
variant?: EasyDisplayVariant;
|
|
497
|
+
as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div" | "span";
|
|
498
|
+
}
|
|
499
|
+
declare const EasyDisplay: React.ForwardRefExoticComponent<EasyDisplayProps & React.RefAttributes<HTMLElement>>;
|
|
500
|
+
|
|
501
|
+
declare const EasyTypography: {
|
|
502
|
+
readonly Display: React.ForwardRefExoticComponent<EasyDisplayProps & React.RefAttributes<HTMLElement>>;
|
|
503
|
+
readonly Heading: React.ForwardRefExoticComponent<EasyHeadingProps & React.RefAttributes<HTMLElement>>;
|
|
504
|
+
readonly Label: React.ForwardRefExoticComponent<EasyLabelProps & React.RefAttributes<HTMLElement>>;
|
|
505
|
+
readonly Body: React.ForwardRefExoticComponent<EasyBodyProps & React.RefAttributes<HTMLElement>>;
|
|
506
|
+
};
|
|
507
|
+
|
|
508
|
+
interface EasyErrorMessageProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
509
|
+
title: React.ReactNode;
|
|
510
|
+
description?: React.ReactNode;
|
|
511
|
+
icon?: React.ReactNode;
|
|
512
|
+
}
|
|
513
|
+
declare const EasyErrorMessage: React.ForwardRefExoticComponent<EasyErrorMessageProps & React.RefAttributes<HTMLDivElement>>;
|
|
514
|
+
|
|
515
|
+
type EasyMessageDialogType = "success" | "warning" | "error";
|
|
516
|
+
interface EasyMessageDialogProps {
|
|
517
|
+
type: EasyMessageDialogType;
|
|
518
|
+
title: string;
|
|
519
|
+
message: string;
|
|
520
|
+
open: boolean;
|
|
521
|
+
onClose: () => void;
|
|
522
|
+
buttonText?: string;
|
|
523
|
+
onButtonClick?: () => void;
|
|
524
|
+
}
|
|
525
|
+
declare const EasyMessageDialog: {
|
|
526
|
+
({ type, title, message, open, onClose, buttonText, onButtonClick, }: EasyMessageDialogProps): react_jsx_runtime.JSX.Element;
|
|
527
|
+
displayName: string;
|
|
528
|
+
};
|
|
529
|
+
|
|
530
|
+
type EasySidebarMenuItem = {
|
|
531
|
+
id?: string;
|
|
532
|
+
label: React.ReactNode;
|
|
533
|
+
description?: React.ReactNode;
|
|
534
|
+
icon?: React.ReactNode;
|
|
535
|
+
badge?: React.ReactNode;
|
|
536
|
+
active?: boolean;
|
|
537
|
+
onClick?: () => void;
|
|
538
|
+
};
|
|
539
|
+
interface EasySidebarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
|
|
540
|
+
title?: React.ReactNode;
|
|
541
|
+
description?: React.ReactNode;
|
|
542
|
+
menuItems: EasySidebarMenuItem[];
|
|
543
|
+
}
|
|
544
|
+
declare const EasySidebar: React.ForwardRefExoticComponent<EasySidebarProps & React.RefAttributes<HTMLDivElement>>;
|
|
545
|
+
|
|
546
|
+
declare const tabsListVariants: (props?: ({
|
|
547
|
+
size?: "small" | "large" | "medium" | null | undefined;
|
|
548
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
549
|
+
declare const tabsTriggerVariants: (props?: ({
|
|
550
|
+
size?: "small" | "large" | "medium" | null | undefined;
|
|
551
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
552
|
+
type EasyTabsProps = TabsProps;
|
|
553
|
+
type EasyTabsListProps = React.ComponentPropsWithoutRef<typeof TabsList> & VariantProps<typeof tabsListVariants>;
|
|
554
|
+
type EasyTabsTriggerProps = React.ComponentPropsWithoutRef<typeof TabsTrigger> & VariantProps<typeof tabsTriggerVariants>;
|
|
555
|
+
type EasyTabsContentProps = React.ComponentPropsWithoutRef<typeof TabsContent>;
|
|
556
|
+
declare const EasyTabs: React.ForwardRefExoticComponent<TabsPrimitive.TabsProps & React.RefAttributes<HTMLDivElement>>;
|
|
557
|
+
declare const EasyTabsList: React.ForwardRefExoticComponent<Omit<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & VariantProps<(props?: ({
|
|
558
|
+
size?: "small" | "large" | "medium" | null | undefined;
|
|
559
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
|
|
560
|
+
declare const EasyTabsTrigger: React.ForwardRefExoticComponent<Omit<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
|
|
561
|
+
size?: "small" | "large" | "medium" | null | undefined;
|
|
562
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
|
|
563
|
+
declare const EasyTabsContent: React.ForwardRefExoticComponent<Omit<Omit<TabsPrimitive.TabsContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
564
|
+
|
|
565
|
+
interface EasyBreadcrumbItemType {
|
|
566
|
+
label: string;
|
|
567
|
+
href?: string;
|
|
568
|
+
isActive?: boolean;
|
|
569
|
+
}
|
|
570
|
+
interface EasyBreadcrumbProps {
|
|
571
|
+
items: EasyBreadcrumbItemType[];
|
|
572
|
+
className?: string;
|
|
573
|
+
separator?: React.ReactNode;
|
|
574
|
+
maxItems?: number;
|
|
575
|
+
showHome?: boolean;
|
|
576
|
+
homeLabel?: string;
|
|
577
|
+
homeHref?: string;
|
|
578
|
+
}
|
|
579
|
+
declare function EasyBreadcrumb({ items, className, separator, maxItems, showHome, homeLabel, homeHref, }: EasyBreadcrumbProps): react_jsx_runtime.JSX.Element | null;
|
|
580
|
+
declare namespace EasyBreadcrumb {
|
|
581
|
+
var displayName: string;
|
|
582
|
+
}
|
|
583
|
+
declare function generateBreadcrumbItems(pathname: string): EasyBreadcrumbItemType[];
|
|
584
|
+
|
|
585
|
+
interface EasyPaginationProps {
|
|
586
|
+
/** Total number of items */
|
|
587
|
+
total: number;
|
|
588
|
+
/** Current page number (1-indexed) */
|
|
589
|
+
currentPage: number;
|
|
590
|
+
/** Number of items per page */
|
|
591
|
+
pageSize: number;
|
|
592
|
+
/** Available page size options */
|
|
593
|
+
pageSizeOptions?: number[];
|
|
594
|
+
/** Callback when page changes */
|
|
595
|
+
onPageChange?: (page: number) => void;
|
|
596
|
+
/** Callback when page size changes */
|
|
597
|
+
onPageSizeChange?: (pageSize: number) => void;
|
|
598
|
+
/** Custom labels */
|
|
599
|
+
labels?: {
|
|
600
|
+
perPage?: string;
|
|
601
|
+
goToPage?: string;
|
|
602
|
+
};
|
|
603
|
+
/** Additional className */
|
|
604
|
+
className?: string;
|
|
605
|
+
}
|
|
606
|
+
declare const EasyPagination: React.ForwardRefExoticComponent<EasyPaginationProps & React.RefAttributes<HTMLDivElement>>;
|
|
607
|
+
|
|
608
|
+
interface EasyOtpProps {
|
|
609
|
+
value: string;
|
|
610
|
+
onChange: (value: string) => void;
|
|
611
|
+
length?: number;
|
|
612
|
+
error?: string | null;
|
|
613
|
+
disabled?: boolean;
|
|
614
|
+
autoFocus?: boolean;
|
|
615
|
+
className?: string;
|
|
616
|
+
slotClassName?: string;
|
|
617
|
+
}
|
|
618
|
+
declare const EasyOtp: React.ForwardRefExoticComponent<EasyOtpProps & React.RefAttributes<HTMLDivElement>>;
|
|
619
|
+
declare const formatPhoneNumber: (phone: string) => string;
|
|
620
|
+
declare const formatEmail: (emailAddress: string) => string;
|
|
621
|
+
interface EasyOtpModalProps {
|
|
622
|
+
open: boolean;
|
|
623
|
+
onOpenChange: (open: boolean) => void;
|
|
624
|
+
phoneNumber?: string;
|
|
625
|
+
email?: string;
|
|
626
|
+
title?: string;
|
|
627
|
+
description?: string;
|
|
628
|
+
onVerify: (otpCode: string) => Promise<{
|
|
629
|
+
success: boolean;
|
|
630
|
+
error?: string;
|
|
631
|
+
}>;
|
|
632
|
+
onResend: () => Promise<{
|
|
633
|
+
success: boolean;
|
|
634
|
+
error?: string;
|
|
635
|
+
}>;
|
|
636
|
+
onCancel: () => void;
|
|
637
|
+
length?: number;
|
|
638
|
+
resendCooldown?: number;
|
|
639
|
+
className?: string;
|
|
640
|
+
contentClassName?: string;
|
|
641
|
+
}
|
|
642
|
+
declare const EasyOtpModal: React.FC<EasyOtpModalProps>;
|
|
643
|
+
|
|
644
|
+
interface EasySelectOption {
|
|
645
|
+
label: string;
|
|
646
|
+
value: string;
|
|
647
|
+
disabled?: boolean;
|
|
648
|
+
}
|
|
649
|
+
interface EasySelectProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange"> {
|
|
650
|
+
label?: string;
|
|
651
|
+
bottomSheetLabel?: string;
|
|
652
|
+
helperText?: string;
|
|
653
|
+
errorText?: string;
|
|
654
|
+
placeholder?: string;
|
|
655
|
+
searchPlaceholder?: string;
|
|
656
|
+
emptyMessage?: string;
|
|
657
|
+
options: EasySelectOption[];
|
|
658
|
+
value?: string;
|
|
659
|
+
onValueChange?: (value: string) => void;
|
|
660
|
+
}
|
|
661
|
+
declare const EasySelect: React.ForwardRefExoticComponent<EasySelectProps & React.RefAttributes<HTMLButtonElement>>;
|
|
662
|
+
|
|
663
|
+
interface EasyDatePickerProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "onChange" | "value"> {
|
|
664
|
+
label?: React.ReactNode;
|
|
665
|
+
helperText?: React.ReactNode;
|
|
666
|
+
errorText?: React.ReactNode;
|
|
667
|
+
placeholder?: string;
|
|
668
|
+
/** Seçili tarih (kontrollü kullanım) */
|
|
669
|
+
value?: Date;
|
|
670
|
+
/** Tarih değiştiğinde tetiklenir */
|
|
671
|
+
onChange?: (date: Date | undefined) => void;
|
|
672
|
+
/** Takvimde seçilebilecek en erken tarih */
|
|
673
|
+
fromDate?: Date;
|
|
674
|
+
/** Takvimde seçilebilecek en geç tarih */
|
|
675
|
+
toDate?: Date;
|
|
676
|
+
}
|
|
677
|
+
declare const EasyDatePicker: React.ForwardRefExoticComponent<EasyDatePickerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
678
|
+
|
|
679
|
+
interface UseEasyOtpOptions {
|
|
680
|
+
onVerify: (otpCode: string) => Promise<{
|
|
681
|
+
success: boolean;
|
|
682
|
+
error?: string;
|
|
683
|
+
}>;
|
|
684
|
+
onResend: () => Promise<{
|
|
685
|
+
success: boolean;
|
|
686
|
+
error?: string;
|
|
687
|
+
}>;
|
|
688
|
+
onCancel?: () => void;
|
|
689
|
+
length?: number;
|
|
690
|
+
resendCooldown?: number;
|
|
691
|
+
}
|
|
692
|
+
interface UseEasyOtpReturn {
|
|
693
|
+
open: boolean;
|
|
694
|
+
setOpen: (open: boolean) => void;
|
|
695
|
+
onOpenChange: (open: boolean) => void;
|
|
696
|
+
openOtpModal: () => void;
|
|
697
|
+
closeOtpModal: () => void;
|
|
698
|
+
toggleOtpModal: () => void;
|
|
699
|
+
}
|
|
700
|
+
declare const useEasyOtp: (options?: UseEasyOtpOptions) => UseEasyOtpReturn;
|
|
701
|
+
|
|
702
|
+
export { type DesignTokens, EasyBody, type EasyBodyProps, type EasyBodyVariant, EasyBreadcrumb, type EasyBreadcrumbItemType, EasyButton, type EasyButtonProps, EasyCheckbox, type EasyCheckboxProps, EasyContainer, type EasyContainerProps, EasyDatePicker, type EasyDatePickerProps, EasyDisplay, type EasyDisplayProps, type EasyDisplayVariant, EasyEmailInput, type EasyEmailInputProps, EasyErrorMessage, type EasyErrorMessageProps, EasyHeading, type EasyHeadingProps, type EasyHeadingVariant, EasyLabel, type EasyLabelProps, type EasyLabelVariant, EasyMessageDialog, type EasyMessageDialogProps, type EasyMessageDialogType, EasyOtp, EasyOtpModal, type EasyOtpModalProps, type EasyOtpProps, EasyPagination, type EasyPaginationProps, EasyPasswordInput, type EasyPasswordInputProps, EasyPhoneInput, type EasyPhoneInputProps, EasySelect, type EasySelectOption, type EasySelectProps, EasySidebar, type EasySidebarMenuItem, type EasySidebarProps, EasyTabs, EasyTabsContent, type EasyTabsContentProps, EasyTabsList, type EasyTabsListProps, type EasyTabsProps, EasyTabsTrigger, type EasyTabsTriggerProps, EasyTextInput, type EasyTextInputProps, EasyTypography, Input, type InputProps, type PaletteMode, type SemanticPalette, ShadcnButton, type ShadcnButtonProps, ShadcnCheckbox, type ShadcnCheckboxProps, ShadcnInput, type ShadcnInputProps, Tabs, TabsContent, TabsList, type TabsProps, TabsTrigger, ThemeProvider, type TypographyToken, type TypographyVariant, type UseEasyOtpOptions, type UseEasyOtpReturn, breakpoints, easyButtonVariants as buttonVariants, cn, colorPalette, containerVariants, designTokens, easyButtonVariants, elevations, formatEmail, formatPhoneNumber, formatPhoneNumberWithPattern, generateBreadcrumbItems, getTypographyClass, primitiveColors, radii, semanticColors, shadcnButtonVariants, spacingScale, typographyClasses, typographyScale, typographyTokens, useEasyOtp, useTheme };
|