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.js ADDED
@@ -0,0 +1,4035 @@
1
+ // src/theme/tokens.ts
2
+ var createStep = (size, lineHeight, fontWeight = 500, letterSpacing) => ({
3
+ fontSize: size,
4
+ lineHeight,
5
+ fontWeight,
6
+ letterSpacing
7
+ });
8
+ var typographyScale = {
9
+ // Display variants
10
+ "display-xsmall": createStep("32px", "40px", 400, "-1px"),
11
+ "display-small": createStep("36px", "44px", 400, "-1.16px"),
12
+ "display-medium": createStep("40px", "48px", 400, "-1.24px"),
13
+ "display-large": createStep("48px", "56px", 400, "-1.32px"),
14
+ // Heading variants
15
+ "heading-xsmall": createStep("12px", "16px", 400, "-0.24px"),
16
+ "heading-small": createStep("16px", "24px", 400, "-0.40px"),
17
+ "heading-medium": createStep("18px", "28px", 400, "-0.48px"),
18
+ "heading-large": createStep("20px", "32px", 400, "-0.56px"),
19
+ // Label variants
20
+ "label-xsmall": createStep("12px", "16px", 400, "-0.24px"),
21
+ "label-small": createStep("14px", "20px", 400, "-0.48px"),
22
+ "label-medium": createStep("18px", "24px", 400, "-0.56px"),
23
+ "label-large": createStep("20px", "28px", 400, "-0.64px"),
24
+ // Body variants
25
+ "body-xsmall": createStep("12px", "16px", 400, "-0.24px"),
26
+ "body-small": createStep("14px", "20px", 400, "-0.48px"),
27
+ "body-medium": createStep("16px", "24px", 400, "-0.56px"),
28
+ "body-large": createStep("18px", "28px", 400, "-0.64px")
29
+ };
30
+ var semanticColors = {
31
+ text: {
32
+ 900: "#111927",
33
+ 600: "#4d5761",
34
+ 500: "#6c737f",
35
+ 400: "#9da4ae",
36
+ 0: "#ffffff"
37
+ },
38
+ background: {
39
+ 900: "#111927",
40
+ 700: "#384250",
41
+ 200: "#e5e7eb",
42
+ 100: "#f3f4f6",
43
+ 50: "#f9fafb",
44
+ 0: "#ffffff"
45
+ },
46
+ border: {
47
+ 900: "#111927",
48
+ 300: "#d2d6da",
49
+ 200: "#e5e7eb",
50
+ 0: "#ffffff"
51
+ },
52
+ icon: {
53
+ 900: "#111927",
54
+ 600: "#4d5761",
55
+ 500: "#6c737f",
56
+ 400: "#9da4ae",
57
+ 0: "#ffffff"
58
+ },
59
+ primary: {
60
+ 900: "#0e391f",
61
+ 700: "#248a4b",
62
+ 500: "#2fb563",
63
+ 300: "#acd38d",
64
+ 100: "#eaf4e1"
65
+ },
66
+ success: {
67
+ dark: "#1b7f3c",
68
+ base: "#29c95f",
69
+ light: "#c3ffd6",
70
+ lighter: "#f5fff7"
71
+ },
72
+ warning: {
73
+ dark: "#996004",
74
+ base: "#f7bb0a",
75
+ light: "#ffefc7",
76
+ lighter: "#fffaea"
77
+ },
78
+ danger: {
79
+ dark: "#c92b2a",
80
+ base: "#e93534",
81
+ light: "#ffdbdb",
82
+ lighter: "#fffafa"
83
+ }
84
+ };
85
+ var primitiveColors = {
86
+ neutral: {
87
+ 900: "#111927",
88
+ 800: "#1f2a37",
89
+ 700: "#384250",
90
+ 600: "#4d5761",
91
+ 500: "#6c737f",
92
+ 400: "#9da4ae",
93
+ 300: "#d2d6db",
94
+ 200: "#e5e7eb",
95
+ 100: "#f3f4f6",
96
+ 0: "#ffffff"
97
+ },
98
+ blue: {
99
+ dark: "#1b6480",
100
+ base: "#00aeef",
101
+ light: "#c2eeff",
102
+ lighter: "#f5fcff"
103
+ },
104
+ cabir: {
105
+ yellow: "#ffce04",
106
+ carbonDark: "#231f20"
107
+ },
108
+ decorative: {
109
+ green: "#ebf5f0"
110
+ }
111
+ };
112
+ var colorPalette = {
113
+ light: {
114
+ background: "210 20% 98%",
115
+ foreground: "218 39% 11%",
116
+ primary: "143 59% 45%",
117
+ "primary-foreground": "0 0% 100%",
118
+ secondary: "220 13% 91%",
119
+ "secondary-foreground": "218 39% 11%",
120
+ accent: "196 100% 88%",
121
+ "accent-foreground": "196 63% 31%",
122
+ destructive: "0 80% 56%",
123
+ "destructive-foreground": "0 0% 100%",
124
+ muted: "220 14% 96%",
125
+ "muted-foreground": "215 9% 65%",
126
+ border: "220 13% 91%",
127
+ input: "220 13% 91%",
128
+ ring: "143 59% 45%",
129
+ success: "140 66% 47%",
130
+ "success-foreground": "0 0% 100%",
131
+ warning: "45 94% 50%",
132
+ "warning-foreground": "37 95% 31%",
133
+ info: "193 100% 47%",
134
+ "info-foreground": "0 0% 100%",
135
+ card: "0 0% 100%",
136
+ "card-foreground": "218 39% 11%"
137
+ },
138
+ dark: {
139
+ background: "218 39% 11%",
140
+ foreground: "0 0% 100%",
141
+ primary: "93 44% 69%",
142
+ "primary-foreground": "144 61% 14%",
143
+ secondary: "215 18% 27%",
144
+ "secondary-foreground": "0 0% 100%",
145
+ accent: "196 63% 31%",
146
+ "accent-foreground": "0 0% 100%",
147
+ destructive: "0 65% 48%",
148
+ "destructive-foreground": "0 0% 100%",
149
+ muted: "215 18% 27%",
150
+ "muted-foreground": "215 9% 65%",
151
+ border: "210 10% 84%",
152
+ input: "210 10% 84%",
153
+ ring: "93 44% 69%",
154
+ success: "139 100% 88%",
155
+ "success-foreground": "140 65% 30%",
156
+ warning: "43 100% 89%",
157
+ "warning-foreground": "37 95% 31%",
158
+ info: "196 100% 88%",
159
+ "info-foreground": "196 63% 31%",
160
+ card: "215 18% 27%",
161
+ "card-foreground": "0 0% 100%"
162
+ }
163
+ };
164
+ var spacingScale = {
165
+ 0: "0",
166
+ 1: "0.25rem",
167
+ 2: "0.5rem",
168
+ 3: "0.75rem",
169
+ 4: "1rem",
170
+ 5: "1.5rem",
171
+ 6: "2rem",
172
+ 7: "3rem",
173
+ 8: "4rem"
174
+ };
175
+ var radii = {
176
+ sm: "0.375rem",
177
+ md: "0.5rem",
178
+ lg: "0.75rem",
179
+ full: "999px"
180
+ };
181
+ var elevations = {
182
+ xs: "0 1px 2px rgb(15 23 42 / 0.05)",
183
+ sm: "0 2px 4px rgb(15 23 42 / 0.08)",
184
+ md: "0 8px 15px rgb(15 23 42 / 0.12)",
185
+ lg: "0 16px 30px rgb(15 23 42 / 0.15)",
186
+ xl: "0 25px 50px -12px rgb(15 23 42 / 0.25)"
187
+ };
188
+ var breakpoints = {
189
+ xs: 360,
190
+ sm: 640,
191
+ md: 768,
192
+ lg: 1024,
193
+ xl: 1280,
194
+ "2xl": 1536
195
+ };
196
+ var designTokens = {
197
+ typography: typographyScale,
198
+ colors: {
199
+ semantic: semanticColors,
200
+ primitives: primitiveColors,
201
+ modes: colorPalette,
202
+ gradients: {
203
+ border: "linear-gradient(135deg, var(--ui-cabir-yellow), var(--ui-primary))",
204
+ borderReverse: "linear-gradient(90deg, var(--ui-primary), var(--ui-cabir-yellow))",
205
+ overlay: "linear-gradient(180deg, rgba(47, 181, 99, 0) 5.61%, var(--ui-cabir-yellow) 100%)"
206
+ }
207
+ },
208
+ spacing: spacingScale,
209
+ radii,
210
+ elevations,
211
+ breakpoints
212
+ };
213
+
214
+ // src/lib/utils.ts
215
+ import { clsx } from "clsx";
216
+ import { twMerge } from "tailwind-merge";
217
+ function cn(...inputs) {
218
+ return twMerge(clsx(inputs));
219
+ }
220
+ function formatPhoneNumberWithPattern(value, format2) {
221
+ const numbers = value.replace(/\D/g, "");
222
+ let formatted = "";
223
+ let numberIndex = 0;
224
+ for (let i = 0; i < format2.length && numberIndex < numbers.length; i++) {
225
+ if (format2[i] === "#") {
226
+ formatted += numbers[numberIndex];
227
+ numberIndex++;
228
+ } else {
229
+ formatted += format2[i];
230
+ }
231
+ }
232
+ return formatted;
233
+ }
234
+
235
+ // src/theme/typography.ts
236
+ var typographyClasses = {
237
+ // Display variants
238
+ "display-xsmall": "text-[32px] leading-[40px] tracking-[-1px] font-normal",
239
+ "display-small": "text-[36px] leading-[44px] tracking-[-1.16px] font-normal",
240
+ "display-medium": "text-[40px] leading-[48px] tracking-[-1.24px] font-normal",
241
+ "display-large": "text-[48px] leading-[56px] tracking-[-1.32px] font-normal",
242
+ // Heading variants
243
+ "heading-xsmall": "text-[12px] leading-[16px] tracking-[-0.24px] font-normal",
244
+ "heading-small": "text-[16px] leading-[24px] tracking-[-0.40px] font-normal",
245
+ "heading-medium": "text-[18px] leading-[28px] tracking-[-0.48px] font-normal",
246
+ "heading-large": "text-[20px] leading-[32px] tracking-[-0.56px] font-normal",
247
+ // Label variants
248
+ "label-xsmall": "text-[12px] leading-[16px] tracking-[-0.24px] font-normal",
249
+ "label-small": "text-[14px] leading-[20px] tracking-[-0.48px] font-normal",
250
+ "label-medium": "text-[18px] leading-[24px] tracking-[-0.56px] font-normal",
251
+ "label-large": "text-[20px] leading-[28px] tracking-[-0.64px] font-normal",
252
+ // Body variants
253
+ "body-xsmall": "text-[12px] leading-[16px] tracking-[-0.24px] font-normal",
254
+ "body-small": "text-[14px] leading-[20px] tracking-[-0.48px] font-normal",
255
+ "body-medium": "text-[16px] leading-[24px] tracking-[-0.56px] font-normal",
256
+ "body-large": "text-[18px] leading-[28px] tracking-[-0.64px] font-normal"
257
+ };
258
+ var getTypographyClass = (variant, additional) => cn(typographyClasses[variant], additional);
259
+ var typographyTokens = typographyScale;
260
+
261
+ // src/theme/provider.tsx
262
+ import { createContext, useCallback, useContext, useEffect, useMemo, useState } from "react";
263
+ import { jsx } from "react/jsx-runtime";
264
+ var STORAGE_KEY = "ui-theme";
265
+ var ThemeContext = createContext(void 0);
266
+ var getPreferredMode = () => {
267
+ if (typeof window === "undefined") return "light";
268
+ const stored = window.localStorage.getItem(STORAGE_KEY);
269
+ if (stored && ["light", "dark"].includes(stored)) {
270
+ return stored;
271
+ }
272
+ const media = window.matchMedia("(prefers-color-scheme: dark)");
273
+ return media.matches ? "dark" : "light";
274
+ };
275
+ var applyModeToDocument = (mode) => {
276
+ if (typeof document === "undefined") return;
277
+ document.documentElement.dataset.uiTheme = mode;
278
+ Object.entries(colorPalette[mode]).forEach(([token, value]) => {
279
+ document.documentElement.style.setProperty(`--ui-${token}`, value);
280
+ });
281
+ };
282
+ var ThemeProvider = ({
283
+ children,
284
+ initialMode = "light"
285
+ }) => {
286
+ const [mode, setModeState] = useState(() => initialMode);
287
+ useEffect(() => {
288
+ const preferred = getPreferredMode();
289
+ setModeState(preferred);
290
+ }, []);
291
+ useEffect(() => {
292
+ applyModeToDocument(mode);
293
+ if (typeof window !== "undefined") {
294
+ window.localStorage.setItem(STORAGE_KEY, mode);
295
+ }
296
+ }, [mode]);
297
+ const setMode = useCallback((next) => {
298
+ setModeState(next);
299
+ }, []);
300
+ const toggleMode = useCallback(() => {
301
+ setModeState((prev) => prev === "light" ? "dark" : "light");
302
+ }, []);
303
+ const value = useMemo(() => ({ mode, setMode, toggleMode }), [mode, setMode, toggleMode]);
304
+ return /* @__PURE__ */ jsx(ThemeContext.Provider, { value, children });
305
+ };
306
+ var useTheme = () => {
307
+ const ctx = useContext(ThemeContext);
308
+ if (!ctx) {
309
+ throw new Error("useTheme must be used within a ThemeProvider");
310
+ }
311
+ return ctx;
312
+ };
313
+
314
+ // src/components/ui/button.tsx
315
+ import * as React from "react";
316
+ import { Slot } from "@radix-ui/react-slot";
317
+ import { cva } from "class-variance-authority";
318
+ import { jsx as jsx2 } from "react/jsx-runtime";
319
+ var shadcnButtonVariants = cva(
320
+ "",
321
+ {
322
+ variants: {
323
+ variant: {
324
+ link: "text-primary underline-offset-4 hover:underline"
325
+ },
326
+ size: {
327
+ icon: "h-10 w-10"
328
+ }
329
+ },
330
+ defaultVariants: {
331
+ variant: "link",
332
+ size: "icon"
333
+ }
334
+ }
335
+ );
336
+ var ShadcnButton = React.forwardRef(
337
+ ({ className, variant, size, asChild = false, ...props }, ref) => {
338
+ const Comp = asChild ? Slot : "button";
339
+ return /* @__PURE__ */ jsx2(
340
+ Comp,
341
+ {
342
+ className: cn(shadcnButtonVariants({ variant, size }), className),
343
+ ref,
344
+ ...props
345
+ }
346
+ );
347
+ }
348
+ );
349
+ ShadcnButton.displayName = "ShadcnButton";
350
+
351
+ // src/components/ui/input.tsx
352
+ import * as React2 from "react";
353
+ import { jsx as jsx3 } from "react/jsx-runtime";
354
+ var ShadcnInput = React2.forwardRef(
355
+ ({ className, type = "text", ...props }, ref) => {
356
+ return /* @__PURE__ */ jsx3(
357
+ "input",
358
+ {
359
+ type,
360
+ className: cn(
361
+ "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm transition-colors",
362
+ "file:border-0 file:bg-transparent file:text-sm file:font-medium",
363
+ "placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
364
+ className
365
+ ),
366
+ ref,
367
+ ...props
368
+ }
369
+ );
370
+ }
371
+ );
372
+ ShadcnInput.displayName = "ShadcnInput";
373
+
374
+ // src/components/ui/checkbox.tsx
375
+ import * as React3 from "react";
376
+ import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
377
+ import { Check } from "lucide-react";
378
+ import { jsx as jsx4 } from "react/jsx-runtime";
379
+ var ShadcnCheckbox = React3.forwardRef(({ className, ...props }, ref) => {
380
+ return /* @__PURE__ */ jsx4(
381
+ CheckboxPrimitive.Root,
382
+ {
383
+ ref,
384
+ className: cn(
385
+ "peer inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-[4px] border border-input bg-background",
386
+ "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
387
+ "disabled:cursor-not-allowed disabled:opacity-50",
388
+ "data-[state=checked]:bg-primary data-[state=checked]:border-primary",
389
+ className
390
+ ),
391
+ ...props,
392
+ children: /* @__PURE__ */ jsx4(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center text-white", children: /* @__PURE__ */ jsx4(Check, { className: "h-3 w-3" }) })
393
+ }
394
+ );
395
+ });
396
+ ShadcnCheckbox.displayName = "ShadcnCheckbox";
397
+
398
+ // src/components/ui/tabs.tsx
399
+ import * as React4 from "react";
400
+ import * as TabsPrimitive from "@radix-ui/react-tabs";
401
+ import { jsx as jsx5 } from "react/jsx-runtime";
402
+ var Tabs = TabsPrimitive.Root;
403
+ var TabsList = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
404
+ TabsPrimitive.List,
405
+ {
406
+ ref,
407
+ className: cn(
408
+ "inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground",
409
+ className
410
+ ),
411
+ ...props
412
+ }
413
+ ));
414
+ TabsList.displayName = TabsPrimitive.List.displayName;
415
+ var TabsTrigger = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
416
+ TabsPrimitive.Trigger,
417
+ {
418
+ ref,
419
+ className: cn(
420
+ "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
421
+ className
422
+ ),
423
+ ...props
424
+ }
425
+ ));
426
+ TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
427
+ var TabsContent = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
428
+ TabsPrimitive.Content,
429
+ {
430
+ ref,
431
+ className: cn(
432
+ "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
433
+ className
434
+ ),
435
+ ...props
436
+ }
437
+ ));
438
+ TabsContent.displayName = TabsPrimitive.Content.displayName;
439
+
440
+ // src/components/easy/button.tsx
441
+ import * as React5 from "react";
442
+ import { cva as cva2 } from "class-variance-authority";
443
+ import { jsx as jsx6 } from "react/jsx-runtime";
444
+ var baseFocusRing = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--ui-background)]";
445
+ var easyButtonVariants = cva2(
446
+ "text-white w-full inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-lg text-base font-medium leading-6 tracking-[-0.56px] transition-all disabled:pointer-events-none disabled:opacity-60 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 hover:no-underline",
447
+ {
448
+ variants: {
449
+ variant: {
450
+ text: "bg-transparent text-[var(--ui-text-600)] hover:text-[var(--ui-text-900)] disabled:text-[var(--ui-text-400)]",
451
+ primary: "bg-[var(--ui-primary-500)] hover:bg-[var(--ui-primary-700)] disabled:bg-[var(--ui-background-200)] disabled:text-[var(--ui-text-400)]",
452
+ important: "bg-[var(--ui-background-900)] text-white hover:bg-[var(--ui-background-700)] disabled:bg-[var(--ui-background-100)] disabled:text-[var(--ui-text-400)]",
453
+ gradient: "text-white bg-[var(--ui-gradient-border)]",
454
+ loginbutton: "bg-white border border-[var(--ui-border-200)] text-[var(--ui-primary)] hover:border-transparent",
455
+ editbutton: "bg-[var(--ui-blue-base)] text-white text-[14px] hover:bg-[var(--ui-blue-dark)]"
456
+ },
457
+ appearance: {
458
+ filled: baseFocusRing,
459
+ stroke: "bg-[var(--ui-background-0)] border border-[var(--ui-primary)] text-[var(--ui-primary)] " + baseFocusRing,
460
+ light: "bg-[var(--ui-primary-100)] text-[var(--ui-primary)] " + baseFocusRing
461
+ },
462
+ size: {
463
+ default: "h-12 px-4 py-3 rounded-lg has-[>svg]:px-4",
464
+ large: "h-12 px-6 py-3 rounded-[10px] has-[>svg]:px-4",
465
+ medium: "h-10 px-6 py-2 rounded-lg has-[>svg]:px-4",
466
+ small: "h-8 px-4 py-1 rounded-sm has-[>svg]:px-2 text-sm",
467
+ icon: "size-9 rounded-md"
468
+ }
469
+ },
470
+ compoundVariants: [
471
+ {
472
+ variant: "primary",
473
+ appearance: "stroke",
474
+ class: "hover:bg-[var(--ui-primary)] hover:text-[var(--ui-primary-foreground)]"
475
+ },
476
+ {
477
+ variant: "primary",
478
+ appearance: "light",
479
+ class: "hover:bg-[var(--ui-primary)] hover:text-[var(--ui-primary-foreground)]"
480
+ },
481
+ {
482
+ variant: "important",
483
+ appearance: "stroke",
484
+ class: "border border-[var(--ui-background-200)] text-[var(--ui-background-900)] hover:bg-[var(--ui-background-700)] hover:text-white"
485
+ },
486
+ {
487
+ variant: "important",
488
+ appearance: "light",
489
+ class: "bg-[var(--ui-background-100)] border border-[var(--ui-background-200)] text-[var(--ui-background-900)] hover:bg-[var(--ui-background-700)] hover:text-white hover:border-transparent"
490
+ },
491
+ {
492
+ variant: "gradient",
493
+ appearance: "stroke",
494
+ class: "border border-[var(--ui-primary)] text-[var(--ui-primary)] hover:text-white hover:bg-[var(--ui-gradient-border)]"
495
+ },
496
+ {
497
+ variant: "gradient",
498
+ appearance: "light",
499
+ class: "bg-[var(--ui-primary-100)] text-[var(--ui-primary)] hover:bg-[var(--ui-gradient-border)] hover:text-white"
500
+ }
501
+ ],
502
+ defaultVariants: {
503
+ variant: "primary",
504
+ appearance: "filled",
505
+ size: "large"
506
+ }
507
+ }
508
+ );
509
+ var EasyButton = React5.forwardRef(
510
+ ({ className, variant, appearance, size, asChild = false, children, ...props }, ref) => {
511
+ return /* @__PURE__ */ jsx6(
512
+ ShadcnButton,
513
+ {
514
+ "data-slot": "button",
515
+ ref,
516
+ asChild,
517
+ className: cn("cursor-pointer", easyButtonVariants({ variant, appearance, size }), className),
518
+ ...props,
519
+ children
520
+ }
521
+ );
522
+ }
523
+ );
524
+ EasyButton.displayName = "EasyButton";
525
+
526
+ // src/components/easy/input/input.tsx
527
+ import * as React6 from "react";
528
+ import { jsx as jsx7 } from "react/jsx-runtime";
529
+ var baseInputClasses = "flex h-12 w-full rounded-[var(--ui-radius-lg)] border border-[var(--ui-border-200)] bg-[var(--ui-background-0)] px-4 py-3 text-base font-medium text-[var(--ui-text-900)] placeholder:text-[var(--ui-text-400)] transition-all";
530
+ var focusClasses = "focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 focus-visible:shadow-[0_0_0_1px_var(--ui-background-0),_0_0_0_2px_var(--ui-border-200)]";
531
+ var invalidClasses = "aria-[invalid='true']:border-[var(--ui-danger-base)] aria-[invalid='true']:focus-visible:shadow-[0_0_0_1px_var(--ui-background-0),_0_0_0_2px_var(--ui-danger-light)]";
532
+ var disabledClasses = "disabled:cursor-not-allowed disabled:bg-[var(--ui-background-100)] disabled:text-[var(--ui-text-400)]";
533
+ var Input = React6.forwardRef(
534
+ ({ className, invalid, type = "text", ...props }, ref) => {
535
+ return /* @__PURE__ */ jsx7(
536
+ ShadcnInput,
537
+ {
538
+ type,
539
+ ref,
540
+ className: cn(baseInputClasses, focusClasses, invalidClasses, disabledClasses, className),
541
+ "aria-invalid": invalid,
542
+ ...props
543
+ }
544
+ );
545
+ }
546
+ );
547
+ Input.displayName = "Input";
548
+
549
+ // src/components/easy/input/email-input.tsx
550
+ import * as React7 from "react";
551
+ import { AlertCircle } from "lucide-react";
552
+ import { jsx as jsx8, jsxs } from "react/jsx-runtime";
553
+ var EasyEmailInput = React7.forwardRef(
554
+ ({
555
+ className,
556
+ label,
557
+ helperText,
558
+ errorText,
559
+ id,
560
+ name,
561
+ placeholder = "ornek@email.com",
562
+ onChange,
563
+ ...props
564
+ }, ref) => {
565
+ const generatedId = React7.useId();
566
+ const inputId = id ?? generatedId;
567
+ const helperId = helperText && !errorText ? `${inputId}-helper` : void 0;
568
+ const errorId = errorText ? `${inputId}-error` : void 0;
569
+ const [isFocused, setIsFocused] = React7.useState(false);
570
+ const handleChange = (event) => {
571
+ const normalizedValue = event.target.value.toLowerCase().trim();
572
+ event.target.value = normalizedValue;
573
+ onChange?.(event);
574
+ };
575
+ return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-1.5", children: [
576
+ label && /* @__PURE__ */ jsx8(
577
+ "label",
578
+ {
579
+ htmlFor: inputId,
580
+ className: "text-base font-medium text-[var(--ui-text-900)]",
581
+ children: label
582
+ }
583
+ ),
584
+ /* @__PURE__ */ jsx8(
585
+ Input,
586
+ {
587
+ ref,
588
+ id: inputId,
589
+ name: name ?? inputId,
590
+ type: "email",
591
+ placeholder,
592
+ autoComplete: "email",
593
+ inputMode: "email",
594
+ onFocus: (event) => {
595
+ setIsFocused(true);
596
+ props.onFocus?.(event);
597
+ },
598
+ onBlur: (event) => {
599
+ setIsFocused(false);
600
+ props.onBlur?.(event);
601
+ },
602
+ onChange: handleChange,
603
+ className: cn(
604
+ "placeholder:text-[var(--ui-text-400)]",
605
+ !isFocused && "hover:bg-[var(--ui-background-100)]",
606
+ isFocused && !errorText && "border-[var(--ui-border-900)]",
607
+ errorText && "border-[var(--ui-danger-base)] focus-visible:ring-[var(--ui-danger-base)] focus-visible:ring-offset-0",
608
+ !errorText && "focus-visible:shadow-[0_0_0_2px_var(--ui-background-0),_0_0_0_4px_var(--ui-border-200)]",
609
+ errorText && "focus-visible:shadow-[0_0_0_2px_var(--ui-background-0),_0_0_0_4px_var(--ui-danger-light)]",
610
+ className
611
+ ),
612
+ "aria-invalid": Boolean(errorText),
613
+ "aria-describedby": errorId ?? helperId,
614
+ ...props
615
+ }
616
+ ),
617
+ errorText ? /* @__PURE__ */ jsxs(
618
+ "p",
619
+ {
620
+ id: errorId,
621
+ className: "flex items-center gap-1 text-sm text-[var(--ui-danger-base)]",
622
+ children: [
623
+ /* @__PURE__ */ jsx8(AlertCircle, { className: "size-4" }),
624
+ errorText
625
+ ]
626
+ }
627
+ ) : helperText ? /* @__PURE__ */ jsx8("p", { id: helperId, className: "text-sm text-[var(--ui-text-500)]", children: helperText }) : null
628
+ ] });
629
+ }
630
+ );
631
+ EasyEmailInput.displayName = "EasyEmailInput";
632
+
633
+ // src/components/easy/input/password-input.tsx
634
+ import * as React8 from "react";
635
+ import { Eye, EyeOff, AlertCircle as AlertCircle2 } from "lucide-react";
636
+ import { jsx as jsx9, jsxs as jsxs2 } from "react/jsx-runtime";
637
+ var EasyPasswordInput = React8.forwardRef(
638
+ ({
639
+ className,
640
+ label,
641
+ helperText,
642
+ helperIcon,
643
+ errorText,
644
+ errorIcon = /* @__PURE__ */ jsx9(AlertCircle2, { className: "size-4" }),
645
+ id,
646
+ name,
647
+ ...props
648
+ }, ref) => {
649
+ const generatedId = React8.useId();
650
+ const inputId = id ?? generatedId;
651
+ const normalizedErrors = React8.useMemo(() => {
652
+ if (!errorText) return [];
653
+ return Array.isArray(errorText) ? errorText : [errorText];
654
+ }, [errorText]);
655
+ const hasErrors = normalizedErrors.length > 0;
656
+ const helperId = helperText && !hasErrors ? `${inputId}-helper` : void 0;
657
+ const errorId = hasErrors ? `${inputId}-error` : void 0;
658
+ const [showPassword, setShowPassword] = React8.useState(false);
659
+ const [isFocused, setIsFocused] = React8.useState(false);
660
+ const toggleVisibility = () => setShowPassword((prev) => !prev);
661
+ return /* @__PURE__ */ jsxs2("div", { className: "flex w-full flex-col gap-1.5", children: [
662
+ label && /* @__PURE__ */ jsx9(
663
+ "label",
664
+ {
665
+ htmlFor: inputId,
666
+ className: "text-base font-medium text-[var(--ui-text-900)]",
667
+ children: label
668
+ }
669
+ ),
670
+ /* @__PURE__ */ jsxs2("div", { className: "relative", children: [
671
+ /* @__PURE__ */ jsx9(
672
+ Input,
673
+ {
674
+ ref,
675
+ id: inputId,
676
+ name: name ?? inputId,
677
+ type: showPassword ? "text" : "password",
678
+ autoComplete: "current-password",
679
+ onFocus: (event) => {
680
+ setIsFocused(true);
681
+ props.onFocus?.(event);
682
+ },
683
+ onBlur: (event) => {
684
+ setIsFocused(false);
685
+ props.onBlur?.(event);
686
+ },
687
+ className: cn(
688
+ "pr-12 placeholder:text-[var(--ui-text-400)]",
689
+ !isFocused && "hover:bg-[var(--ui-background-100)]",
690
+ isFocused && !hasErrors && "border-[var(--ui-border-900)]",
691
+ hasErrors && "border-[var(--ui-danger-base)] focus-visible:ring-[var(--ui-danger-base)] focus-visible:ring-offset-0",
692
+ !hasErrors && "focus-visible:shadow-[0_0_0_2px_var(--ui-background-0),_0_0_0_4px_var(--ui-border-200)]",
693
+ hasErrors && "focus-visible:shadow-[0_0_0_2px_var(--ui-background-0),_0_0_0_4px_var(--ui-danger-light)]",
694
+ className
695
+ ),
696
+ "aria-invalid": hasErrors,
697
+ "aria-describedby": errorId ?? helperId,
698
+ ...props
699
+ }
700
+ ),
701
+ /* @__PURE__ */ jsx9(
702
+ "button",
703
+ {
704
+ type: "button",
705
+ onClick: toggleVisibility,
706
+ className: "absolute right-3 top-1/2 -translate-y-1/2 inline-flex h-6 w-6 items-center justify-center text-[var(--ui-text-500)] transition-colors hover:text-[var(--ui-text-900)]",
707
+ tabIndex: -1,
708
+ "aria-label": showPassword ? "\u015Eifreyi gizle" : "\u015Eifreyi g\xF6ster",
709
+ children: showPassword ? /* @__PURE__ */ jsx9(EyeOff, { className: "size-5" }) : /* @__PURE__ */ jsx9(Eye, { className: "size-5" })
710
+ }
711
+ )
712
+ ] }),
713
+ hasErrors ? /* @__PURE__ */ jsx9(
714
+ "div",
715
+ {
716
+ id: errorId,
717
+ className: "flex flex-col gap-1 text-sm text-[var(--ui-danger-base)]",
718
+ children: normalizedErrors.map((text, index) => /* @__PURE__ */ jsxs2("p", { className: "flex items-center gap-1", children: [
719
+ errorIcon,
720
+ text
721
+ ] }, index))
722
+ }
723
+ ) : helperText ? /* @__PURE__ */ jsxs2(
724
+ "p",
725
+ {
726
+ id: helperId,
727
+ className: "flex items-center gap-1 text-sm text-[var(--ui-text-500)]",
728
+ children: [
729
+ helperIcon,
730
+ helperText
731
+ ]
732
+ }
733
+ ) : null
734
+ ] });
735
+ }
736
+ );
737
+ EasyPasswordInput.displayName = "EasyPasswordInput";
738
+
739
+ // src/components/easy/input/phone-input.tsx
740
+ import * as React9 from "react";
741
+ import { AlertCircle as AlertCircle3 } from "lucide-react";
742
+ import { jsx as jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
743
+ var phoneFormat = "(###) ### ## ##";
744
+ var phonePlaceholder = "(5xx) xxx xx xx";
745
+ var EasyPhoneInput = React9.forwardRef(
746
+ ({
747
+ className,
748
+ label,
749
+ helperText,
750
+ errorText,
751
+ value = "",
752
+ onChange,
753
+ id,
754
+ name,
755
+ actionButton,
756
+ disabled,
757
+ ...props
758
+ }, ref) => {
759
+ const generatedId = React9.useId();
760
+ const inputId = id ?? generatedId;
761
+ const helperId = helperText && !errorText ? `${inputId}-helper` : void 0;
762
+ const errorId = errorText ? `${inputId}-error` : void 0;
763
+ const [isFocused, setIsFocused] = React9.useState(false);
764
+ const formattedValue = React9.useMemo(() => {
765
+ if (!value) return "";
766
+ const numbersOnly = value.replace(/\D/g, "");
767
+ return formatPhoneNumberWithPattern(numbersOnly, phoneFormat);
768
+ }, [value]);
769
+ const handleInputChange = (e) => {
770
+ const inputValue = e.target.value;
771
+ const numbersOnly = inputValue.replace(/\D/g, "");
772
+ const formatted = formatPhoneNumberWithPattern(numbersOnly, phoneFormat);
773
+ onChange?.(formatted);
774
+ };
775
+ const handleFocus = () => {
776
+ setIsFocused(true);
777
+ };
778
+ const handleBlur = () => {
779
+ setIsFocused(false);
780
+ };
781
+ return /* @__PURE__ */ jsxs3("div", { className: "flex w-full flex-col gap-1.5", children: [
782
+ label && /* @__PURE__ */ jsx10(
783
+ "label",
784
+ {
785
+ htmlFor: inputId,
786
+ className: "text-base font-medium text-[var(--ui-text-900)]",
787
+ children: label
788
+ }
789
+ ),
790
+ /* @__PURE__ */ jsx10("div", { className: "relative", children: /* @__PURE__ */ jsxs3(
791
+ "div",
792
+ {
793
+ className: cn(
794
+ "flex h-12 rounded-lg border bg-[var(--ui-background-0)] transition-all duration-200 overflow-hidden",
795
+ errorText ? "border-[var(--ui-danger-base)]" : "border-[var(--ui-border-200)]",
796
+ isFocused && !errorText && "border-[var(--ui-border-900)] shadow-[0_0_0_2px_var(--ui-background-0),_0_0_0_4px_var(--ui-border-200)]",
797
+ isFocused && errorText && "border-[var(--ui-danger-base)] shadow-[0_0_0_2px_var(--ui-background-0),_0_0_0_4px_var(--ui-danger-light)]",
798
+ disabled && "cursor-not-allowed opacity-50",
799
+ !isFocused && !disabled && "hover:bg-[var(--ui-background-100)]",
800
+ className
801
+ ),
802
+ children: [
803
+ /* @__PURE__ */ jsxs3("div", { className: "px-3 py-3 flex items-center gap-2 rounded-l-lg border-r border-[var(--ui-border-200)]", children: [
804
+ /* @__PURE__ */ jsx10("span", { className: "text-lg", children: "\u{1F1F9}\u{1F1F7}" }),
805
+ /* @__PURE__ */ jsx10("span", { className: "text-base font-medium", children: "(+90)" })
806
+ ] }),
807
+ /* @__PURE__ */ jsx10(
808
+ Input,
809
+ {
810
+ ref,
811
+ type: "tel",
812
+ name: name ?? inputId,
813
+ id: inputId,
814
+ value: formattedValue,
815
+ onChange: handleInputChange,
816
+ onFocus: handleFocus,
817
+ onBlur: handleBlur,
818
+ placeholder: phonePlaceholder,
819
+ className: cn(
820
+ "h-full rounded-none px-4 py-3 text-base flex-1 border-0 focus-visible:ring-0 focus-visible:ring-offset-0 bg-transparent",
821
+ actionButton ? "rounded-l-none" : "rounded-r-lg",
822
+ "[&::-webkit-autofill]:!bg-transparent [&::-webkit-autofill]:!shadow-none [&::-webkit-autofill]:!text-current"
823
+ ),
824
+ style: { fontSize: "16px" },
825
+ "aria-invalid": Boolean(errorText),
826
+ "aria-describedby": errorId ?? helperId,
827
+ disabled,
828
+ ...props
829
+ }
830
+ ),
831
+ actionButton && /* @__PURE__ */ jsx10("div", { className: "flex items-center pr-1.5 pl-2 border-l border-[var(--ui-border-200)]", children: actionButton })
832
+ ]
833
+ }
834
+ ) }),
835
+ errorText ? /* @__PURE__ */ jsxs3(
836
+ "p",
837
+ {
838
+ id: errorId,
839
+ className: "flex items-center gap-1 text-sm text-[var(--ui-danger-base)]",
840
+ children: [
841
+ /* @__PURE__ */ jsx10(AlertCircle3, { className: "size-4" }),
842
+ errorText
843
+ ]
844
+ }
845
+ ) : helperText ? /* @__PURE__ */ jsx10("p", { id: helperId, className: "text-sm text-[var(--ui-text-500)]", children: helperText }) : null
846
+ ] });
847
+ }
848
+ );
849
+ EasyPhoneInput.displayName = "EasyPhoneInput";
850
+
851
+ // src/components/easy/input/text-input.tsx
852
+ import * as React10 from "react";
853
+ import { AlertCircle as AlertCircle4 } from "lucide-react";
854
+ import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
855
+ var EasyTextInput = React10.forwardRef(
856
+ ({
857
+ className,
858
+ label,
859
+ helperText,
860
+ errorText,
861
+ id,
862
+ name,
863
+ onChange,
864
+ ...props
865
+ }, ref) => {
866
+ const generatedId = React10.useId();
867
+ const inputId = id ?? generatedId;
868
+ const helperId = helperText && !errorText ? `${inputId}-helper` : void 0;
869
+ const errorId = errorText ? `${inputId}-error` : void 0;
870
+ const [isFocused, setIsFocused] = React10.useState(false);
871
+ return /* @__PURE__ */ jsxs4("div", { className: "flex w-full flex-col gap-1.5", children: [
872
+ label && /* @__PURE__ */ jsx11(
873
+ "label",
874
+ {
875
+ htmlFor: inputId,
876
+ className: "text-base font-medium text-[var(--ui-text-900)]",
877
+ children: label
878
+ }
879
+ ),
880
+ /* @__PURE__ */ jsx11(
881
+ Input,
882
+ {
883
+ ref,
884
+ id: inputId,
885
+ name: name ?? inputId,
886
+ type: "text",
887
+ onFocus: (event) => {
888
+ setIsFocused(true);
889
+ props.onFocus?.(event);
890
+ },
891
+ onBlur: (event) => {
892
+ setIsFocused(false);
893
+ props.onBlur?.(event);
894
+ },
895
+ onChange,
896
+ className: cn(
897
+ "placeholder:text-[var(--ui-text-400)]",
898
+ !isFocused && "hover:bg-[var(--ui-background-100)]",
899
+ isFocused && !errorText && "border-[var(--ui-border-900)]",
900
+ errorText && "border-[var(--ui-danger-base)] focus-visible:ring-[var(--ui-danger-base)] focus-visible:ring-offset-0",
901
+ !errorText && "focus-visible:shadow-[0_0_0_2px_var(--ui-background-0),_0_0_0_4px_var(--ui-border-200)]",
902
+ errorText && "focus-visible:shadow-[0_0_0_2px_var(--ui-background-0),_0_0_0_4px_var(--ui-danger-light)]",
903
+ className
904
+ ),
905
+ "aria-invalid": Boolean(errorText),
906
+ "aria-describedby": errorId ?? helperId,
907
+ ...props
908
+ }
909
+ ),
910
+ errorText ? /* @__PURE__ */ jsxs4(
911
+ "p",
912
+ {
913
+ id: errorId,
914
+ className: "flex items-center gap-1 text-sm text-[var(--ui-danger-base)]",
915
+ children: [
916
+ /* @__PURE__ */ jsx11(AlertCircle4, { className: "size-4" }),
917
+ errorText
918
+ ]
919
+ }
920
+ ) : helperText ? /* @__PURE__ */ jsx11("p", { id: helperId, className: "text-sm text-[var(--ui-text-500)]", children: helperText }) : null
921
+ ] });
922
+ }
923
+ );
924
+ EasyTextInput.displayName = "EasyTextInput";
925
+
926
+ // src/components/easy/checkbox.tsx
927
+ import * as React11 from "react";
928
+ import { AlertCircle as AlertCircle5 } from "lucide-react";
929
+ import { jsx as jsx12, jsxs as jsxs5 } from "react/jsx-runtime";
930
+ var EasyCheckbox = React11.forwardRef(
931
+ ({
932
+ label,
933
+ helperText,
934
+ errorText,
935
+ className,
936
+ checkboxClassName,
937
+ id,
938
+ disabled,
939
+ ...props
940
+ }, ref) => {
941
+ const generatedId = React11.useId();
942
+ const inputId = id ?? generatedId;
943
+ const helperId = helperText && !errorText ? `${inputId}-helper` : void 0;
944
+ const errorId = errorText ? `${inputId}-error` : void 0;
945
+ return /* @__PURE__ */ jsx12("div", { className: cn("flex w-full flex-col gap-1.5", className), children: /* @__PURE__ */ jsxs5(
946
+ "label",
947
+ {
948
+ htmlFor: inputId,
949
+ className: cn(
950
+ "flex items-center gap-2 cursor-pointer",
951
+ disabled && "cursor-not-allowed opacity-60"
952
+ ),
953
+ children: [
954
+ /* @__PURE__ */ jsx12(
955
+ ShadcnCheckbox,
956
+ {
957
+ ref,
958
+ id: inputId,
959
+ disabled,
960
+ "aria-invalid": Boolean(errorText),
961
+ "aria-describedby": errorId ?? helperId,
962
+ className: cn(
963
+ "h-4 w-4 shrink-0 rounded-[1px] border-[2px] border-[var(--ui-neutral-500)] bg-[var(--ui-background-0)]",
964
+ "data-[state=checked]:bg-[var(--ui-primary-500)] data-[state=checked]:border-[var(--ui-primary-500)]",
965
+ "data-[state=checked]:text-[var(--ui-primary-foreground)]",
966
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--ui-background)]",
967
+ "disabled:cursor-not-allowed disabled:opacity-60",
968
+ checkboxClassName
969
+ ),
970
+ ...props
971
+ }
972
+ ),
973
+ /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-0.5", children: [
974
+ label && /* @__PURE__ */ jsx12("span", { className: cn(getTypographyClass("body-medium"), "text-[var(--ui-text-500)]"), children: label }),
975
+ helperText && !errorText && /* @__PURE__ */ jsx12(
976
+ "span",
977
+ {
978
+ id: helperId,
979
+ className: "text-sm text-[var(--ui-text-500)]",
980
+ children: helperText
981
+ }
982
+ ),
983
+ errorText && /* @__PURE__ */ jsxs5(
984
+ "span",
985
+ {
986
+ id: errorId,
987
+ className: "flex items-center gap-1 text-sm text-[var(--ui-danger-base)]",
988
+ children: [
989
+ /* @__PURE__ */ jsx12(AlertCircle5, { className: "size-4" }),
990
+ errorText
991
+ ]
992
+ }
993
+ )
994
+ ] })
995
+ ]
996
+ }
997
+ ) });
998
+ }
999
+ );
1000
+ EasyCheckbox.displayName = "EasyCheckbox";
1001
+
1002
+ // src/components/easy/container.tsx
1003
+ import * as React12 from "react";
1004
+ import { cva as cva3 } from "class-variance-authority";
1005
+ import { jsx as jsx13 } from "react/jsx-runtime";
1006
+ var containerVariants = cva3(
1007
+ "mx-auto w-full",
1008
+ {
1009
+ variants: {
1010
+ size: {
1011
+ sm: "max-w-screen-sm",
1012
+ md: "max-w-screen-md",
1013
+ lg: "max-w-screen-lg",
1014
+ xl: "max-w-screen-xl",
1015
+ "2xl": "max-w-screen-2xl",
1016
+ full: "max-w-full"
1017
+ },
1018
+ padding: {
1019
+ none: "px-0",
1020
+ sm: "px-4 sm:px-6",
1021
+ md: "px-4 sm:px-6 lg:px-8",
1022
+ lg: "px-4 sm:px-6 lg:px-8 xl:px-12"
1023
+ }
1024
+ },
1025
+ defaultVariants: {
1026
+ size: "xl",
1027
+ padding: "md"
1028
+ }
1029
+ }
1030
+ );
1031
+ var EasyContainer = React12.forwardRef(
1032
+ ({ className, size, padding, ...props }, ref) => {
1033
+ return /* @__PURE__ */ jsx13(
1034
+ "div",
1035
+ {
1036
+ ref,
1037
+ className: cn(containerVariants({ size, padding }), className),
1038
+ ...props
1039
+ }
1040
+ );
1041
+ }
1042
+ );
1043
+ EasyContainer.displayName = "EasyContainer";
1044
+
1045
+ // src/components/easy/typography/display.tsx
1046
+ import * as React13 from "react";
1047
+ import { jsx as jsx14 } from "react/jsx-runtime";
1048
+ var EasyDisplay = React13.forwardRef(
1049
+ ({ className, variant = "medium", as: Component = "h1", ...props }, ref) => {
1050
+ return /* @__PURE__ */ jsx14(
1051
+ Component,
1052
+ {
1053
+ ref,
1054
+ className: cn(
1055
+ getTypographyClass(`display-${variant}`),
1056
+ className
1057
+ ),
1058
+ ...props
1059
+ }
1060
+ );
1061
+ }
1062
+ );
1063
+ EasyDisplay.displayName = "EasyDisplay";
1064
+
1065
+ // src/components/easy/typography/heading.tsx
1066
+ import * as React14 from "react";
1067
+ import { jsx as jsx15 } from "react/jsx-runtime";
1068
+ var defaultHeadingElements = {
1069
+ large: "h1",
1070
+ medium: "h2",
1071
+ small: "h3",
1072
+ xsmall: "h4"
1073
+ };
1074
+ var EasyHeading = React14.forwardRef(
1075
+ ({ className, variant = "medium", as, ...props }, ref) => {
1076
+ const Component = as ?? defaultHeadingElements[variant];
1077
+ return /* @__PURE__ */ jsx15(
1078
+ Component,
1079
+ {
1080
+ ref,
1081
+ className: cn(
1082
+ getTypographyClass(`heading-${variant}`),
1083
+ className
1084
+ ),
1085
+ ...props
1086
+ }
1087
+ );
1088
+ }
1089
+ );
1090
+ EasyHeading.displayName = "EasyHeading";
1091
+
1092
+ // src/components/easy/typography/label.tsx
1093
+ import * as React15 from "react";
1094
+ import { jsx as jsx16 } from "react/jsx-runtime";
1095
+ var EasyLabel = React15.forwardRef(
1096
+ ({ className, variant = "medium", as: Component = "label", ...props }, ref) => {
1097
+ return /* @__PURE__ */ jsx16(
1098
+ Component,
1099
+ {
1100
+ ref,
1101
+ className: cn(
1102
+ getTypographyClass(`label-${variant}`),
1103
+ className
1104
+ ),
1105
+ ...props
1106
+ }
1107
+ );
1108
+ }
1109
+ );
1110
+ EasyLabel.displayName = "EasyLabel";
1111
+
1112
+ // src/components/easy/typography/body.tsx
1113
+ import * as React16 from "react";
1114
+ import { jsx as jsx17 } from "react/jsx-runtime";
1115
+ var EasyBody = React16.forwardRef(
1116
+ ({ className, variant = "medium", as: Component = "p", ...props }, ref) => {
1117
+ return /* @__PURE__ */ jsx17(
1118
+ Component,
1119
+ {
1120
+ ref,
1121
+ className: cn(
1122
+ getTypographyClass(`body-${variant}`),
1123
+ className
1124
+ ),
1125
+ ...props
1126
+ }
1127
+ );
1128
+ }
1129
+ );
1130
+ EasyBody.displayName = "EasyBody";
1131
+
1132
+ // src/components/easy/typography/index.ts
1133
+ var EasyTypography = {
1134
+ Display: EasyDisplay,
1135
+ Heading: EasyHeading,
1136
+ Label: EasyLabel,
1137
+ Body: EasyBody
1138
+ };
1139
+
1140
+ // src/components/easy/error-message.tsx
1141
+ import * as React17 from "react";
1142
+ import { jsx as jsx18, jsxs as jsxs6 } from "react/jsx-runtime";
1143
+ var WarningTriangleIcon = () => /* @__PURE__ */ jsxs6("svg", { width: "32", height: "32", viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
1144
+ /* @__PURE__ */ jsx18("path", { d: "M6.6027 21.8034L13.6201 7.8074C14.6039 5.84505 17.405 5.84556 18.3881 7.80828L25.399 21.8043C26.2873 23.5775 24.998 25.6653 23.0148 25.6653H8.98652C7.00288 25.6653 5.71363 23.5767 6.6027 21.8034Z", fill: "#E93534", stroke: "#E93534", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
1145
+ /* @__PURE__ */ jsx18("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M17.1951 8.40674C16.7035 7.42539 15.303 7.42513 14.8111 8.40631L7.79374 22.4023C7.3492 23.289 7.99383 24.3333 8.98564 24.3333H23.0139C24.0055 24.3333 24.6502 23.2894 24.206 22.4028L17.1951 8.40674ZM12.4273 7.2111C13.9031 4.26757 18.1046 4.26834 19.5794 7.21241L26.5903 21.2084C27.9226 23.8682 25.9887 26.9999 23.0139 26.9999H8.98564C6.01018 26.9999 4.07631 23.867 5.40991 21.2071L12.4273 7.2111Z", fill: "#E93534" }),
1146
+ /* @__PURE__ */ jsx18("path", { d: "M17.3327 21.3333C17.3327 22.0697 16.7357 22.6667 15.9993 22.6667C15.263 22.6667 14.666 22.0697 14.666 21.3333C14.666 20.597 15.263 20 15.9993 20C16.7357 20 17.3327 20.597 17.3327 21.3333Z", fill: "white" }),
1147
+ /* @__PURE__ */ jsx18("path", { d: "M14.666 12.0013C14.666 11.2649 15.263 10.668 15.9993 10.668C16.7357 10.668 17.3327 11.2649 17.3327 12.0013V17.3346C17.3327 18.071 16.7357 18.668 15.9993 18.668C15.263 18.668 14.666 18.071 14.666 17.3346V12.0013Z", fill: "white" })
1148
+ ] });
1149
+ var EasyErrorMessage = React17.forwardRef(
1150
+ ({ className, title, description, icon, ...props }, ref) => {
1151
+ return /* @__PURE__ */ jsxs6(
1152
+ "div",
1153
+ {
1154
+ ref,
1155
+ className: cn(
1156
+ "flex flex-col items-center rounded-md px-4 py-2",
1157
+ "bg-[var(--ui-danger-light)]",
1158
+ className
1159
+ ),
1160
+ ...props,
1161
+ children: [
1162
+ /* @__PURE__ */ jsx18("div", { className: "flex-shrink-0", children: icon ?? /* @__PURE__ */ jsx18(WarningTriangleIcon, {}) }),
1163
+ /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center text-center", children: [
1164
+ /* @__PURE__ */ jsx18(
1165
+ "div",
1166
+ {
1167
+ className: cn(
1168
+ getTypographyClass("body-small"),
1169
+ "font-semibold text-[var(--ui-danger-base)]"
1170
+ ),
1171
+ children: title
1172
+ }
1173
+ ),
1174
+ description && /* @__PURE__ */ jsx18(
1175
+ "div",
1176
+ {
1177
+ className: cn(
1178
+ getTypographyClass("body-small"),
1179
+ "text-[var(--ui-danger-base)]"
1180
+ ),
1181
+ children: description
1182
+ }
1183
+ )
1184
+ ] })
1185
+ ]
1186
+ }
1187
+ );
1188
+ }
1189
+ );
1190
+ EasyErrorMessage.displayName = "EasyErrorMessage";
1191
+
1192
+ // src/components/easy/message-dialog.tsx
1193
+ import { AlertTriangle, CheckCircle } from "lucide-react";
1194
+
1195
+ // src/components/ui/dialog.tsx
1196
+ import * as React18 from "react";
1197
+ import * as DialogPrimitive from "@radix-ui/react-dialog";
1198
+ import { X } from "lucide-react";
1199
+ import { jsx as jsx19, jsxs as jsxs7 } from "react/jsx-runtime";
1200
+ var ShadcnDialog = DialogPrimitive.Root;
1201
+ var ShadcnDialogPortal = DialogPrimitive.Portal;
1202
+ var ShadcnDialogOverlay = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
1203
+ DialogPrimitive.Overlay,
1204
+ {
1205
+ ref,
1206
+ className: cn(
1207
+ "fixed inset-0 z-50 bg-black/30 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
1208
+ className
1209
+ ),
1210
+ ...props
1211
+ }
1212
+ ));
1213
+ ShadcnDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
1214
+ var ShadcnDialogContent = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs7(ShadcnDialogPortal, { children: [
1215
+ /* @__PURE__ */ jsx19(ShadcnDialogOverlay, {}),
1216
+ /* @__PURE__ */ jsxs7(
1217
+ DialogPrimitive.Content,
1218
+ {
1219
+ ref,
1220
+ className: cn(
1221
+ "fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border border-[var(--ui-border-200)] bg-[var(--ui-background-0)] p-6 shadow-xl duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-&lsqb;state=closed&rsqb;:slide-out-to-top-&lsqb;48%&rsqb; data-[state=open]:slide-in-from-left-1/2 data-&lsqb;state=open&rsqb;:slide-in-from-top-&lsqb;48%&rsqb;",
1222
+ className
1223
+ ),
1224
+ ...props,
1225
+ children: [
1226
+ children,
1227
+ /* @__PURE__ */ jsxs7(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-[var(--ui-ring)] focus:ring-offset-2 disabled:pointer-events-none", children: [
1228
+ /* @__PURE__ */ jsx19(X, { className: "size-4" }),
1229
+ /* @__PURE__ */ jsx19("span", { className: "sr-only", children: "Kapat" })
1230
+ ] })
1231
+ ]
1232
+ }
1233
+ )
1234
+ ] }));
1235
+ ShadcnDialogContent.displayName = DialogPrimitive.Content.displayName;
1236
+ var ShadcnDialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx19(
1237
+ "div",
1238
+ {
1239
+ className: cn(
1240
+ "flex flex-col space-y-1.5 text-center sm:text-left",
1241
+ className
1242
+ ),
1243
+ ...props
1244
+ }
1245
+ );
1246
+ ShadcnDialogHeader.displayName = "ShadcnDialogHeader";
1247
+ var ShadcnDialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx19(
1248
+ "div",
1249
+ {
1250
+ className: cn(
1251
+ "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
1252
+ className
1253
+ ),
1254
+ ...props
1255
+ }
1256
+ );
1257
+ ShadcnDialogFooter.displayName = "ShadcnDialogFooter";
1258
+ var ShadcnDialogTitle = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
1259
+ DialogPrimitive.Title,
1260
+ {
1261
+ ref,
1262
+ className: cn(
1263
+ "text-lg font-semibold text-[var(--ui-text-900)]",
1264
+ className
1265
+ ),
1266
+ ...props
1267
+ }
1268
+ ));
1269
+ ShadcnDialogTitle.displayName = DialogPrimitive.Title.displayName;
1270
+ var ShadcnDialogDescription = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
1271
+ DialogPrimitive.Description,
1272
+ {
1273
+ ref,
1274
+ className: cn(
1275
+ "text-sm text-[var(--ui-text-600)]",
1276
+ className
1277
+ ),
1278
+ ...props
1279
+ }
1280
+ ));
1281
+ ShadcnDialogDescription.displayName = DialogPrimitive.Description.displayName;
1282
+
1283
+ // src/components/easy/message-dialog.tsx
1284
+ import { jsx as jsx20, jsxs as jsxs8 } from "react/jsx-runtime";
1285
+ var iconConfig = {
1286
+ success: {
1287
+ Icon: CheckCircle,
1288
+ containerClass: "bg-[var(--ui-success-light)]",
1289
+ iconClass: "text-[var(--ui-success-base)]",
1290
+ titleClass: "text-[var(--ui-success-base)]"
1291
+ },
1292
+ warning: {
1293
+ Icon: AlertTriangle,
1294
+ containerClass: "bg-[var(--ui-warning-light)]",
1295
+ iconClass: "text-[var(--ui-warning-base)]",
1296
+ titleClass: "text-[var(--ui-warning-base)]"
1297
+ },
1298
+ error: {
1299
+ Icon: AlertTriangle,
1300
+ containerClass: "bg-[var(--ui-danger-light)]",
1301
+ iconClass: "text-[var(--ui-danger-base)]",
1302
+ titleClass: "text-[var(--ui-danger-base)]"
1303
+ }
1304
+ };
1305
+ var EasyMessageDialog = ({
1306
+ type,
1307
+ title,
1308
+ message,
1309
+ open,
1310
+ onClose,
1311
+ buttonText = "Kapat",
1312
+ onButtonClick
1313
+ }) => {
1314
+ const { Icon: Icon2, containerClass, iconClass, titleClass } = iconConfig[type];
1315
+ const handleOpenChange = (nextOpen) => {
1316
+ if (!nextOpen) onClose();
1317
+ };
1318
+ const handleButtonClick = () => {
1319
+ if (onButtonClick) {
1320
+ onButtonClick();
1321
+ } else {
1322
+ onClose();
1323
+ }
1324
+ };
1325
+ return /* @__PURE__ */ jsx20(ShadcnDialog, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs8(ShadcnDialogContent, { className: "sm:max-w-md rounded-xl", children: [
1326
+ /* @__PURE__ */ jsx20(ShadcnDialogTitle, { className: "sr-only", children: title }),
1327
+ /* @__PURE__ */ jsx20(ShadcnDialogDescription, { className: "sr-only", children: message }),
1328
+ /* @__PURE__ */ jsxs8("div", { className: "flex flex-col items-center gap-4 px-6 py-4 text-center", children: [
1329
+ /* @__PURE__ */ jsx20(
1330
+ "div",
1331
+ {
1332
+ className: cn(
1333
+ "flex size-16 items-center justify-center rounded-full",
1334
+ containerClass
1335
+ ),
1336
+ children: /* @__PURE__ */ jsx20(Icon2, { className: cn("size-8", iconClass) })
1337
+ }
1338
+ ),
1339
+ /* @__PURE__ */ jsx20(
1340
+ EasyHeading,
1341
+ {
1342
+ as: "h3",
1343
+ variant: "large",
1344
+ className: cn("font-semibold", titleClass),
1345
+ style: { color: "#000000" },
1346
+ children: title
1347
+ }
1348
+ ),
1349
+ /* @__PURE__ */ jsx20(EasyBody, { as: "p", variant: "medium", className: "text-[var(--ui-text-500)]", children: message }),
1350
+ /* @__PURE__ */ jsx20(
1351
+ EasyButton,
1352
+ {
1353
+ variant: "important",
1354
+ appearance: "stroke",
1355
+ size: "large",
1356
+ className: "mt-2 w-full",
1357
+ onClick: handleButtonClick,
1358
+ children: buttonText
1359
+ }
1360
+ )
1361
+ ] })
1362
+ ] }) });
1363
+ };
1364
+ EasyMessageDialog.displayName = "EasyMessageDialog";
1365
+
1366
+ // src/components/easy/sidebar.tsx
1367
+ import * as React24 from "react";
1368
+
1369
+ // src/components/ui/sidebar.tsx
1370
+ import * as React23 from "react";
1371
+ import { Slot as Slot2 } from "@radix-ui/react-slot";
1372
+ import { cva as cva5 } from "class-variance-authority";
1373
+ import { PanelLeft } from "lucide-react";
1374
+
1375
+ // src/hooks/use-mobile.tsx
1376
+ import * as React19 from "react";
1377
+ var MOBILE_BREAKPOINT = 768;
1378
+ function useIsMobile() {
1379
+ const [isMobile, setIsMobile] = React19.useState(void 0);
1380
+ React19.useEffect(() => {
1381
+ const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
1382
+ const onChange = () => {
1383
+ setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
1384
+ };
1385
+ mql.addEventListener("change", onChange);
1386
+ setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
1387
+ return () => mql.removeEventListener("change", onChange);
1388
+ }, []);
1389
+ return !!isMobile;
1390
+ }
1391
+
1392
+ // src/components/ui/separator.tsx
1393
+ import * as React20 from "react";
1394
+ import * as SeparatorPrimitive from "@radix-ui/react-separator";
1395
+ import { jsx as jsx21 } from "react/jsx-runtime";
1396
+ var Separator = React20.forwardRef(
1397
+ ({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx21(
1398
+ SeparatorPrimitive.Root,
1399
+ {
1400
+ ref,
1401
+ decorative,
1402
+ orientation,
1403
+ className: cn(
1404
+ "shrink-0 bg-border",
1405
+ orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
1406
+ className
1407
+ ),
1408
+ ...props
1409
+ }
1410
+ )
1411
+ );
1412
+ Separator.displayName = SeparatorPrimitive.Root.displayName;
1413
+
1414
+ // src/components/ui/sheet.tsx
1415
+ import * as React21 from "react";
1416
+ import * as SheetPrimitive from "@radix-ui/react-dialog";
1417
+ import { cva as cva4 } from "class-variance-authority";
1418
+ import { X as X2 } from "lucide-react";
1419
+ import { jsx as jsx22, jsxs as jsxs9 } from "react/jsx-runtime";
1420
+ var Sheet = SheetPrimitive.Root;
1421
+ var SheetPortal = SheetPrimitive.Portal;
1422
+ var SheetOverlay = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
1423
+ SheetPrimitive.Overlay,
1424
+ {
1425
+ className: cn(
1426
+ "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
1427
+ className
1428
+ ),
1429
+ ...props,
1430
+ ref
1431
+ }
1432
+ ));
1433
+ SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
1434
+ var sheetVariants = cva4(
1435
+ "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
1436
+ {
1437
+ variants: {
1438
+ side: {
1439
+ top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
1440
+ bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
1441
+ left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
1442
+ right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm"
1443
+ }
1444
+ },
1445
+ defaultVariants: {
1446
+ side: "right"
1447
+ }
1448
+ }
1449
+ );
1450
+ var SheetContent = React21.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs9(SheetPortal, { children: [
1451
+ /* @__PURE__ */ jsx22(SheetOverlay, {}),
1452
+ /* @__PURE__ */ jsxs9(
1453
+ SheetPrimitive.Content,
1454
+ {
1455
+ ref,
1456
+ className: cn(sheetVariants({ side }), className),
1457
+ ...props,
1458
+ children: [
1459
+ children,
1460
+ /* @__PURE__ */ jsxs9(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
1461
+ /* @__PURE__ */ jsx22(X2, { className: "h-4 w-4" }),
1462
+ /* @__PURE__ */ jsx22("span", { className: "sr-only", children: "Close" })
1463
+ ] })
1464
+ ]
1465
+ }
1466
+ )
1467
+ ] }));
1468
+ SheetContent.displayName = SheetPrimitive.Content.displayName;
1469
+ var SheetHeader = ({
1470
+ className,
1471
+ ...props
1472
+ }) => /* @__PURE__ */ jsx22(
1473
+ "div",
1474
+ {
1475
+ className: cn(
1476
+ "flex flex-col space-y-2 text-center sm:text-left",
1477
+ className
1478
+ ),
1479
+ ...props
1480
+ }
1481
+ );
1482
+ SheetHeader.displayName = "SheetHeader";
1483
+ var SheetFooter = ({
1484
+ className,
1485
+ ...props
1486
+ }) => /* @__PURE__ */ jsx22(
1487
+ "div",
1488
+ {
1489
+ className: cn(
1490
+ "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
1491
+ className
1492
+ ),
1493
+ ...props
1494
+ }
1495
+ );
1496
+ SheetFooter.displayName = "SheetFooter";
1497
+ var SheetTitle = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
1498
+ SheetPrimitive.Title,
1499
+ {
1500
+ ref,
1501
+ className: cn("text-lg font-semibold text-foreground", className),
1502
+ ...props
1503
+ }
1504
+ ));
1505
+ SheetTitle.displayName = SheetPrimitive.Title.displayName;
1506
+ var SheetDescription = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
1507
+ SheetPrimitive.Description,
1508
+ {
1509
+ ref,
1510
+ className: cn("text-sm text-muted-foreground", className),
1511
+ ...props
1512
+ }
1513
+ ));
1514
+ SheetDescription.displayName = SheetPrimitive.Description.displayName;
1515
+
1516
+ // src/components/ui/skeleton.tsx
1517
+ import { jsx as jsx23 } from "react/jsx-runtime";
1518
+ function Skeleton({
1519
+ className,
1520
+ ...props
1521
+ }) {
1522
+ return /* @__PURE__ */ jsx23(
1523
+ "div",
1524
+ {
1525
+ className: cn("animate-pulse rounded-md bg-muted", className),
1526
+ ...props
1527
+ }
1528
+ );
1529
+ }
1530
+
1531
+ // src/components/ui/tooltip.tsx
1532
+ import * as React22 from "react";
1533
+ import * as TooltipPrimitive from "@radix-ui/react-tooltip";
1534
+ import { jsx as jsx24 } from "react/jsx-runtime";
1535
+ var TooltipProvider = TooltipPrimitive.Provider;
1536
+ var Tooltip = TooltipPrimitive.Root;
1537
+ var TooltipTrigger = TooltipPrimitive.Trigger;
1538
+ var TooltipContent = React22.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx24(
1539
+ TooltipPrimitive.Content,
1540
+ {
1541
+ ref,
1542
+ sideOffset,
1543
+ className: cn(
1544
+ "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-tooltip-content-transform-origin]",
1545
+ className
1546
+ ),
1547
+ ...props
1548
+ }
1549
+ ));
1550
+ TooltipContent.displayName = TooltipPrimitive.Content.displayName;
1551
+
1552
+ // src/components/ui/sidebar.tsx
1553
+ import { jsx as jsx25, jsxs as jsxs10 } from "react/jsx-runtime";
1554
+ var SIDEBAR_COOKIE_NAME = "sidebar_state";
1555
+ var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
1556
+ var SIDEBAR_WIDTH = "16rem";
1557
+ var SIDEBAR_WIDTH_MOBILE = "18rem";
1558
+ var SIDEBAR_WIDTH_ICON = "3rem";
1559
+ var SIDEBAR_KEYBOARD_SHORTCUT = "b";
1560
+ var SidebarContext = React23.createContext(null);
1561
+ function useSidebar() {
1562
+ const context = React23.useContext(SidebarContext);
1563
+ if (!context) {
1564
+ throw new Error("useSidebar must be used within a SidebarProvider.");
1565
+ }
1566
+ return context;
1567
+ }
1568
+ var SidebarProvider = React23.forwardRef(
1569
+ ({
1570
+ defaultOpen = true,
1571
+ open: openProp,
1572
+ onOpenChange: setOpenProp,
1573
+ className,
1574
+ style,
1575
+ children,
1576
+ ...props
1577
+ }, ref) => {
1578
+ const isMobile = useIsMobile();
1579
+ const [openMobile, setOpenMobile] = React23.useState(false);
1580
+ const [_open, _setOpen] = React23.useState(defaultOpen);
1581
+ const open = openProp ?? _open;
1582
+ const setOpen = React23.useCallback(
1583
+ (value) => {
1584
+ const openState = typeof value === "function" ? value(open) : value;
1585
+ if (setOpenProp) {
1586
+ setOpenProp(openState);
1587
+ } else {
1588
+ _setOpen(openState);
1589
+ }
1590
+ document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
1591
+ },
1592
+ [setOpenProp, open]
1593
+ );
1594
+ const toggleSidebar = React23.useCallback(() => {
1595
+ return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
1596
+ }, [isMobile, setOpen, setOpenMobile]);
1597
+ React23.useEffect(() => {
1598
+ const handleKeyDown = (event) => {
1599
+ if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
1600
+ event.preventDefault();
1601
+ toggleSidebar();
1602
+ }
1603
+ };
1604
+ window.addEventListener("keydown", handleKeyDown);
1605
+ return () => window.removeEventListener("keydown", handleKeyDown);
1606
+ }, [toggleSidebar]);
1607
+ const state = open ? "expanded" : "collapsed";
1608
+ const contextValue = React23.useMemo(
1609
+ () => ({
1610
+ state,
1611
+ open,
1612
+ setOpen,
1613
+ isMobile,
1614
+ openMobile,
1615
+ setOpenMobile,
1616
+ toggleSidebar
1617
+ }),
1618
+ [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
1619
+ );
1620
+ return /* @__PURE__ */ jsx25(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx25(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx25(
1621
+ "div",
1622
+ {
1623
+ style: {
1624
+ "--sidebar-width": SIDEBAR_WIDTH,
1625
+ "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
1626
+ ...style
1627
+ },
1628
+ className: cn(
1629
+ "group/sidebar-wrapper flex min-h-svh w-full has-[[data-variant=inset]]:bg-sidebar",
1630
+ className
1631
+ ),
1632
+ ref,
1633
+ ...props,
1634
+ children
1635
+ }
1636
+ ) }) });
1637
+ }
1638
+ );
1639
+ SidebarProvider.displayName = "SidebarProvider";
1640
+ var Sidebar = React23.forwardRef(
1641
+ ({
1642
+ side = "left",
1643
+ variant = "sidebar",
1644
+ collapsible = "offcanvas",
1645
+ className,
1646
+ children,
1647
+ ...props
1648
+ }, ref) => {
1649
+ const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
1650
+ if (collapsible === "none") {
1651
+ return /* @__PURE__ */ jsx25(
1652
+ "div",
1653
+ {
1654
+ className: cn(
1655
+ "flex h-full w-[--sidebar-width] flex-col bg-sidebar text-sidebar-foreground",
1656
+ className
1657
+ ),
1658
+ ref,
1659
+ ...props,
1660
+ children
1661
+ }
1662
+ );
1663
+ }
1664
+ if (isMobile) {
1665
+ return /* @__PURE__ */ jsx25(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsxs10(
1666
+ SheetContent,
1667
+ {
1668
+ "data-sidebar": "sidebar",
1669
+ "data-mobile": "true",
1670
+ className: "w-[--sidebar-width] bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden",
1671
+ style: {
1672
+ "--sidebar-width": SIDEBAR_WIDTH_MOBILE
1673
+ },
1674
+ side,
1675
+ children: [
1676
+ /* @__PURE__ */ jsxs10(SheetHeader, { className: "sr-only", children: [
1677
+ /* @__PURE__ */ jsx25(SheetTitle, { children: "Sidebar" }),
1678
+ /* @__PURE__ */ jsx25(SheetDescription, { children: "Displays the mobile sidebar." })
1679
+ ] }),
1680
+ /* @__PURE__ */ jsx25("div", { className: "flex h-full w-full flex-col", children })
1681
+ ]
1682
+ }
1683
+ ) });
1684
+ }
1685
+ return /* @__PURE__ */ jsxs10(
1686
+ "div",
1687
+ {
1688
+ ref,
1689
+ className: "group peer hidden text-sidebar-foreground md:block",
1690
+ "data-state": state,
1691
+ "data-collapsible": state === "collapsed" ? collapsible : "",
1692
+ "data-variant": variant,
1693
+ "data-side": side,
1694
+ children: [
1695
+ /* @__PURE__ */ jsx25(
1696
+ "div",
1697
+ {
1698
+ className: cn(
1699
+ "relative w-[--sidebar-width] bg-transparent transition-[width] duration-200 ease-linear",
1700
+ "group-data-[collapsible=offcanvas]:w-0",
1701
+ "group-data-[side=right]:rotate-180",
1702
+ variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]" : "group-data-[collapsible=icon]:w-[--sidebar-width-icon]"
1703
+ )
1704
+ }
1705
+ ),
1706
+ /* @__PURE__ */ jsx25(
1707
+ "div",
1708
+ {
1709
+ className: cn(
1710
+ "fixed inset-y-0 z-10 hidden h-svh w-[--sidebar-width] transition-[left,right,width] duration-200 ease-linear md:flex",
1711
+ side === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
1712
+ // Adjust the padding for floating and inset variants.
1713
+ variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]" : "group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l",
1714
+ className
1715
+ ),
1716
+ ...props,
1717
+ children: /* @__PURE__ */ jsx25(
1718
+ "div",
1719
+ {
1720
+ "data-sidebar": "sidebar",
1721
+ className: "flex h-full w-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:border-sidebar-border group-data-[variant=floating]:shadow",
1722
+ children
1723
+ }
1724
+ )
1725
+ }
1726
+ )
1727
+ ]
1728
+ }
1729
+ );
1730
+ }
1731
+ );
1732
+ Sidebar.displayName = "Sidebar";
1733
+ var SidebarTrigger = React23.forwardRef(({ className, onClick, ...props }, ref) => {
1734
+ const { toggleSidebar } = useSidebar();
1735
+ return /* @__PURE__ */ jsxs10(
1736
+ ShadcnButton,
1737
+ {
1738
+ ref,
1739
+ "data-sidebar": "trigger",
1740
+ variant: "link",
1741
+ size: "icon",
1742
+ className: cn("h-7 w-7", className),
1743
+ onClick: (event) => {
1744
+ onClick?.(event);
1745
+ toggleSidebar();
1746
+ },
1747
+ ...props,
1748
+ children: [
1749
+ /* @__PURE__ */ jsx25(PanelLeft, {}),
1750
+ /* @__PURE__ */ jsx25("span", { className: "sr-only", children: "Toggle Sidebar" })
1751
+ ]
1752
+ }
1753
+ );
1754
+ });
1755
+ SidebarTrigger.displayName = "SidebarTrigger";
1756
+ var SidebarRail = React23.forwardRef(({ className, ...props }, ref) => {
1757
+ const { toggleSidebar } = useSidebar();
1758
+ return /* @__PURE__ */ jsx25(
1759
+ "button",
1760
+ {
1761
+ ref,
1762
+ "data-sidebar": "rail",
1763
+ "aria-label": "Toggle Sidebar",
1764
+ tabIndex: -1,
1765
+ onClick: toggleSidebar,
1766
+ title: "Toggle Sidebar",
1767
+ className: cn(
1768
+ "absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=left]:-right-4 group-data-[side=right]:left-0 sm:flex",
1769
+ "[[data-side=left]_&]:cursor-w-resize [[data-side=right]_&]:cursor-e-resize",
1770
+ "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
1771
+ "group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full group-data-[collapsible=offcanvas]:hover:bg-sidebar",
1772
+ "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
1773
+ "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
1774
+ className
1775
+ ),
1776
+ ...props
1777
+ }
1778
+ );
1779
+ });
1780
+ SidebarRail.displayName = "SidebarRail";
1781
+ var SidebarInset = React23.forwardRef(({ className, ...props }, ref) => {
1782
+ return /* @__PURE__ */ jsx25(
1783
+ "main",
1784
+ {
1785
+ ref,
1786
+ className: cn(
1787
+ "relative flex w-full flex-1 flex-col bg-background",
1788
+ "md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow",
1789
+ className
1790
+ ),
1791
+ ...props
1792
+ }
1793
+ );
1794
+ });
1795
+ SidebarInset.displayName = "SidebarInset";
1796
+ var SidebarInput = React23.forwardRef(({ className, ...props }, ref) => {
1797
+ return /* @__PURE__ */ jsx25(
1798
+ ShadcnInput,
1799
+ {
1800
+ ref,
1801
+ "data-sidebar": "input",
1802
+ className: cn(
1803
+ "h-8 w-full bg-background shadow-none focus-visible:ring-2 focus-visible:ring-sidebar-ring",
1804
+ className
1805
+ ),
1806
+ ...props
1807
+ }
1808
+ );
1809
+ });
1810
+ SidebarInput.displayName = "SidebarInput";
1811
+ var SidebarHeader = React23.forwardRef(({ className, ...props }, ref) => {
1812
+ return /* @__PURE__ */ jsx25(
1813
+ "div",
1814
+ {
1815
+ ref,
1816
+ "data-sidebar": "header",
1817
+ className: cn("flex flex-col gap-2 p-2", className),
1818
+ ...props
1819
+ }
1820
+ );
1821
+ });
1822
+ SidebarHeader.displayName = "SidebarHeader";
1823
+ var SidebarFooter = React23.forwardRef(({ className, ...props }, ref) => {
1824
+ return /* @__PURE__ */ jsx25(
1825
+ "div",
1826
+ {
1827
+ ref,
1828
+ "data-sidebar": "footer",
1829
+ className: cn("flex flex-col gap-2 p-2", className),
1830
+ ...props
1831
+ }
1832
+ );
1833
+ });
1834
+ SidebarFooter.displayName = "SidebarFooter";
1835
+ var SidebarSeparator = React23.forwardRef(({ className, ...props }, ref) => {
1836
+ return /* @__PURE__ */ jsx25(
1837
+ Separator,
1838
+ {
1839
+ ref,
1840
+ "data-sidebar": "separator",
1841
+ className: cn("mx-2 w-auto bg-sidebar-border", className),
1842
+ ...props
1843
+ }
1844
+ );
1845
+ });
1846
+ SidebarSeparator.displayName = "SidebarSeparator";
1847
+ var SidebarContent = React23.forwardRef(({ className, ...props }, ref) => {
1848
+ return /* @__PURE__ */ jsx25(
1849
+ "div",
1850
+ {
1851
+ ref,
1852
+ "data-sidebar": "content",
1853
+ className: cn(
1854
+ "flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
1855
+ className
1856
+ ),
1857
+ ...props
1858
+ }
1859
+ );
1860
+ });
1861
+ SidebarContent.displayName = "SidebarContent";
1862
+ var SidebarGroup = React23.forwardRef(({ className, ...props }, ref) => {
1863
+ return /* @__PURE__ */ jsx25(
1864
+ "div",
1865
+ {
1866
+ ref,
1867
+ "data-sidebar": "group",
1868
+ className: cn("relative flex w-full min-w-0 flex-col p-2", className),
1869
+ ...props
1870
+ }
1871
+ );
1872
+ });
1873
+ SidebarGroup.displayName = "SidebarGroup";
1874
+ var SidebarGroupLabel = React23.forwardRef(({ className, asChild = false, ...props }, ref) => {
1875
+ const Comp = asChild ? Slot2 : "div";
1876
+ return /* @__PURE__ */ jsx25(
1877
+ Comp,
1878
+ {
1879
+ ref,
1880
+ "data-sidebar": "group-label",
1881
+ className: cn(
1882
+ "flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 outline-none ring-sidebar-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
1883
+ "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
1884
+ className
1885
+ ),
1886
+ ...props
1887
+ }
1888
+ );
1889
+ });
1890
+ SidebarGroupLabel.displayName = "SidebarGroupLabel";
1891
+ var SidebarGroupAction = React23.forwardRef(({ className, asChild = false, ...props }, ref) => {
1892
+ const Comp = asChild ? Slot2 : "button";
1893
+ return /* @__PURE__ */ jsx25(
1894
+ Comp,
1895
+ {
1896
+ ref,
1897
+ "data-sidebar": "group-action",
1898
+ className: cn(
1899
+ "absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
1900
+ // Increases the hit area of the button on mobile.
1901
+ "after:absolute after:-inset-2 after:md:hidden",
1902
+ "group-data-[collapsible=icon]:hidden",
1903
+ className
1904
+ ),
1905
+ ...props
1906
+ }
1907
+ );
1908
+ });
1909
+ SidebarGroupAction.displayName = "SidebarGroupAction";
1910
+ var SidebarGroupContent = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx25(
1911
+ "div",
1912
+ {
1913
+ ref,
1914
+ "data-sidebar": "group-content",
1915
+ className: cn("w-full text-sm", className),
1916
+ ...props
1917
+ }
1918
+ ));
1919
+ SidebarGroupContent.displayName = "SidebarGroupContent";
1920
+ var SidebarMenu = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx25(
1921
+ "ul",
1922
+ {
1923
+ ref,
1924
+ "data-sidebar": "menu",
1925
+ className: cn("flex w-full min-w-0 flex-col gap-1", className),
1926
+ ...props
1927
+ }
1928
+ ));
1929
+ SidebarMenu.displayName = "SidebarMenu";
1930
+ var SidebarMenuItem = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx25(
1931
+ "li",
1932
+ {
1933
+ ref,
1934
+ "data-sidebar": "menu-item",
1935
+ className: cn("group/menu-item relative", className),
1936
+ ...props
1937
+ }
1938
+ ));
1939
+ SidebarMenuItem.displayName = "SidebarMenuItem";
1940
+ var sidebarMenuButtonVariants = cva5(
1941
+ "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-none ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-[[data-sidebar=menu-action]]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-2 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
1942
+ {
1943
+ variants: {
1944
+ variant: {
1945
+ default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
1946
+ outline: "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]"
1947
+ },
1948
+ size: {
1949
+ default: "h-8 text-sm",
1950
+ sm: "h-7 text-xs",
1951
+ lg: "h-12 text-sm group-data-[collapsible=icon]:!p-0"
1952
+ }
1953
+ },
1954
+ defaultVariants: {
1955
+ variant: "default",
1956
+ size: "default"
1957
+ }
1958
+ }
1959
+ );
1960
+ var SidebarMenuButton = React23.forwardRef(
1961
+ ({
1962
+ asChild = false,
1963
+ isActive = false,
1964
+ variant = "default",
1965
+ size = "default",
1966
+ tooltip,
1967
+ className,
1968
+ ...props
1969
+ }, ref) => {
1970
+ const Comp = asChild ? Slot2 : "button";
1971
+ const { isMobile, state } = useSidebar();
1972
+ const button = /* @__PURE__ */ jsx25(
1973
+ Comp,
1974
+ {
1975
+ ref,
1976
+ "data-sidebar": "menu-button",
1977
+ "data-size": size,
1978
+ "data-active": isActive,
1979
+ className: cn(sidebarMenuButtonVariants({ variant, size }), className),
1980
+ ...props
1981
+ }
1982
+ );
1983
+ if (!tooltip) {
1984
+ return button;
1985
+ }
1986
+ if (typeof tooltip === "string") {
1987
+ tooltip = {
1988
+ children: tooltip
1989
+ };
1990
+ }
1991
+ return /* @__PURE__ */ jsxs10(Tooltip, { children: [
1992
+ /* @__PURE__ */ jsx25(TooltipTrigger, { asChild: true, children: button }),
1993
+ /* @__PURE__ */ jsx25(
1994
+ TooltipContent,
1995
+ {
1996
+ side: "right",
1997
+ align: "center",
1998
+ hidden: state !== "collapsed" || isMobile,
1999
+ ...tooltip
2000
+ }
2001
+ )
2002
+ ] });
2003
+ }
2004
+ );
2005
+ SidebarMenuButton.displayName = "SidebarMenuButton";
2006
+ var SidebarMenuAction = React23.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
2007
+ const Comp = asChild ? Slot2 : "button";
2008
+ return /* @__PURE__ */ jsx25(
2009
+ Comp,
2010
+ {
2011
+ ref,
2012
+ "data-sidebar": "menu-action",
2013
+ className: cn(
2014
+ "absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0",
2015
+ // Increases the hit area of the button on mobile.
2016
+ "after:absolute after:-inset-2 after:md:hidden",
2017
+ "peer-data-[size=sm]/menu-button:top-1",
2018
+ "peer-data-[size=default]/menu-button:top-1.5",
2019
+ "peer-data-[size=lg]/menu-button:top-2.5",
2020
+ "group-data-[collapsible=icon]:hidden",
2021
+ showOnHover && "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground md:opacity-0",
2022
+ className
2023
+ ),
2024
+ ...props
2025
+ }
2026
+ );
2027
+ });
2028
+ SidebarMenuAction.displayName = "SidebarMenuAction";
2029
+ var SidebarMenuBadge = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx25(
2030
+ "div",
2031
+ {
2032
+ ref,
2033
+ "data-sidebar": "menu-badge",
2034
+ className: cn(
2035
+ "pointer-events-none absolute right-1 flex h-5 min-w-5 select-none items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums text-sidebar-foreground",
2036
+ "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
2037
+ "peer-data-[size=sm]/menu-button:top-1",
2038
+ "peer-data-[size=default]/menu-button:top-1.5",
2039
+ "peer-data-[size=lg]/menu-button:top-2.5",
2040
+ "group-data-[collapsible=icon]:hidden",
2041
+ className
2042
+ ),
2043
+ ...props
2044
+ }
2045
+ ));
2046
+ SidebarMenuBadge.displayName = "SidebarMenuBadge";
2047
+ var SidebarMenuSkeleton = React23.forwardRef(({ className, showIcon = false, ...props }, ref) => {
2048
+ const width = React23.useMemo(() => {
2049
+ return `${Math.floor(Math.random() * 40) + 50}%`;
2050
+ }, []);
2051
+ return /* @__PURE__ */ jsxs10(
2052
+ "div",
2053
+ {
2054
+ ref,
2055
+ "data-sidebar": "menu-skeleton",
2056
+ className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
2057
+ ...props,
2058
+ children: [
2059
+ showIcon && /* @__PURE__ */ jsx25(
2060
+ Skeleton,
2061
+ {
2062
+ className: "size-4 rounded-md",
2063
+ "data-sidebar": "menu-skeleton-icon"
2064
+ }
2065
+ ),
2066
+ /* @__PURE__ */ jsx25(
2067
+ Skeleton,
2068
+ {
2069
+ className: "h-4 max-w-[--skeleton-width] flex-1",
2070
+ "data-sidebar": "menu-skeleton-text",
2071
+ style: {
2072
+ "--skeleton-width": width
2073
+ }
2074
+ }
2075
+ )
2076
+ ]
2077
+ }
2078
+ );
2079
+ });
2080
+ SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
2081
+ var SidebarMenuSub = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx25(
2082
+ "ul",
2083
+ {
2084
+ ref,
2085
+ "data-sidebar": "menu-sub",
2086
+ className: cn(
2087
+ "mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5",
2088
+ "group-data-[collapsible=icon]:hidden",
2089
+ className
2090
+ ),
2091
+ ...props
2092
+ }
2093
+ ));
2094
+ SidebarMenuSub.displayName = "SidebarMenuSub";
2095
+ var SidebarMenuSubItem = React23.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx25("li", { ref, ...props }));
2096
+ SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
2097
+ var SidebarMenuSubButton = React23.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
2098
+ const Comp = asChild ? Slot2 : "a";
2099
+ return /* @__PURE__ */ jsx25(
2100
+ Comp,
2101
+ {
2102
+ ref,
2103
+ "data-sidebar": "menu-sub-button",
2104
+ "data-size": size,
2105
+ "data-active": isActive,
2106
+ className: cn(
2107
+ "flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
2108
+ "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
2109
+ size === "sm" && "text-xs",
2110
+ size === "md" && "text-sm",
2111
+ "group-data-[collapsible=icon]:hidden",
2112
+ className
2113
+ ),
2114
+ ...props
2115
+ }
2116
+ );
2117
+ });
2118
+ SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
2119
+
2120
+ // src/components/easy/sidebar.tsx
2121
+ import { jsx as jsx26, jsxs as jsxs11 } from "react/jsx-runtime";
2122
+ var EasySidebar = React24.forwardRef(
2123
+ ({ title, description, menuItems, className, ...props }, ref) => {
2124
+ return /* @__PURE__ */ jsx26(
2125
+ SidebarProvider,
2126
+ {
2127
+ ref,
2128
+ className: cn(
2129
+ "bg-[var(--ui-background-50)] px-3 py-6",
2130
+ className
2131
+ ),
2132
+ style: { "--sidebar-width": "100%" },
2133
+ ...props,
2134
+ children: /* @__PURE__ */ jsx26(Sidebar, { collapsible: "none", className: "w-full bg-transparent text-[var(--ui-text-900)]", children: /* @__PURE__ */ jsxs11(SidebarContent, { className: "gap-6 px-0", children: [
2135
+ (title || description) && /* @__PURE__ */ jsxs11("div", { className: "space-y-1 px-2 text-left", children: [
2136
+ title && /* @__PURE__ */ jsx26(EasyHeading, { variant: "large", as: "h2", className: "text-[var(--ui-text-900)] font-semibold text-xl", children: title }),
2137
+ description && /* @__PURE__ */ jsx26(EasyBody, { variant: "small", className: "text-[var(--ui-text-600)]", children: description })
2138
+ ] }),
2139
+ /* @__PURE__ */ jsx26(SidebarMenu, { className: "gap-2 px-1", children: menuItems.map((item, index) => /* @__PURE__ */ jsx26(SidebarMenuItem, { children: /* @__PURE__ */ jsxs11(
2140
+ SidebarMenuButton,
2141
+ {
2142
+ type: "button",
2143
+ isActive: item.active,
2144
+ className: "h-11 bg-transparent px-3 py-1.5 text-[var(--ui-text-600)] data-[active=true]:bg-[var(--ui-decorative-green)] data-[active=true]:text-[var(--ui-text-900)] data-[active=true]:rounded-md",
2145
+ onClick: () => item.onClick?.(),
2146
+ children: [
2147
+ item.icon && /* @__PURE__ */ jsx26("span", { className: cn(
2148
+ "text-[var(--ui-text-500)]",
2149
+ item.active && "text-[var(--ui-primary-500)]"
2150
+ ), children: item.icon }),
2151
+ /* @__PURE__ */ jsxs11("span", { className: "flex flex-1 flex-col text-left", children: [
2152
+ /* @__PURE__ */ jsx26(EasyBody, { variant: "medium", className: "text-[var(--ui-text-900)] font-medium", children: item.label }),
2153
+ item.description && /* @__PURE__ */ jsx26(EasyBody, { variant: "small", className: "text-[var(--ui-text-500)]", children: item.description })
2154
+ ] })
2155
+ ]
2156
+ }
2157
+ ) }, item.id ?? index)) })
2158
+ ] }) })
2159
+ }
2160
+ );
2161
+ }
2162
+ );
2163
+ EasySidebar.displayName = "EasySidebar";
2164
+
2165
+ // src/components/easy/tabs.tsx
2166
+ import * as React25 from "react";
2167
+ import { cva as cva6 } from "class-variance-authority";
2168
+ import { jsx as jsx27, jsxs as jsxs12 } from "react/jsx-runtime";
2169
+ var tabsListVariants = cva6(
2170
+ "inline-flex items-center justify-start gap-1 rounded-lg bg-transparent",
2171
+ {
2172
+ variants: {
2173
+ size: {
2174
+ small: "h-8",
2175
+ medium: "h-10",
2176
+ large: "h-12"
2177
+ }
2178
+ },
2179
+ defaultVariants: {
2180
+ size: "medium"
2181
+ }
2182
+ }
2183
+ );
2184
+ var tabsTriggerVariants = cva6(
2185
+ "relative inline-flex items-center justify-center whitespace-nowrap px-4 py-2 transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-ring)] focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 !bg-transparent !shadow-none data-[state=active]:!bg-transparent data-[state=active]:!shadow-none data-[state=inactive]:!bg-transparent data-[state=inactive]:!shadow-none data-[state=active]:text-[var(--ui-primary-500)] data-[state=inactive]:text-[var(--ui-text-900)] hover:data-[state=inactive]:!bg-transparent hover:data-[state=inactive]:!shadow-none [&[data-state=active]>div:last-child]:opacity-100",
2186
+ {
2187
+ variants: {
2188
+ size: {
2189
+ small: "h-6 px-3 text-xs",
2190
+ medium: "h-8 px-4 text-sm",
2191
+ large: "h-10 px-6 text-base"
2192
+ }
2193
+ },
2194
+ defaultVariants: {
2195
+ size: "medium"
2196
+ }
2197
+ }
2198
+ );
2199
+ var EasyTabs = Tabs;
2200
+ var EasyTabsList = React25.forwardRef(({ className, size, ...props }, ref) => {
2201
+ return /* @__PURE__ */ jsx27(
2202
+ TabsList,
2203
+ {
2204
+ ref,
2205
+ className: cn(tabsListVariants({ size }), className, "bg-transparent"),
2206
+ ...props
2207
+ }
2208
+ );
2209
+ });
2210
+ EasyTabsList.displayName = "EasyTabsList";
2211
+ var EasyTabsTrigger = React25.forwardRef(({ className, size, children, ...props }, ref) => {
2212
+ return /* @__PURE__ */ jsxs12(
2213
+ TabsTrigger,
2214
+ {
2215
+ ref,
2216
+ className: cn(
2217
+ tabsTriggerVariants({ size }),
2218
+ getTypographyClass("body-medium"),
2219
+ "data-[state=inactive]:text-[var(--ui-text-900)] font-semibold",
2220
+ className,
2221
+ "data-[state=active]:!bg-transparent data-[state=inactive]:bg-transparent !shadow-none data-[state=active]:!shadow-none data-[state=inactive]:!shadow-none"
2222
+ ),
2223
+ ...props,
2224
+ children: [
2225
+ children,
2226
+ /* @__PURE__ */ jsx27("div", { className: "absolute bottom-[-10px] left-0 right-0 h-0.5 bg-gradient-to-r from-[var(--ui-primary-500)] to-[var(--ui-cabir-yellow)] opacity-0 transition-opacity duration-200" })
2227
+ ]
2228
+ }
2229
+ );
2230
+ });
2231
+ EasyTabsTrigger.displayName = "EasyTabsTrigger";
2232
+ var EasyTabsContent = React25.forwardRef(({ className, ...props }, ref) => {
2233
+ return /* @__PURE__ */ jsx27(
2234
+ TabsContent,
2235
+ {
2236
+ ref,
2237
+ className: cn("mt-4 focus-visible:outline-none", className),
2238
+ ...props
2239
+ }
2240
+ );
2241
+ });
2242
+ EasyTabsContent.displayName = "EasyTabsContent";
2243
+
2244
+ // src/components/easy/breadcrumb.tsx
2245
+ import { ChevronRight as ChevronRight2 } from "lucide-react";
2246
+
2247
+ // src/components/ui/breadcrumb.tsx
2248
+ import * as React26 from "react";
2249
+ import { Slot as Slot3 } from "@radix-ui/react-slot";
2250
+ import { ChevronRight, MoreHorizontal } from "lucide-react";
2251
+ import { jsx as jsx28, jsxs as jsxs13 } from "react/jsx-runtime";
2252
+ var Breadcrumb = React26.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx28("nav", { ref, "aria-label": "breadcrumb", ...props }));
2253
+ Breadcrumb.displayName = "Breadcrumb";
2254
+ var BreadcrumbList = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
2255
+ "ol",
2256
+ {
2257
+ ref,
2258
+ className: cn(
2259
+ "flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5",
2260
+ className
2261
+ ),
2262
+ ...props
2263
+ }
2264
+ ));
2265
+ BreadcrumbList.displayName = "BreadcrumbList";
2266
+ var BreadcrumbItem = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
2267
+ "li",
2268
+ {
2269
+ ref,
2270
+ className: cn("inline-flex items-center gap-1.5", className),
2271
+ ...props
2272
+ }
2273
+ ));
2274
+ BreadcrumbItem.displayName = "BreadcrumbItem";
2275
+ var BreadcrumbLink = React26.forwardRef(({ asChild, className, ...props }, ref) => {
2276
+ const Comp = asChild ? Slot3 : "a";
2277
+ return /* @__PURE__ */ jsx28(
2278
+ Comp,
2279
+ {
2280
+ ref,
2281
+ className: cn("transition-colors hover:text-foreground", className),
2282
+ ...props
2283
+ }
2284
+ );
2285
+ });
2286
+ BreadcrumbLink.displayName = "BreadcrumbLink";
2287
+ var BreadcrumbPage = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
2288
+ "span",
2289
+ {
2290
+ ref,
2291
+ role: "link",
2292
+ "aria-disabled": "true",
2293
+ "aria-current": "page",
2294
+ className: cn("font-normal text-foreground", className),
2295
+ ...props
2296
+ }
2297
+ ));
2298
+ BreadcrumbPage.displayName = "BreadcrumbPage";
2299
+ var BreadcrumbSeparator = ({
2300
+ children,
2301
+ className,
2302
+ ...props
2303
+ }) => /* @__PURE__ */ jsx28(
2304
+ "li",
2305
+ {
2306
+ role: "presentation",
2307
+ "aria-hidden": "true",
2308
+ className: cn("[&>svg]:w-3.5 [&>svg]:h-3.5", className),
2309
+ ...props,
2310
+ children: children ?? /* @__PURE__ */ jsx28(ChevronRight, {})
2311
+ }
2312
+ );
2313
+ BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
2314
+ var BreadcrumbEllipsis = ({
2315
+ className,
2316
+ ...props
2317
+ }) => /* @__PURE__ */ jsxs13(
2318
+ "span",
2319
+ {
2320
+ role: "presentation",
2321
+ "aria-hidden": "true",
2322
+ className: cn("flex h-9 w-9 items-center justify-center", className),
2323
+ ...props,
2324
+ children: [
2325
+ /* @__PURE__ */ jsx28(MoreHorizontal, { className: "h-4 w-4" }),
2326
+ /* @__PURE__ */ jsx28("span", { className: "sr-only", children: "More" })
2327
+ ]
2328
+ }
2329
+ );
2330
+ BreadcrumbEllipsis.displayName = "BreadcrumbElipssis";
2331
+
2332
+ // src/components/easy/breadcrumb.tsx
2333
+ import { jsx as jsx29, jsxs as jsxs14 } from "react/jsx-runtime";
2334
+ var defaultBreadcrumbMap = {
2335
+ home: "Anasayfa",
2336
+ "my-account": "Hesab\u0131m",
2337
+ hesabim: "Hesab\u0131m",
2338
+ sozlesmeler: "S\xF6zle\u015Fmeler",
2339
+ "personel-information": "Ki\u015Fisel Bilgilerim",
2340
+ "kisisel-bilgilerim": "Ki\u015Fisel Bilgilerim",
2341
+ "my-past-offers": "Ge\xE7mi\u015F Tekliflerim",
2342
+ "gecmis-tekliflerim": "Ge\xE7mi\u015F Tekliflerim",
2343
+ "my-expert-appointments": "Ekspertiz Randevular\u0131m",
2344
+ "ekspertiz-randevularim": "Ekspertiz Randevular\u0131m",
2345
+ contact: "\u0130leti\u015Fim",
2346
+ iletisim: "\u0130leti\u015Fim"
2347
+ };
2348
+ function formatBreadcrumbLabel(segment) {
2349
+ const cleaned = segment.replace(/[-_]/g, " ").replace(/[^\w\s]/g, "");
2350
+ const words = cleaned.split(/\s+/).filter((word) => word.length > 0);
2351
+ const formattedWords = words.map(
2352
+ (word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()
2353
+ );
2354
+ return formattedWords.join(" ");
2355
+ }
2356
+ function EasyBreadcrumb({
2357
+ items,
2358
+ className,
2359
+ separator,
2360
+ maxItems = 5,
2361
+ showHome = true,
2362
+ homeLabel = "Anasayfa",
2363
+ homeHref = "/"
2364
+ }) {
2365
+ const finalItems = showHome && !items.some((item) => item.href === "/" || item.href === homeHref) ? [{ label: homeLabel, href: homeHref }, ...items] : items;
2366
+ const displayItems = maxItems && finalItems.length > maxItems ? [...finalItems.slice(0, 1), ...finalItems.slice(-(maxItems - 1))] : finalItems;
2367
+ if (displayItems.length <= 1) {
2368
+ return null;
2369
+ }
2370
+ return /* @__PURE__ */ jsx29(Breadcrumb, { className, children: /* @__PURE__ */ jsx29(BreadcrumbList, { children: displayItems.map((item, index) => {
2371
+ const isLast = index === displayItems.length - 1;
2372
+ const isActive = item.isActive ?? isLast;
2373
+ return /* @__PURE__ */ jsxs14("div", { className: "flex items-center", children: [
2374
+ /* @__PURE__ */ jsx29(BreadcrumbItem, { children: isActive ? /* @__PURE__ */ jsx29(BreadcrumbPage, { children: /* @__PURE__ */ jsx29(
2375
+ EasyLabel,
2376
+ {
2377
+ variant: "xsmall",
2378
+ className: cn(
2379
+ "font-semibold text-[var(--ui-text-900)]",
2380
+ "lg:text-sm"
2381
+ ),
2382
+ children: item.label
2383
+ }
2384
+ ) }) : /* @__PURE__ */ jsx29(BreadcrumbLink, { href: item.href || "#", children: /* @__PURE__ */ jsx29(
2385
+ EasyLabel,
2386
+ {
2387
+ variant: "xsmall",
2388
+ className: cn(
2389
+ "font-semibold text-[var(--ui-text-500)]",
2390
+ "lg:text-sm"
2391
+ ),
2392
+ children: item.label
2393
+ }
2394
+ ) }) }),
2395
+ !isLast && /* @__PURE__ */ jsx29(BreadcrumbSeparator, { className: "ml-2", children: separator ?? /* @__PURE__ */ jsx29(
2396
+ ChevronRight2,
2397
+ {
2398
+ size: 10,
2399
+ className: "text-[var(--ui-icon-500)]"
2400
+ }
2401
+ ) })
2402
+ ] }, `${item.label}-${index}`);
2403
+ }) }) });
2404
+ }
2405
+ EasyBreadcrumb.displayName = "EasyBreadcrumb";
2406
+ function generateBreadcrumbItems(pathname) {
2407
+ const segments = pathname.split("/").filter(Boolean);
2408
+ const items = [];
2409
+ if (segments.length > 0) {
2410
+ items.push({
2411
+ label: "Anasayfa",
2412
+ href: "/"
2413
+ });
2414
+ }
2415
+ let currentPath = "";
2416
+ segments.forEach((segment, index) => {
2417
+ currentPath += `/${segment}`;
2418
+ const isLast = index === segments.length - 1;
2419
+ items.push({
2420
+ label: defaultBreadcrumbMap[segment] || formatBreadcrumbLabel(segment),
2421
+ href: isLast ? void 0 : currentPath,
2422
+ isActive: isLast
2423
+ });
2424
+ });
2425
+ return items;
2426
+ }
2427
+
2428
+ // src/components/easy/pagination.tsx
2429
+ import * as React29 from "react";
2430
+ import { ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight4 } from "lucide-react";
2431
+
2432
+ // src/components/ui/pagination.tsx
2433
+ import * as React27 from "react";
2434
+ import { ChevronLeft, ChevronRight as ChevronRight3, MoreHorizontal as MoreHorizontal2 } from "lucide-react";
2435
+ import { jsx as jsx30, jsxs as jsxs15 } from "react/jsx-runtime";
2436
+ var Pagination = ({ className, ...props }) => /* @__PURE__ */ jsx30(
2437
+ "nav",
2438
+ {
2439
+ role: "navigation",
2440
+ "aria-label": "pagination",
2441
+ className: cn("mx-auto flex w-full justify-center", className),
2442
+ ...props
2443
+ }
2444
+ );
2445
+ Pagination.displayName = "Pagination";
2446
+ var PaginationContent = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
2447
+ "ul",
2448
+ {
2449
+ ref,
2450
+ className: cn("flex flex-row items-center gap-1", className),
2451
+ ...props
2452
+ }
2453
+ ));
2454
+ PaginationContent.displayName = "PaginationContent";
2455
+ var PaginationItem = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30("li", { ref, className: cn("", className), ...props }));
2456
+ PaginationItem.displayName = "PaginationItem";
2457
+ var PaginationLink = ({
2458
+ className,
2459
+ isActive,
2460
+ size = "icon",
2461
+ ...props
2462
+ }) => /* @__PURE__ */ jsx30(
2463
+ "a",
2464
+ {
2465
+ "aria-current": isActive ? "page" : void 0,
2466
+ className: cn(
2467
+ "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
2468
+ isActive ? "border border-input bg-background hover:bg-accent hover:text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground",
2469
+ size === "icon" && "h-9 w-9",
2470
+ size === "default" && "h-10 px-4 py-2",
2471
+ className
2472
+ ),
2473
+ ...props
2474
+ }
2475
+ );
2476
+ PaginationLink.displayName = "PaginationLink";
2477
+ var PaginationPrevious = ({
2478
+ className,
2479
+ ...props
2480
+ }) => /* @__PURE__ */ jsxs15(
2481
+ PaginationLink,
2482
+ {
2483
+ "aria-label": "Go to previous page",
2484
+ size: "default",
2485
+ className: cn("gap-1 pl-2.5", className),
2486
+ ...props,
2487
+ children: [
2488
+ /* @__PURE__ */ jsx30(ChevronLeft, { className: "h-4 w-4" }),
2489
+ /* @__PURE__ */ jsx30("span", { children: "Previous" })
2490
+ ]
2491
+ }
2492
+ );
2493
+ PaginationPrevious.displayName = "PaginationPrevious";
2494
+ var PaginationNext = ({
2495
+ className,
2496
+ ...props
2497
+ }) => /* @__PURE__ */ jsxs15(
2498
+ PaginationLink,
2499
+ {
2500
+ "aria-label": "Go to next page",
2501
+ size: "default",
2502
+ className: cn("gap-1 pr-2.5", className),
2503
+ ...props,
2504
+ children: [
2505
+ /* @__PURE__ */ jsx30("span", { children: "Next" }),
2506
+ /* @__PURE__ */ jsx30(ChevronRight3, { className: "h-4 w-4" })
2507
+ ]
2508
+ }
2509
+ );
2510
+ PaginationNext.displayName = "PaginationNext";
2511
+ var PaginationEllipsis = ({
2512
+ className,
2513
+ ...props
2514
+ }) => /* @__PURE__ */ jsxs15(
2515
+ "span",
2516
+ {
2517
+ "aria-hidden": true,
2518
+ className: cn("flex h-9 w-9 items-center justify-center", className),
2519
+ ...props,
2520
+ children: [
2521
+ /* @__PURE__ */ jsx30(MoreHorizontal2, { className: "h-4 w-4" }),
2522
+ /* @__PURE__ */ jsx30("span", { className: "sr-only", children: "More pages" })
2523
+ ]
2524
+ }
2525
+ );
2526
+ PaginationEllipsis.displayName = "PaginationEllipsis";
2527
+
2528
+ // src/components/ui/select.tsx
2529
+ import * as React28 from "react";
2530
+ import * as SelectPrimitive from "@radix-ui/react-select";
2531
+ import { Check as Check2, ChevronDown, ChevronUp } from "lucide-react";
2532
+ import { jsx as jsx31, jsxs as jsxs16 } from "react/jsx-runtime";
2533
+ var Select = SelectPrimitive.Root;
2534
+ var SelectValue = SelectPrimitive.Value;
2535
+ var SelectTrigger = React28.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs16(
2536
+ SelectPrimitive.Trigger,
2537
+ {
2538
+ ref,
2539
+ className: cn(
2540
+ "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
2541
+ className
2542
+ ),
2543
+ ...props,
2544
+ children: [
2545
+ children,
2546
+ /* @__PURE__ */ jsx31(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx31(ChevronDown, { className: "h-4 w-4 opacity-50" }) })
2547
+ ]
2548
+ }
2549
+ ));
2550
+ SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
2551
+ var SelectScrollUpButton = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
2552
+ SelectPrimitive.ScrollUpButton,
2553
+ {
2554
+ ref,
2555
+ className: cn(
2556
+ "flex cursor-default items-center justify-center py-1",
2557
+ className
2558
+ ),
2559
+ ...props,
2560
+ children: /* @__PURE__ */ jsx31(ChevronUp, { className: "h-4 w-4" })
2561
+ }
2562
+ ));
2563
+ SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
2564
+ var SelectScrollDownButton = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
2565
+ SelectPrimitive.ScrollDownButton,
2566
+ {
2567
+ ref,
2568
+ className: cn(
2569
+ "flex cursor-default items-center justify-center py-1",
2570
+ className
2571
+ ),
2572
+ ...props,
2573
+ children: /* @__PURE__ */ jsx31(ChevronDown, { className: "h-4 w-4" })
2574
+ }
2575
+ ));
2576
+ SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
2577
+ var SelectContent = React28.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx31(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs16(
2578
+ SelectPrimitive.Content,
2579
+ {
2580
+ ref,
2581
+ className: cn(
2582
+ "relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-select-content-transform-origin]",
2583
+ position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
2584
+ className
2585
+ ),
2586
+ position,
2587
+ ...props,
2588
+ children: [
2589
+ /* @__PURE__ */ jsx31(SelectScrollUpButton, {}),
2590
+ /* @__PURE__ */ jsx31(
2591
+ SelectPrimitive.Viewport,
2592
+ {
2593
+ className: cn(
2594
+ "p-1",
2595
+ position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
2596
+ ),
2597
+ children
2598
+ }
2599
+ ),
2600
+ /* @__PURE__ */ jsx31(SelectScrollDownButton, {})
2601
+ ]
2602
+ }
2603
+ ) }));
2604
+ SelectContent.displayName = SelectPrimitive.Content.displayName;
2605
+ var SelectLabel = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
2606
+ SelectPrimitive.Label,
2607
+ {
2608
+ ref,
2609
+ className: cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className),
2610
+ ...props
2611
+ }
2612
+ ));
2613
+ SelectLabel.displayName = SelectPrimitive.Label.displayName;
2614
+ var SelectItem = React28.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs16(
2615
+ SelectPrimitive.Item,
2616
+ {
2617
+ ref,
2618
+ className: cn(
2619
+ "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
2620
+ className
2621
+ ),
2622
+ ...props,
2623
+ children: [
2624
+ /* @__PURE__ */ jsx31("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx31(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx31(Check2, { className: "h-4 w-4" }) }) }),
2625
+ /* @__PURE__ */ jsx31(SelectPrimitive.ItemText, { children })
2626
+ ]
2627
+ }
2628
+ ));
2629
+ SelectItem.displayName = SelectPrimitive.Item.displayName;
2630
+ var SelectSeparator = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
2631
+ SelectPrimitive.Separator,
2632
+ {
2633
+ ref,
2634
+ className: cn("-mx-1 my-1 h-px bg-muted", className),
2635
+ ...props
2636
+ }
2637
+ ));
2638
+ SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
2639
+
2640
+ // src/components/easy/pagination.tsx
2641
+ import { jsx as jsx32, jsxs as jsxs17 } from "react/jsx-runtime";
2642
+ function getItemRange(currentPage, pageSize, total) {
2643
+ const start = (currentPage - 1) * pageSize + 1;
2644
+ const end = Math.min(currentPage * pageSize, total);
2645
+ return { start, end };
2646
+ }
2647
+ function generatePageNumbers(currentPage, totalPages) {
2648
+ const pages = [];
2649
+ const maxVisible = 7;
2650
+ if (totalPages <= maxVisible) {
2651
+ for (let i = 1; i <= totalPages; i++) {
2652
+ pages.push(i);
2653
+ }
2654
+ } else {
2655
+ pages.push(1);
2656
+ if (currentPage <= 3) {
2657
+ for (let i = 2; i <= 5; i++) {
2658
+ pages.push(i);
2659
+ }
2660
+ pages.push("ellipsis");
2661
+ pages.push(totalPages);
2662
+ } else if (currentPage >= totalPages - 2) {
2663
+ pages.push("ellipsis");
2664
+ for (let i = totalPages - 4; i <= totalPages; i++) {
2665
+ pages.push(i);
2666
+ }
2667
+ } else {
2668
+ pages.push("ellipsis");
2669
+ pages.push(currentPage - 1);
2670
+ pages.push(currentPage);
2671
+ pages.push(currentPage + 1);
2672
+ pages.push("ellipsis");
2673
+ pages.push(totalPages);
2674
+ }
2675
+ }
2676
+ return pages;
2677
+ }
2678
+ var EasyPagination = React29.forwardRef(
2679
+ ({
2680
+ total,
2681
+ currentPage,
2682
+ pageSize,
2683
+ pageSizeOptions = [10, 25, 50, 100],
2684
+ onPageChange,
2685
+ onPageSizeChange,
2686
+ labels = {},
2687
+ className
2688
+ }, ref) => {
2689
+ const [goToPageValue, setGoToPageValue] = React29.useState(currentPage.toString());
2690
+ const totalPages = Math.ceil(total / pageSize);
2691
+ const { start, end } = getItemRange(currentPage, pageSize, total);
2692
+ const pageNumbers = generatePageNumbers(currentPage, totalPages);
2693
+ const { perPage = "Her Sayfada", goToPage = "Sayfaya Git" } = labels;
2694
+ const handleGoToPage = (e) => {
2695
+ e.preventDefault();
2696
+ const page = parseInt(goToPageValue, 10);
2697
+ if (page >= 1 && page <= totalPages && page !== currentPage) {
2698
+ onPageChange?.(page);
2699
+ }
2700
+ };
2701
+ const handleInputChange = (e) => {
2702
+ const value = e.target.value;
2703
+ if (value === "") {
2704
+ setGoToPageValue("");
2705
+ return;
2706
+ }
2707
+ if (!/^\d+$/.test(value)) {
2708
+ return;
2709
+ }
2710
+ if (value.startsWith("0") && value.length > 1) {
2711
+ return;
2712
+ }
2713
+ if (value === "0") {
2714
+ return;
2715
+ }
2716
+ setGoToPageValue(value);
2717
+ };
2718
+ const handlePageSizeChange = (value) => {
2719
+ const newPageSize = parseInt(value, 10);
2720
+ onPageSizeChange?.(newPageSize);
2721
+ onPageChange?.(1);
2722
+ };
2723
+ React29.useEffect(() => {
2724
+ setGoToPageValue(currentPage.toString());
2725
+ }, [currentPage]);
2726
+ return /* @__PURE__ */ jsxs17(
2727
+ "div",
2728
+ {
2729
+ ref,
2730
+ className: cn("flex w-full items-center justify-between gap-4", className),
2731
+ children: [
2732
+ /* @__PURE__ */ jsxs17(
2733
+ EasyBody,
2734
+ {
2735
+ variant: "medium",
2736
+ className: "text-base font-medium text-[var(--ui-text-500)] whitespace-nowrap",
2737
+ children: [
2738
+ start,
2739
+ " - ",
2740
+ end,
2741
+ " / ",
2742
+ total
2743
+ ]
2744
+ }
2745
+ ),
2746
+ /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-4", children: [
2747
+ /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
2748
+ /* @__PURE__ */ jsx32(
2749
+ EasyBody,
2750
+ {
2751
+ variant: "medium",
2752
+ className: "text-[var(--ui-text-500)] whitespace-nowrap font-medium",
2753
+ children: perPage
2754
+ }
2755
+ ),
2756
+ /* @__PURE__ */ jsxs17(Select, { value: pageSize.toString(), onValueChange: handlePageSizeChange, children: [
2757
+ /* @__PURE__ */ jsx32(SelectTrigger, { className: "h-8 w-[80px] border-[var(--ui-border-200)] bg-[var(--ui-background-0)] text-base font-medium text-[var(--ui-text-900)] rounded-sm px-3 focus:outline-none focus:ring-0 focus:ring-offset-0 focus:shadow-[0_0_0_1px_var(--ui-background-0),_0_0_0_2px_var(--ui-border-200)]", children: /* @__PURE__ */ jsx32(SelectValue, {}) }),
2758
+ /* @__PURE__ */ jsx32(SelectContent, { children: pageSizeOptions.map((size) => /* @__PURE__ */ jsx32(SelectItem, { value: size.toString(), children: size }, size)) })
2759
+ ] })
2760
+ ] }),
2761
+ /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
2762
+ /* @__PURE__ */ jsx32(
2763
+ EasyBody,
2764
+ {
2765
+ variant: "medium",
2766
+ className: "text-[var(--ui-text-500)] whitespace-nowrap font-medium",
2767
+ children: goToPage
2768
+ }
2769
+ ),
2770
+ /* @__PURE__ */ jsx32("form", { onSubmit: handleGoToPage, className: "flex items-center gap-2", children: /* @__PURE__ */ jsx32(
2771
+ Input,
2772
+ {
2773
+ type: "text",
2774
+ inputMode: "numeric",
2775
+ value: goToPageValue,
2776
+ onChange: handleInputChange,
2777
+ className: "h-8 w-[50px] px-3 text-center text-base rounded-sm"
2778
+ }
2779
+ ) })
2780
+ ] }),
2781
+ /* @__PURE__ */ jsx32(Pagination, { children: /* @__PURE__ */ jsxs17(PaginationContent, { children: [
2782
+ /* @__PURE__ */ jsx32(PaginationItem, { children: /* @__PURE__ */ jsx32(
2783
+ EasyButton,
2784
+ {
2785
+ variant: "text",
2786
+ size: "small",
2787
+ onClick: () => onPageChange?.(currentPage - 1),
2788
+ disabled: currentPage === 1,
2789
+ className: "h-8 w-8 p-0 rounded-sm border border-[var(--ui-border-200)] bg-[var(--ui-background-200)] hover:bg-[var(--ui-background-100)] disabled:opacity-50",
2790
+ children: /* @__PURE__ */ jsx32(ChevronLeft2, { className: "h-4 w-4" })
2791
+ }
2792
+ ) }),
2793
+ pageNumbers.map((page, index) => {
2794
+ if (page === "ellipsis") {
2795
+ return /* @__PURE__ */ jsx32(PaginationItem, { children: /* @__PURE__ */ jsx32(PaginationEllipsis, { className: "h-8 text-[var(--ui-text-600)]" }) }, `ellipsis-${index}`);
2796
+ }
2797
+ const isActive = page === currentPage;
2798
+ return /* @__PURE__ */ jsx32(PaginationItem, { children: /* @__PURE__ */ jsx32(
2799
+ EasyButton,
2800
+ {
2801
+ variant: isActive ? "primary" : "text",
2802
+ size: "small",
2803
+ onClick: () => onPageChange?.(page),
2804
+ className: cn(
2805
+ "h-8 min-w-8 px-3 rounded-sm font-medium transition-all",
2806
+ isActive ? "bg-[var(--ui-primary-500)] text-white hover:bg-[var(--ui-primary-700)]" : " text-[var(--ui-text-900)] hover:bg-[var(--ui-background-100)]"
2807
+ ),
2808
+ children: page
2809
+ }
2810
+ ) }, page);
2811
+ }),
2812
+ /* @__PURE__ */ jsx32(PaginationItem, { children: /* @__PURE__ */ jsx32(
2813
+ EasyButton,
2814
+ {
2815
+ variant: "text",
2816
+ size: "small",
2817
+ onClick: () => onPageChange?.(currentPage + 1),
2818
+ disabled: currentPage === totalPages,
2819
+ className: "h-8 w-8 p-0 rounded-sm border border-[var(--ui-border-200)] bg-[var(--ui-background-200)] hover:bg-[var(--ui-background-100)] disabled:opacity-50",
2820
+ children: /* @__PURE__ */ jsx32(ChevronRight4, { className: "h-4 w-4" })
2821
+ }
2822
+ ) })
2823
+ ] }) })
2824
+ ] })
2825
+ ]
2826
+ }
2827
+ );
2828
+ }
2829
+ );
2830
+ EasyPagination.displayName = "EasyPagination";
2831
+
2832
+ // src/components/easy/otp.tsx
2833
+ import * as React32 from "react";
2834
+ import { AlertCircle as AlertCircle6, Mail, Smartphone } from "lucide-react";
2835
+
2836
+ // src/components/ui/input-otp.tsx
2837
+ import * as React30 from "react";
2838
+ import { OTPInput, OTPInputContext } from "input-otp";
2839
+ import { Dot } from "lucide-react";
2840
+ import { jsx as jsx33, jsxs as jsxs18 } from "react/jsx-runtime";
2841
+ var InputOTP = React30.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx33(
2842
+ OTPInput,
2843
+ {
2844
+ ref,
2845
+ containerClassName: cn(
2846
+ "flex items-center gap-2 has-[:disabled]:opacity-50",
2847
+ containerClassName
2848
+ ),
2849
+ className: cn("disabled:cursor-not-allowed", className),
2850
+ ...props
2851
+ }
2852
+ ));
2853
+ InputOTP.displayName = "InputOTP";
2854
+ var InputOTPGroup = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33("div", { ref, className: cn("flex items-center", className), ...props }));
2855
+ InputOTPGroup.displayName = "InputOTPGroup";
2856
+ var InputOTPSlot = React30.forwardRef(({ index, className, ...props }, ref) => {
2857
+ const inputOTPContext = React30.useContext(OTPInputContext);
2858
+ const slot = inputOTPContext.slots[index];
2859
+ const char = slot?.char ?? "";
2860
+ const hasFakeCaret = slot?.hasFakeCaret ?? false;
2861
+ const isActive = slot?.isActive ?? false;
2862
+ return /* @__PURE__ */ jsxs18(
2863
+ "div",
2864
+ {
2865
+ ref,
2866
+ className: cn(
2867
+ "relative flex h-10 w-10 items-center justify-center border-y border-r border-input text-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md",
2868
+ isActive && "z-10 ring-2 ring-ring ring-offset-background",
2869
+ className
2870
+ ),
2871
+ ...props,
2872
+ children: [
2873
+ char,
2874
+ hasFakeCaret && /* @__PURE__ */ jsx33("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsx33("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" }) })
2875
+ ]
2876
+ }
2877
+ );
2878
+ });
2879
+ InputOTPSlot.displayName = "InputOTPSlot";
2880
+ var InputOTPSeparator = React30.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx33("div", { ref, role: "separator", ...props, children: /* @__PURE__ */ jsx33(Dot, {}) }));
2881
+ InputOTPSeparator.displayName = "InputOTPSeparator";
2882
+
2883
+ // src/components/ui/drawer.tsx
2884
+ import * as React31 from "react";
2885
+ import { Drawer as DrawerPrimitive } from "vaul";
2886
+ import { jsx as jsx34, jsxs as jsxs19 } from "react/jsx-runtime";
2887
+ var Drawer = ({
2888
+ shouldScaleBackground = true,
2889
+ ...props
2890
+ }) => /* @__PURE__ */ jsx34(
2891
+ DrawerPrimitive.Root,
2892
+ {
2893
+ shouldScaleBackground,
2894
+ ...props
2895
+ }
2896
+ );
2897
+ Drawer.displayName = "Drawer";
2898
+ var DrawerTrigger = DrawerPrimitive.Trigger;
2899
+ var DrawerPortal = DrawerPrimitive.Portal;
2900
+ var DrawerClose = DrawerPrimitive.Close;
2901
+ var DrawerOverlay = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
2902
+ DrawerPrimitive.Overlay,
2903
+ {
2904
+ ref,
2905
+ className: cn("fixed inset-0 z-50 bg-black/90", className),
2906
+ ...props
2907
+ }
2908
+ ));
2909
+ DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
2910
+ var DrawerContent = React31.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs19(DrawerPortal, { children: [
2911
+ /* @__PURE__ */ jsx34(DrawerOverlay, {}),
2912
+ /* @__PURE__ */ jsxs19(
2913
+ DrawerPrimitive.Content,
2914
+ {
2915
+ ref,
2916
+ className: cn(
2917
+ "fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-[var(--ui-background-0)]",
2918
+ className
2919
+ ),
2920
+ ...props,
2921
+ children: [
2922
+ /* @__PURE__ */ jsx34("div", { className: "mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted" }),
2923
+ children
2924
+ ]
2925
+ }
2926
+ )
2927
+ ] }));
2928
+ DrawerContent.displayName = "DrawerContent";
2929
+ var DrawerHeader = ({
2930
+ className,
2931
+ ...props
2932
+ }) => /* @__PURE__ */ jsx34(
2933
+ "div",
2934
+ {
2935
+ className: cn("grid gap-1.5 p-4 text-center sm:text-left", className),
2936
+ ...props
2937
+ }
2938
+ );
2939
+ DrawerHeader.displayName = "DrawerHeader";
2940
+ var DrawerFooter = ({
2941
+ className,
2942
+ ...props
2943
+ }) => /* @__PURE__ */ jsx34(
2944
+ "div",
2945
+ {
2946
+ className: cn("mt-auto flex flex-col gap-2 p-4", className),
2947
+ ...props
2948
+ }
2949
+ );
2950
+ DrawerFooter.displayName = "DrawerFooter";
2951
+ var DrawerTitle = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
2952
+ DrawerPrimitive.Title,
2953
+ {
2954
+ ref,
2955
+ className: cn(
2956
+ "text-lg font-semibold leading-none tracking-tight",
2957
+ className
2958
+ ),
2959
+ ...props
2960
+ }
2961
+ ));
2962
+ DrawerTitle.displayName = DrawerPrimitive.Title.displayName;
2963
+ var DrawerDescription = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
2964
+ DrawerPrimitive.Description,
2965
+ {
2966
+ ref,
2967
+ className: cn("text-sm text-muted-foreground", className),
2968
+ ...props
2969
+ }
2970
+ ));
2971
+ DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
2972
+
2973
+ // src/components/easy/otp.tsx
2974
+ import { jsx as jsx35, jsxs as jsxs20 } from "react/jsx-runtime";
2975
+ var EasyOtp = React32.forwardRef(
2976
+ ({
2977
+ value,
2978
+ onChange,
2979
+ length = 6,
2980
+ error,
2981
+ disabled = false,
2982
+ autoFocus = false,
2983
+ className,
2984
+ slotClassName
2985
+ }, ref) => {
2986
+ return /* @__PURE__ */ jsxs20("div", { ref, className: cn("flex flex-col items-center w-full", className), children: [
2987
+ /* @__PURE__ */ jsx35("div", { className: "w-full overflow-hidden relative", children: /* @__PURE__ */ jsx35(
2988
+ InputOTP,
2989
+ {
2990
+ maxLength: length,
2991
+ value,
2992
+ onChange,
2993
+ disabled,
2994
+ autoFocus,
2995
+ className: "gap-3",
2996
+ containerClassName: "w-full max-w-full overflow-hidden justify-center relative",
2997
+ children: /* @__PURE__ */ jsx35(InputOTPGroup, { className: "flex p-1 gap-3.5 justify-center", children: Array.from({ length }).map((_, index) => /* @__PURE__ */ jsx35(
2998
+ InputOTPSlot,
2999
+ {
3000
+ index,
3001
+ className: cn(
3002
+ "h-11 md:h-[50px] lg:h-[60px] w-[35px] lg:w-[45px] rounded-[8px] border text-center",
3003
+ "text-[18px] leading-[28px] tracking-[-0.64px] font-semibold",
3004
+ "border-[var(--ui-border-200)]",
3005
+ "focus:border-[var(--ui-primary-500)]",
3006
+ "disabled:cursor-not-allowed disabled:opacity-60",
3007
+ error && "border-[var(--ui-danger-base)]",
3008
+ slotClassName
3009
+ )
3010
+ },
3011
+ index
3012
+ )) })
3013
+ }
3014
+ ) }),
3015
+ error && /* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-1 mt-3", children: [
3016
+ /* @__PURE__ */ jsx35(AlertCircle6, { className: "size-4 text-[var(--ui-danger-base)]" }),
3017
+ /* @__PURE__ */ jsx35(EasyBody, { variant: "small", className: "text-[var(--ui-danger-base)]", children: error })
3018
+ ] })
3019
+ ] });
3020
+ }
3021
+ );
3022
+ EasyOtp.displayName = "EasyOtp";
3023
+ var formatPhoneNumber = (phone) => {
3024
+ if (phone.length >= 10) {
3025
+ const start = phone.slice(1, 4);
3026
+ const end = phone.slice(-2);
3027
+ return `+90 (${start}) *** ** ${end}`;
3028
+ }
3029
+ return phone;
3030
+ };
3031
+ var formatEmail = (emailAddress) => {
3032
+ const [localPart, domain] = emailAddress.split("@");
3033
+ if (localPart && domain) {
3034
+ const visibleStart = localPart.slice(0, 2);
3035
+ const visibleEnd = localPart.slice(-1);
3036
+ return `${visibleStart}***${visibleEnd}@${domain}`;
3037
+ }
3038
+ return emailAddress;
3039
+ };
3040
+ var EasyOtpModal = ({
3041
+ open,
3042
+ onOpenChange,
3043
+ phoneNumber,
3044
+ email,
3045
+ title,
3046
+ description,
3047
+ onVerify,
3048
+ onResend,
3049
+ onCancel,
3050
+ length = 6,
3051
+ resendCooldown = 180,
3052
+ className,
3053
+ contentClassName
3054
+ }) => {
3055
+ const [otpValue, setOtpValue] = React32.useState("");
3056
+ const [isVerifying, setIsVerifying] = React32.useState(false);
3057
+ const [isResending, setIsResending] = React32.useState(false);
3058
+ const [timeLeft, setTimeLeft] = React32.useState(resendCooldown);
3059
+ const [error, setError] = React32.useState(null);
3060
+ const isMobile = useIsMobile();
3061
+ const defaultTitle = email ? "E-posta Adresi Do\u011Frulama" : "Telefon Do\u011Frulama";
3062
+ const modalTitle = title || defaultTitle;
3063
+ React32.useEffect(() => {
3064
+ if (timeLeft > 0 && open) {
3065
+ const timer = setTimeout(() => setTimeLeft(timeLeft - 1), 1e3);
3066
+ return () => clearTimeout(timer);
3067
+ }
3068
+ }, [timeLeft, open]);
3069
+ React32.useEffect(() => {
3070
+ if (open) {
3071
+ setTimeLeft(resendCooldown);
3072
+ setOtpValue("");
3073
+ setError(null);
3074
+ }
3075
+ }, [open, resendCooldown]);
3076
+ const handleVerify = async () => {
3077
+ if (otpValue.length !== length) {
3078
+ setError(`L\xFCtfen ${length} haneli do\u011Frulama kodunu girin`);
3079
+ return;
3080
+ }
3081
+ setIsVerifying(true);
3082
+ setError(null);
3083
+ try {
3084
+ const result = await onVerify(otpValue);
3085
+ if (result.success) {
3086
+ onOpenChange(false);
3087
+ } else {
3088
+ setError(result.error || "Do\u011Frulama kodu hatal\u0131");
3089
+ }
3090
+ } catch (_err) {
3091
+ setError("Bir hata olu\u015Ftu, l\xFCtfen tekrar deneyin");
3092
+ } finally {
3093
+ setIsVerifying(false);
3094
+ }
3095
+ };
3096
+ const handleResend = async () => {
3097
+ setIsResending(true);
3098
+ setError(null);
3099
+ try {
3100
+ const result = await onResend();
3101
+ if (result.success) {
3102
+ setTimeLeft(resendCooldown);
3103
+ setOtpValue("");
3104
+ } else {
3105
+ setError(result.error || "Kod g\xF6nderilemedi");
3106
+ }
3107
+ } catch (_err) {
3108
+ setError("Bir hata olu\u015Ftu, l\xFCtfen tekrar deneyin");
3109
+ } finally {
3110
+ setIsResending(false);
3111
+ }
3112
+ };
3113
+ const handleCancel = () => {
3114
+ onCancel();
3115
+ onOpenChange(false);
3116
+ };
3117
+ const getDefaultDescription = () => {
3118
+ if (email) {
3119
+ return `${formatEmail(email)} adresine g\xF6nderdi\u011Fimiz ${length} haneli do\u011Frulama kodunu gir`;
3120
+ }
3121
+ if (phoneNumber) {
3122
+ return `${formatPhoneNumber(phoneNumber)} nolu cep telefonuna g\xF6nderdi\u011Fimiz ${length} haneli do\u011Frulama kodunu gir`;
3123
+ }
3124
+ return `G\xF6nderdi\u011Fimiz ${length} haneli do\u011Frulama kodunu gir`;
3125
+ };
3126
+ const canResend = timeLeft === 0 && !isResending;
3127
+ const isVerifyDisabled = otpValue.length !== length || isVerifying;
3128
+ const modalContent = /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center", children: [
3129
+ !isMobile && /* @__PURE__ */ jsx35("div", { className: "flex h-16 w-16 items-center justify-center rounded-full border-2 border-[var(--ui-border-200)] mb-3", children: email ? /* @__PURE__ */ jsx35(Mail, { className: "size-6 text-[var(--ui-text-900)]" }) : /* @__PURE__ */ jsx35(Smartphone, { className: "size-6 text-[var(--ui-text-900)]" }) }),
3130
+ /* @__PURE__ */ jsx35(EasyLabel, { variant: "large", className: "text-[var(--ui-primary-500)] mb-1", children: modalTitle }),
3131
+ /* @__PURE__ */ jsx35("div", { className: "text-center space-y-2", children: /* @__PURE__ */ jsx35(EasyBody, { variant: "small", className: "text-[var(--ui-text-500)] font-normal", children: description || getDefaultDescription() }) }),
3132
+ !isMobile && /* @__PURE__ */ jsx35(Separator, { className: "my-6" }),
3133
+ /* @__PURE__ */ jsx35("div", { className: "text-center mb-3", children: /* @__PURE__ */ jsxs20(EasyBody, { variant: "small", className: "text-[var(--ui-text-500)]", children: [
3134
+ "Kalan Zaman: ",
3135
+ /* @__PURE__ */ jsxs20("span", { className: "font-medium text-[var(--ui-text-900)]", children: [
3136
+ timeLeft,
3137
+ " Saniye"
3138
+ ] })
3139
+ ] }) }),
3140
+ /* @__PURE__ */ jsx35(
3141
+ EasyOtp,
3142
+ {
3143
+ value: otpValue,
3144
+ onChange: setOtpValue,
3145
+ length,
3146
+ error,
3147
+ autoFocus: true
3148
+ }
3149
+ ),
3150
+ /* @__PURE__ */ jsx35("div", { className: "text-center mt-2", children: /* @__PURE__ */ jsxs20(EasyBody, { variant: "small", className: "text-[var(--ui-text-500)]", children: [
3151
+ "Kod gelmedi mi?",
3152
+ " ",
3153
+ /* @__PURE__ */ jsx35(
3154
+ "button",
3155
+ {
3156
+ type: "button",
3157
+ onClick: handleResend,
3158
+ disabled: !canResend,
3159
+ className: cn(
3160
+ "underline transition-colors",
3161
+ canResend ? "text-[var(--ui-primary-900)] hover:text-[var(--ui-primary-600)]" : "text-[var(--ui-text-400)] cursor-not-allowed"
3162
+ ),
3163
+ children: isResending ? "G\xF6nderiliyor..." : "Tekrar G\xF6nder"
3164
+ }
3165
+ )
3166
+ ] }) }),
3167
+ !isMobile && /* @__PURE__ */ jsx35(Separator, { className: "my-6" })
3168
+ ] });
3169
+ const footer = /* @__PURE__ */ jsx35("div", { className: "flex flex-col gap-3 w-full", children: /* @__PURE__ */ jsxs20("div", { className: "flex flex-row gap-4 w-full", children: [
3170
+ /* @__PURE__ */ jsx35(
3171
+ EasyButton,
3172
+ {
3173
+ variant: "important",
3174
+ appearance: "stroke",
3175
+ onClick: handleCancel,
3176
+ disabled: isVerifying,
3177
+ className: "flex-1 lg:order-1 order-2",
3178
+ children: "Vazge\xE7"
3179
+ }
3180
+ ),
3181
+ /* @__PURE__ */ jsx35(
3182
+ EasyButton,
3183
+ {
3184
+ variant: "primary",
3185
+ onClick: handleVerify,
3186
+ disabled: isVerifyDisabled,
3187
+ className: "flex-1 lg:order-2 order-1",
3188
+ children: isVerifying ? "Do\u011Frulan\u0131yor..." : "Kodu Onayla"
3189
+ }
3190
+ )
3191
+ ] }) });
3192
+ if (isMobile) {
3193
+ return /* @__PURE__ */ jsx35(Drawer, { open, onOpenChange, children: /* @__PURE__ */ jsx35(DrawerContent, { className: "!rounded-t-[32px]", children: /* @__PURE__ */ jsxs20("div", { className: "!rounded-t-[32px] overflow-auto mb-[60px]", children: [
3194
+ /* @__PURE__ */ jsx35(DrawerHeader, { className: "text-left border-b border-[var(--ui-border-200)]", children: /* @__PURE__ */ jsx35("div", { className: "flex flex-row items-start justify-between", children: /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-start gap-2", children: [
3195
+ modalTitle && /* @__PURE__ */ jsx35(DrawerTitle, { className: "text-lg font-medium text-[var(--ui-text-900)]", children: modalTitle }),
3196
+ description && /* @__PURE__ */ jsx35(DrawerDescription, { className: "text-left", children: description || getDefaultDescription() })
3197
+ ] }) }) }),
3198
+ /* @__PURE__ */ jsx35("div", { className: cn("mt-6 px-6 pt-6 pb-6", contentClassName), children: modalContent }),
3199
+ /* @__PURE__ */ jsx35(DrawerFooter, { className: "pt-0", children: footer })
3200
+ ] }) }) });
3201
+ }
3202
+ return /* @__PURE__ */ jsx35(ShadcnDialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs20(
3203
+ ShadcnDialogContent,
3204
+ {
3205
+ className: cn(
3206
+ "overflow-auto max-h-[calc(100%-40px)] sm:max-w-[400px] px-6 py-8 pb-4 lg:pb-8 gap-0 rounded-lg",
3207
+ "[&>button:last-child]:hidden",
3208
+ contentClassName
3209
+ ),
3210
+ children: [
3211
+ /* @__PURE__ */ jsxs20(ShadcnDialogHeader, { className: "hidden", children: [
3212
+ /* @__PURE__ */ jsx35(ShadcnDialogTitle, { className: "sr-only", children: modalTitle }),
3213
+ /* @__PURE__ */ jsx35(ShadcnDialogDescription, { className: "sr-only", children: description || getDefaultDescription() })
3214
+ ] }),
3215
+ /* @__PURE__ */ jsx35("div", { className, children: modalContent }),
3216
+ /* @__PURE__ */ jsx35("div", { className: "mt-0", children: footer })
3217
+ ]
3218
+ }
3219
+ ) });
3220
+ };
3221
+ EasyOtpModal.displayName = "EasyOtpModal";
3222
+
3223
+ // src/components/easy/select.tsx
3224
+ import * as React36 from "react";
3225
+ import { ChevronDown as ChevronDown2, Search as Search2, X as X3 } from "lucide-react";
3226
+
3227
+ // src/components/ui/command.tsx
3228
+ import * as React33 from "react";
3229
+ import { Command as CommandPrimitive } from "cmdk";
3230
+ import { Search } from "lucide-react";
3231
+ import { jsx as jsx36, jsxs as jsxs21 } from "react/jsx-runtime";
3232
+ var Command = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
3233
+ CommandPrimitive,
3234
+ {
3235
+ ref,
3236
+ className: cn(
3237
+ "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
3238
+ className
3239
+ ),
3240
+ ...props
3241
+ }
3242
+ ));
3243
+ Command.displayName = CommandPrimitive.displayName;
3244
+ var CommandInput = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs21("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
3245
+ /* @__PURE__ */ jsx36(Search, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
3246
+ /* @__PURE__ */ jsx36(
3247
+ CommandPrimitive.Input,
3248
+ {
3249
+ ref,
3250
+ className: cn(
3251
+ "flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
3252
+ className
3253
+ ),
3254
+ ...props
3255
+ }
3256
+ )
3257
+ ] }));
3258
+ CommandInput.displayName = CommandPrimitive.Input.displayName;
3259
+ var CommandList = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
3260
+ CommandPrimitive.List,
3261
+ {
3262
+ ref,
3263
+ className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className),
3264
+ ...props
3265
+ }
3266
+ ));
3267
+ CommandList.displayName = CommandPrimitive.List.displayName;
3268
+ var CommandEmpty = React33.forwardRef((props, ref) => /* @__PURE__ */ jsx36(
3269
+ CommandPrimitive.Empty,
3270
+ {
3271
+ ref,
3272
+ className: "py-6 text-center text-sm",
3273
+ ...props
3274
+ }
3275
+ ));
3276
+ CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
3277
+ var CommandGroup = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
3278
+ CommandPrimitive.Group,
3279
+ {
3280
+ ref,
3281
+ className: cn(
3282
+ "overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
3283
+ className
3284
+ ),
3285
+ ...props
3286
+ }
3287
+ ));
3288
+ CommandGroup.displayName = CommandPrimitive.Group.displayName;
3289
+ var CommandSeparator = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
3290
+ CommandPrimitive.Separator,
3291
+ {
3292
+ ref,
3293
+ className: cn("-mx-1 h-px bg-border", className),
3294
+ ...props
3295
+ }
3296
+ ));
3297
+ CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
3298
+ var CommandItem = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
3299
+ CommandPrimitive.Item,
3300
+ {
3301
+ ref,
3302
+ className: cn(
3303
+ "relative flex cursor-default gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected='true']:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
3304
+ className
3305
+ ),
3306
+ ...props
3307
+ }
3308
+ ));
3309
+ CommandItem.displayName = CommandPrimitive.Item.displayName;
3310
+ var CommandShortcut = ({
3311
+ className,
3312
+ ...props
3313
+ }) => {
3314
+ return /* @__PURE__ */ jsx36(
3315
+ "span",
3316
+ {
3317
+ className: cn(
3318
+ "ml-auto text-xs tracking-widest text-muted-foreground",
3319
+ className
3320
+ ),
3321
+ ...props
3322
+ }
3323
+ );
3324
+ };
3325
+ CommandShortcut.displayName = "CommandShortcut";
3326
+
3327
+ // src/components/ui/popover.tsx
3328
+ import * as React34 from "react";
3329
+ import * as PopoverPrimitive from "@radix-ui/react-popover";
3330
+ import { jsx as jsx37 } from "react/jsx-runtime";
3331
+ var Popover = PopoverPrimitive.Root;
3332
+ var PopoverTrigger = PopoverPrimitive.Trigger;
3333
+ var PopoverContent = React34.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx37(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx37(
3334
+ PopoverPrimitive.Content,
3335
+ {
3336
+ ref,
3337
+ align,
3338
+ sideOffset,
3339
+ className: cn(
3340
+ "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
3341
+ className
3342
+ ),
3343
+ ...props
3344
+ }
3345
+ ) }));
3346
+ PopoverContent.displayName = PopoverPrimitive.Content.displayName;
3347
+
3348
+ // src/components/ui/scroll-area.tsx
3349
+ import * as React35 from "react";
3350
+ import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
3351
+ import { jsx as jsx38, jsxs as jsxs22 } from "react/jsx-runtime";
3352
+ var ScrollArea = React35.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs22(
3353
+ ScrollAreaPrimitive.Root,
3354
+ {
3355
+ ref,
3356
+ className: cn("relative overflow-hidden", className),
3357
+ ...props,
3358
+ children: [
3359
+ /* @__PURE__ */ jsx38(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
3360
+ /* @__PURE__ */ jsx38(ScrollBar, {}),
3361
+ /* @__PURE__ */ jsx38(ScrollAreaPrimitive.Corner, {})
3362
+ ]
3363
+ }
3364
+ ));
3365
+ ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
3366
+ var ScrollBar = React35.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx38(
3367
+ ScrollAreaPrimitive.ScrollAreaScrollbar,
3368
+ {
3369
+ ref,
3370
+ orientation,
3371
+ className: cn(
3372
+ "flex touch-none select-none transition-colors",
3373
+ orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]",
3374
+ orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]",
3375
+ className
3376
+ ),
3377
+ ...props,
3378
+ children: /* @__PURE__ */ jsx38(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
3379
+ }
3380
+ ));
3381
+ ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
3382
+
3383
+ // src/components/easy/select.tsx
3384
+ import { Fragment, jsx as jsx39, jsxs as jsxs23 } from "react/jsx-runtime";
3385
+ var EasySelect = React36.forwardRef(
3386
+ ({
3387
+ label,
3388
+ bottomSheetLabel,
3389
+ helperText,
3390
+ errorText,
3391
+ placeholder = "Se\xE7iniz...",
3392
+ searchPlaceholder = "Ara...",
3393
+ emptyMessage = "Sonu\xE7 bulunamad\u0131",
3394
+ options,
3395
+ value,
3396
+ onValueChange,
3397
+ disabled = false,
3398
+ className,
3399
+ id,
3400
+ name,
3401
+ ...props
3402
+ }, ref) => {
3403
+ const [open, setOpen] = React36.useState(false);
3404
+ const [searchValue, setSearchValue] = React36.useState("");
3405
+ const isMobile = useIsMobile();
3406
+ const selectedOption = options.find((option) => option.value === value);
3407
+ const filteredOptions = React36.useMemo(
3408
+ () => options.filter(
3409
+ (option) => option.label.toLocaleLowerCase("tr").includes(searchValue.toLocaleLowerCase("tr"))
3410
+ ),
3411
+ [options, searchValue]
3412
+ );
3413
+ const handleSelect = (selectedValue) => {
3414
+ if (selectedValue === value) {
3415
+ onValueChange?.("");
3416
+ } else {
3417
+ onValueChange?.(selectedValue);
3418
+ }
3419
+ setOpen(false);
3420
+ setSearchValue("");
3421
+ };
3422
+ const triggerClassName = cn(
3423
+ "flex h-12 w-full items-center justify-between rounded-lg border px-4 py-3 text-base",
3424
+ "bg-[var(--ui-background-0)] text-[var(--ui-text-900)]",
3425
+ "focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 focus-visible:shadow-[0_0_0_1px_var(--ui-background-0),_0_0_0_2px_var(--ui-border-200)]",
3426
+ "disabled:cursor-not-allowed disabled:opacity-50",
3427
+ "hover:bg-[var(--ui-background-0)]",
3428
+ errorText && "border-[var(--ui-danger-base)]",
3429
+ !value && "text-[var(--ui-text-400)]",
3430
+ className
3431
+ );
3432
+ const content = /* @__PURE__ */ jsxs23(Fragment, { children: [
3433
+ /* @__PURE__ */ jsxs23("div", { className: "relative mx-3 mt-3", children: [
3434
+ /* @__PURE__ */ jsx39(Search2, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
3435
+ /* @__PURE__ */ jsx39(
3436
+ "input",
3437
+ {
3438
+ placeholder: searchPlaceholder,
3439
+ value: searchValue,
3440
+ onChange: (e) => setSearchValue(e.target.value),
3441
+ className: "flex h-10 w-full rounded-md border border-input bg-background px-10 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
3442
+ style: { fontSize: "16px" }
3443
+ }
3444
+ ),
3445
+ searchValue && /* @__PURE__ */ jsx39(
3446
+ ShadcnButton,
3447
+ {
3448
+ variant: "link",
3449
+ size: "icon",
3450
+ className: "absolute right-2 top-1/2 h-5 w-5 -translate-y-1/2 rounded-full bg-transparent p-0 text-muted-foreground hover:bg-muted",
3451
+ onClick: () => setSearchValue(""),
3452
+ type: "button",
3453
+ children: /* @__PURE__ */ jsx39(X3, { className: "h-3 w-3" })
3454
+ }
3455
+ )
3456
+ ] }),
3457
+ /* @__PURE__ */ jsxs23(CommandList, { className: "max-h-72 overflow-auto bg-[var(--ui-background-0)]", children: [
3458
+ /* @__PURE__ */ jsx39(CommandEmpty, { children: emptyMessage }),
3459
+ /* @__PURE__ */ jsx39(CommandGroup, { className: "px-3", children: filteredOptions.map((option, index) => {
3460
+ const isSelected = value === option.value;
3461
+ const isLast = index === filteredOptions.length - 1;
3462
+ return /* @__PURE__ */ jsxs23(
3463
+ CommandItem,
3464
+ {
3465
+ value: option.value,
3466
+ onSelect: () => handleSelect(option.value),
3467
+ disabled: option.disabled,
3468
+ className: cn(
3469
+ // 12px dikey, ~12px yatay padding
3470
+ "flex cursor-pointer items-center gap-3 rounded-none px-3 py-3 text-sm",
3471
+ "data-[selected=true]:bg-[var(--ui-background-0)] data-[selected=true]:text-[var(--ui-text-900)]",
3472
+ "hover:bg-[var(--ui-background-0)]",
3473
+ !isLast && "border-b border-[var(--ui-border)]"
3474
+ ),
3475
+ children: [
3476
+ /* @__PURE__ */ jsx39(
3477
+ "span",
3478
+ {
3479
+ className: cn(
3480
+ "flex h-4 w-4 items-center justify-center rounded-full",
3481
+ isSelected ? "bg-[var(--ui-primary-500)]" : "border border-[var(--ui-text-300)] bg-transparent"
3482
+ ),
3483
+ children: isSelected && /* @__PURE__ */ jsx39("span", { className: "block h-2.5 w-2.5 rounded-full bg-white" })
3484
+ }
3485
+ ),
3486
+ /* @__PURE__ */ jsx39(
3487
+ "span",
3488
+ {
3489
+ className: cn(
3490
+ "truncate",
3491
+ isSelected ? "font-semibold text-[var(--ui-text-900)]" : "font-normal text-[var(--ui-text-500)]"
3492
+ ),
3493
+ children: option.label
3494
+ }
3495
+ )
3496
+ ]
3497
+ },
3498
+ option.value
3499
+ );
3500
+ }) })
3501
+ ] })
3502
+ ] });
3503
+ return /* @__PURE__ */ jsxs23("div", { className: "flex w-full flex-col gap-1.5", children: [
3504
+ label && /* @__PURE__ */ jsx39(
3505
+ EasyLabel,
3506
+ {
3507
+ as: "label",
3508
+ htmlFor: id,
3509
+ variant: "medium",
3510
+ className: "text-[var(--ui-text-900)]",
3511
+ children: label
3512
+ }
3513
+ ),
3514
+ isMobile ? /* @__PURE__ */ jsxs23(Drawer, { open, onOpenChange: setOpen, children: [
3515
+ /* @__PURE__ */ jsx39(DrawerTrigger, { asChild: true, children: /* @__PURE__ */ jsxs23(
3516
+ ShadcnButton,
3517
+ {
3518
+ ref,
3519
+ className: cn(triggerClassName, "hover:bg-[var(--ui-background-0)] hover:text-[var(--ui-text-900)]"),
3520
+ disabled,
3521
+ id,
3522
+ name,
3523
+ type: "button",
3524
+ ...props,
3525
+ children: [
3526
+ /* @__PURE__ */ jsx39("span", { className: "truncate text-left", children: selectedOption ? selectedOption.label : placeholder }),
3527
+ /* @__PURE__ */ jsx39(ChevronDown2, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })
3528
+ ]
3529
+ }
3530
+ ) }),
3531
+ /* @__PURE__ */ jsxs23(DrawerContent, { className: "max-h-[80vh] rounded-t-[32px]", children: [
3532
+ /* @__PURE__ */ jsx39(DrawerHeader, { className: "border-b", children: /* @__PURE__ */ jsxs23("div", { className: "flex items-center justify-between", children: [
3533
+ /* @__PURE__ */ jsx39(DrawerTitle, { className: "text-lg font-semibold", children: bottomSheetLabel || "Se\xE7im Yap\u0131n" }),
3534
+ /* @__PURE__ */ jsx39(DrawerClose, { asChild: true, children: /* @__PURE__ */ jsx39(
3535
+ ShadcnButton,
3536
+ {
3537
+ variant: "link",
3538
+ size: "icon",
3539
+ className: "h-8 w-8 rounded-full p-0 text-muted-foreground hover:bg-muted",
3540
+ type: "button",
3541
+ children: /* @__PURE__ */ jsx39(X3, { className: "h-4 w-4" })
3542
+ }
3543
+ ) })
3544
+ ] }) }),
3545
+ /* @__PURE__ */ jsx39("div", { className: "flex-1 overflow-hidden px-6 pb-6 pt-2", children: /* @__PURE__ */ jsxs23("div", { className: "flex-col items-start gap-[10px]", children: [
3546
+ /* @__PURE__ */ jsxs23("div", { className: "relative my-4", children: [
3547
+ /* @__PURE__ */ jsx39(Search2, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
3548
+ /* @__PURE__ */ jsx39(
3549
+ "input",
3550
+ {
3551
+ placeholder: searchPlaceholder,
3552
+ value: searchValue,
3553
+ onChange: (e) => setSearchValue(e.target.value),
3554
+ className: "flex h-10 w-full rounded-md border border-input bg-background px-10 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
3555
+ style: { fontSize: "16px" }
3556
+ }
3557
+ ),
3558
+ searchValue && /* @__PURE__ */ jsx39(
3559
+ ShadcnButton,
3560
+ {
3561
+ variant: "link",
3562
+ size: "icon",
3563
+ className: "absolute right-2 top-1/2 h-5 w-5 -translate-y-1/2 rounded-full bg-transparent p-0 text-muted-foreground hover:bg-muted",
3564
+ onClick: () => setSearchValue(""),
3565
+ type: "button",
3566
+ children: /* @__PURE__ */ jsx39(X3, { className: "h-3 w-3" })
3567
+ }
3568
+ )
3569
+ ] }),
3570
+ /* @__PURE__ */ jsx39(ScrollArea, { className: "h-[60vh] bg-[var(--ui-background-0)] rounded-[24px]", children: filteredOptions.length === 0 ? /* @__PURE__ */ jsx39("div", { className: "py-8 text-center text-muted-foreground text-sm", children: emptyMessage }) : /* @__PURE__ */ jsx39("div", { className: "space-y-0 pb-4", children: filteredOptions.map((option, index) => {
3571
+ const isSelected = value === option.value;
3572
+ const isLast = index === filteredOptions.length - 1;
3573
+ return /* @__PURE__ */ jsxs23(
3574
+ "button",
3575
+ {
3576
+ type: "button",
3577
+ onClick: () => handleSelect(option.value),
3578
+ disabled: option.disabled,
3579
+ className: cn(
3580
+ "flex w-full items-center gap-3 rounded-none px-3 py-3 text-left text-sm transition-colors",
3581
+ "hover:bg-[var(--ui-background-0)]",
3582
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
3583
+ "disabled:cursor-not-allowed disabled:opacity-50",
3584
+ isSelected && "bg-[var(--ui-background-0)]",
3585
+ !isLast && "border-b border-[var(--ui-border-200)]"
3586
+ ),
3587
+ children: [
3588
+ /* @__PURE__ */ jsx39(
3589
+ "span",
3590
+ {
3591
+ className: cn(
3592
+ "flex h-4 w-4 items-center justify-center rounded-full",
3593
+ isSelected ? "bg-[var(--ui-primary-500)]" : "border border-[var(--ui-text-300)] bg-transparent"
3594
+ ),
3595
+ children: isSelected && // İçteki beyaz boşluk
3596
+ /* @__PURE__ */ jsx39("span", { className: "block h-2.5 w-2.5 rounded-full bg-white" })
3597
+ }
3598
+ ),
3599
+ /* @__PURE__ */ jsx39(
3600
+ "span",
3601
+ {
3602
+ className: cn(
3603
+ "truncate pr-2 flex-1 text-left",
3604
+ isSelected ? "font-semibold text-[var(--ui-text-900)]" : "font-normal text-[var(--ui-text-500)]"
3605
+ ),
3606
+ children: option.label
3607
+ }
3608
+ )
3609
+ ]
3610
+ },
3611
+ option.value
3612
+ );
3613
+ }) }) })
3614
+ ] }) })
3615
+ ] })
3616
+ ] }) : /* @__PURE__ */ jsxs23(Popover, { open, onOpenChange: setOpen, children: [
3617
+ /* @__PURE__ */ jsx39(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs23(
3618
+ ShadcnButton,
3619
+ {
3620
+ ref,
3621
+ className: triggerClassName,
3622
+ disabled,
3623
+ id,
3624
+ name,
3625
+ type: "button",
3626
+ ...props,
3627
+ children: [
3628
+ /* @__PURE__ */ jsx39("span", { className: "truncate text-left", children: selectedOption ? selectedOption.label : placeholder }),
3629
+ /* @__PURE__ */ jsx39(
3630
+ ChevronDown2,
3631
+ {
3632
+ className: cn(
3633
+ "ml-2 h-4 w-4 shrink-0 opacity-50 transition-transform",
3634
+ open && "rotate-180"
3635
+ )
3636
+ }
3637
+ )
3638
+ ]
3639
+ }
3640
+ ) }),
3641
+ /* @__PURE__ */ jsx39(PopoverContent, { className: "w-[var(--radix-popover-trigger-width)] max-w-[var(--radix-popover-trigger-width)] p-0", align: "start", children: /* @__PURE__ */ jsx39(Command, { children: content }) })
3642
+ ] }),
3643
+ errorText ? /* @__PURE__ */ jsx39("p", { className: "text-sm text-[var(--ui-danger-base)]", role: "alert", children: errorText }) : helperText ? /* @__PURE__ */ jsx39("p", { className: "text-sm text-[var(--ui-text-500)]", children: helperText }) : null
3644
+ ] });
3645
+ }
3646
+ );
3647
+ EasySelect.displayName = "EasySelect";
3648
+
3649
+ // src/components/easy/date-picker.tsx
3650
+ import * as React38 from "react";
3651
+ import { Calendar as CalendarIcon, AlertCircle as AlertCircle7 } from "lucide-react";
3652
+ import { format } from "date-fns";
3653
+
3654
+ // src/components/ui/calendar.tsx
3655
+ import * as React37 from "react";
3656
+ import {
3657
+ ChevronDownIcon,
3658
+ ChevronLeftIcon,
3659
+ ChevronRightIcon
3660
+ } from "lucide-react";
3661
+ import { DayPicker, getDefaultClassNames } from "react-day-picker";
3662
+ import { jsx as jsx40 } from "react/jsx-runtime";
3663
+ function Calendar({
3664
+ className,
3665
+ classNames,
3666
+ showOutsideDays = true,
3667
+ captionLayout = "label",
3668
+ buttonVariant = "link",
3669
+ formatters,
3670
+ components,
3671
+ ...props
3672
+ }) {
3673
+ const defaultClassNames = getDefaultClassNames();
3674
+ return /* @__PURE__ */ jsx40(
3675
+ DayPicker,
3676
+ {
3677
+ showOutsideDays,
3678
+ className: cn(
3679
+ "bg-background group/calendar p-3 [--cell-size:2rem] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent",
3680
+ String.raw`rtl:**:[.rdp-button_next>svg]:rotate-180`,
3681
+ String.raw`rtl:**:[.rdp-button_previous>svg]:rotate-180`,
3682
+ className
3683
+ ),
3684
+ captionLayout,
3685
+ formatters: {
3686
+ formatMonthDropdown: (date) => date.toLocaleString("default", { month: "short" }),
3687
+ ...formatters
3688
+ },
3689
+ classNames: {
3690
+ root: cn("w-fit", defaultClassNames.root),
3691
+ months: cn(
3692
+ "relative flex flex-col gap-4 md:flex-row",
3693
+ defaultClassNames.months
3694
+ ),
3695
+ month: cn("flex w-full flex-col gap-4", defaultClassNames.month),
3696
+ nav: cn(
3697
+ "absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1",
3698
+ defaultClassNames.nav
3699
+ ),
3700
+ button_previous: cn(
3701
+ shadcnButtonVariants({ variant: buttonVariant }),
3702
+ "h-[--cell-size] w-[--cell-size] select-none p-0 aria-disabled:opacity-50",
3703
+ defaultClassNames.button_previous
3704
+ ),
3705
+ button_next: cn(
3706
+ shadcnButtonVariants({ variant: buttonVariant }),
3707
+ "h-[--cell-size] w-[--cell-size] select-none p-0 aria-disabled:opacity-50",
3708
+ defaultClassNames.button_next
3709
+ ),
3710
+ month_caption: cn(
3711
+ "flex h-[--cell-size] w-full items-center justify-center px-[--cell-size]",
3712
+ defaultClassNames.month_caption
3713
+ ),
3714
+ dropdowns: cn(
3715
+ "flex h-[--cell-size] w-full items-center justify-center gap-1.5 text-sm font-medium",
3716
+ defaultClassNames.dropdowns
3717
+ ),
3718
+ dropdown_root: cn(
3719
+ "has-focus:border-ring border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-[3px] relative rounded-md border",
3720
+ defaultClassNames.dropdown_root
3721
+ ),
3722
+ dropdown: cn(
3723
+ "bg-popover absolute inset-0 opacity-0",
3724
+ defaultClassNames.dropdown
3725
+ ),
3726
+ caption_label: cn(
3727
+ "select-none font-medium",
3728
+ captionLayout === "label" ? "text-sm" : "[&>svg]:text-muted-foreground flex h-8 items-center gap-1 rounded-md pl-2 pr-1 text-sm [&>svg]:size-3.5",
3729
+ defaultClassNames.caption_label
3730
+ ),
3731
+ table: "w-full border-collapse",
3732
+ weekdays: cn("flex", defaultClassNames.weekdays),
3733
+ weekday: cn(
3734
+ "text-muted-foreground flex-1 select-none rounded-md text-[0.8rem] font-normal",
3735
+ defaultClassNames.weekday
3736
+ ),
3737
+ week: cn("mt-2 flex w-full", defaultClassNames.week),
3738
+ week_number_header: cn(
3739
+ "w-[--cell-size] select-none",
3740
+ defaultClassNames.week_number_header
3741
+ ),
3742
+ week_number: cn(
3743
+ "text-muted-foreground select-none text-[0.8rem]",
3744
+ defaultClassNames.week_number
3745
+ ),
3746
+ day: cn(
3747
+ "group/day relative aspect-square h-full w-full select-none p-0 text-center [&:first-child[data-selected=true]_button]:rounded-l-md [&:last-child[data-selected=true]_button]:rounded-r-md",
3748
+ defaultClassNames.day
3749
+ ),
3750
+ range_start: cn(
3751
+ "bg-accent rounded-l-md",
3752
+ defaultClassNames.range_start
3753
+ ),
3754
+ range_middle: cn("rounded-none", defaultClassNames.range_middle),
3755
+ range_end: cn("bg-accent rounded-r-md", defaultClassNames.range_end),
3756
+ today: cn(
3757
+ "bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none",
3758
+ defaultClassNames.today
3759
+ ),
3760
+ outside: cn(
3761
+ "text-muted-foreground aria-selected:text-muted-foreground",
3762
+ defaultClassNames.outside
3763
+ ),
3764
+ disabled: cn(
3765
+ "text-muted-foreground opacity-50",
3766
+ defaultClassNames.disabled
3767
+ ),
3768
+ hidden: cn("invisible", defaultClassNames.hidden),
3769
+ ...classNames
3770
+ },
3771
+ components: {
3772
+ Root: ({ className: className2, rootRef, ...props2 }) => {
3773
+ return /* @__PURE__ */ jsx40(
3774
+ "div",
3775
+ {
3776
+ "data-slot": "calendar",
3777
+ ref: rootRef,
3778
+ className: cn(className2),
3779
+ ...props2
3780
+ }
3781
+ );
3782
+ },
3783
+ Chevron: ({ className: className2, orientation, ...props2 }) => {
3784
+ if (orientation === "left") {
3785
+ return /* @__PURE__ */ jsx40(ChevronLeftIcon, { className: cn("size-4", className2), ...props2 });
3786
+ }
3787
+ if (orientation === "right") {
3788
+ return /* @__PURE__ */ jsx40(
3789
+ ChevronRightIcon,
3790
+ {
3791
+ className: cn("size-4", className2),
3792
+ ...props2
3793
+ }
3794
+ );
3795
+ }
3796
+ return /* @__PURE__ */ jsx40(ChevronDownIcon, { className: cn("size-4", className2), ...props2 });
3797
+ },
3798
+ DayButton: CalendarDayButton,
3799
+ WeekNumber: ({ children, ...props2 }) => {
3800
+ return /* @__PURE__ */ jsx40("td", { ...props2, children: /* @__PURE__ */ jsx40("div", { className: "flex size-[--cell-size] items-center justify-center text-center", children }) });
3801
+ },
3802
+ ...components
3803
+ },
3804
+ ...props
3805
+ }
3806
+ );
3807
+ }
3808
+ function CalendarDayButton({
3809
+ className,
3810
+ day,
3811
+ modifiers,
3812
+ ...props
3813
+ }) {
3814
+ const defaultClassNames = getDefaultClassNames();
3815
+ const ref = React37.useRef(null);
3816
+ React37.useEffect(() => {
3817
+ if (modifiers.focused) ref.current?.focus();
3818
+ }, [modifiers.focused]);
3819
+ return /* @__PURE__ */ jsx40(
3820
+ ShadcnButton,
3821
+ {
3822
+ ref,
3823
+ variant: "link",
3824
+ size: "icon",
3825
+ "data-day": day.date.toLocaleDateString(),
3826
+ "data-selected-single": modifiers.selected && !modifiers.range_start && !modifiers.range_end && !modifiers.range_middle,
3827
+ "data-range-start": modifiers.range_start,
3828
+ "data-range-end": modifiers.range_end,
3829
+ "data-range-middle": modifiers.range_middle,
3830
+ className: cn(
3831
+ "data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 flex aspect-square h-auto w-full min-w-[--cell-size] flex-col gap-1 font-normal leading-none data-[range-end=true]:rounded-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] [&>span]:text-xs [&>span]:opacity-70",
3832
+ defaultClassNames.day,
3833
+ className
3834
+ ),
3835
+ ...props
3836
+ }
3837
+ );
3838
+ }
3839
+
3840
+ // src/components/easy/date-picker.tsx
3841
+ import { jsx as jsx41, jsxs as jsxs24 } from "react/jsx-runtime";
3842
+ var EasyDatePicker = React38.forwardRef(
3843
+ ({
3844
+ label,
3845
+ helperText,
3846
+ errorText,
3847
+ placeholder = "Tarih se\xE7",
3848
+ value,
3849
+ onChange,
3850
+ disabled,
3851
+ className,
3852
+ id,
3853
+ name,
3854
+ fromDate,
3855
+ toDate,
3856
+ ...props
3857
+ }, ref) => {
3858
+ const generatedId = React38.useId();
3859
+ const inputId = id ?? generatedId;
3860
+ const helperId = helperText && !errorText ? `${inputId}-helper` : void 0;
3861
+ const errorId = errorText ? `${inputId}-error` : void 0;
3862
+ const [open, setOpen] = React38.useState(false);
3863
+ const [isFocused, setIsFocused] = React38.useState(false);
3864
+ const hasError = Boolean(errorText);
3865
+ const triggerClassName = cn(
3866
+ "flex h-12 w-full items-center justify-between rounded-[var(--ui-radius-lg)] border px-4 py-3 text-base font-medium",
3867
+ "bg-[var(--ui-background-0)] text-[var(--ui-text-900)]",
3868
+ "placeholder:text-[var(--ui-text-400)]",
3869
+ !isFocused && !hasError && "hover:bg-[var(--ui-background-100)]",
3870
+ isFocused && !hasError && "border-[var(--ui-border-900)]",
3871
+ hasError && "border-[var(--ui-danger-base)] focus-visible:ring-[var(--ui-danger-base)] focus-visible:ring-offset-0",
3872
+ !hasError && "focus-visible:shadow-[0_0_0_2px_var(--ui-background-0),_0_0_0_4px_var(--ui-border-200)]",
3873
+ hasError && "focus-visible:shadow-[0_0_0_2px_var(--ui-background-0),_0_0_0_4px_var(--ui-danger-light)]",
3874
+ "disabled:cursor-not-allowed disabled:bg-[var(--ui-background-100)] disabled:text-[var(--ui-text-400)]",
3875
+ className
3876
+ );
3877
+ return /* @__PURE__ */ jsxs24("div", { className: "flex w-full flex-col gap-1.5", children: [
3878
+ label && /* @__PURE__ */ jsx41(
3879
+ "label",
3880
+ {
3881
+ htmlFor: inputId,
3882
+ className: "text-base font-medium text-[var(--ui-text-900)]",
3883
+ children: label
3884
+ }
3885
+ ),
3886
+ /* @__PURE__ */ jsxs24(
3887
+ Popover,
3888
+ {
3889
+ open,
3890
+ onOpenChange: (next) => {
3891
+ setOpen(next);
3892
+ setIsFocused(next);
3893
+ },
3894
+ children: [
3895
+ /* @__PURE__ */ jsx41(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs24(
3896
+ ShadcnButton,
3897
+ {
3898
+ ref,
3899
+ id: inputId,
3900
+ name: name ?? inputId,
3901
+ type: "button",
3902
+ variant: "link",
3903
+ className: triggerClassName,
3904
+ disabled,
3905
+ "aria-invalid": hasError,
3906
+ "aria-describedby": errorId ?? helperId,
3907
+ ...props,
3908
+ children: [
3909
+ /* @__PURE__ */ jsx41(
3910
+ "span",
3911
+ {
3912
+ className: cn(
3913
+ "truncate text-left flex-1",
3914
+ !value && "text-[var(--ui-text-400)]"
3915
+ ),
3916
+ children: value ? format(value, "dd.MM.yyyy") : placeholder
3917
+ }
3918
+ ),
3919
+ /* @__PURE__ */ jsx41(CalendarIcon, { className: "ml-3 h-5 w-5 text-[var(--ui-icon-900)]" })
3920
+ ]
3921
+ }
3922
+ ) }),
3923
+ /* @__PURE__ */ jsx41(
3924
+ PopoverContent,
3925
+ {
3926
+ className: "w-auto p-0 bg-[var(--ui-background-0)] border border-[var(--ui-border-200)] rounded-[24px] shadow-md",
3927
+ align: "start",
3928
+ children: /* @__PURE__ */ jsx41(
3929
+ Calendar,
3930
+ {
3931
+ mode: "single",
3932
+ selected: value,
3933
+ onSelect: (date) => {
3934
+ onChange?.(date ?? void 0);
3935
+ if (date) setOpen(false);
3936
+ },
3937
+ fromDate,
3938
+ toDate,
3939
+ initialFocus: true
3940
+ }
3941
+ )
3942
+ }
3943
+ )
3944
+ ]
3945
+ }
3946
+ ),
3947
+ hasError ? /* @__PURE__ */ jsxs24(
3948
+ "p",
3949
+ {
3950
+ id: errorId,
3951
+ className: "flex items-center gap-1 text-sm text-[var(--ui-danger-base)]",
3952
+ children: [
3953
+ /* @__PURE__ */ jsx41(AlertCircle7, { className: "size-4" }),
3954
+ errorText
3955
+ ]
3956
+ }
3957
+ ) : helperText ? /* @__PURE__ */ jsx41("p", { id: helperId, className: "text-sm text-[var(--ui-text-500)]", children: helperText }) : null
3958
+ ] });
3959
+ }
3960
+ );
3961
+ EasyDatePicker.displayName = "EasyDatePicker";
3962
+
3963
+ // src/hooks/use-easy-otp.ts
3964
+ import * as React39 from "react";
3965
+ var useEasyOtp = (options) => {
3966
+ const [open, setOpen] = React39.useState(false);
3967
+ return {
3968
+ open,
3969
+ setOpen,
3970
+ onOpenChange: setOpen,
3971
+ openOtpModal: () => setOpen(true),
3972
+ closeOtpModal: () => setOpen(false),
3973
+ toggleOtpModal: () => setOpen((prev) => !prev)
3974
+ };
3975
+ };
3976
+ export {
3977
+ EasyBody,
3978
+ EasyBreadcrumb,
3979
+ EasyButton,
3980
+ EasyCheckbox,
3981
+ EasyContainer,
3982
+ EasyDatePicker,
3983
+ EasyDisplay,
3984
+ EasyEmailInput,
3985
+ EasyErrorMessage,
3986
+ EasyHeading,
3987
+ EasyLabel,
3988
+ EasyMessageDialog,
3989
+ EasyOtp,
3990
+ EasyOtpModal,
3991
+ EasyPagination,
3992
+ EasyPasswordInput,
3993
+ EasyPhoneInput,
3994
+ EasySelect,
3995
+ EasySidebar,
3996
+ EasyTabs,
3997
+ EasyTabsContent,
3998
+ EasyTabsList,
3999
+ EasyTabsTrigger,
4000
+ EasyTextInput,
4001
+ EasyTypography,
4002
+ Input,
4003
+ ShadcnButton,
4004
+ ShadcnCheckbox,
4005
+ ShadcnInput,
4006
+ Tabs,
4007
+ TabsContent,
4008
+ TabsList,
4009
+ TabsTrigger,
4010
+ ThemeProvider,
4011
+ breakpoints,
4012
+ easyButtonVariants as buttonVariants,
4013
+ cn,
4014
+ colorPalette,
4015
+ containerVariants,
4016
+ designTokens,
4017
+ easyButtonVariants,
4018
+ elevations,
4019
+ formatEmail,
4020
+ formatPhoneNumber,
4021
+ formatPhoneNumberWithPattern,
4022
+ generateBreadcrumbItems,
4023
+ getTypographyClass,
4024
+ primitiveColors,
4025
+ radii,
4026
+ semanticColors,
4027
+ shadcnButtonVariants,
4028
+ spacingScale,
4029
+ typographyClasses,
4030
+ typographyScale,
4031
+ typographyTokens,
4032
+ useEasyOtp,
4033
+ useTheme
4034
+ };
4035
+ //# sourceMappingURL=index.js.map