@moeve-ui/ui 0.2.1 → 0.2.3
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.d.mts +25 -2
- package/dist/index.d.ts +25 -2
- package/dist/index.js +176 -165
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +175 -165
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -37,6 +37,7 @@ __export(src_exports, {
|
|
|
37
37
|
FuelIcon: () => FuelIcon,
|
|
38
38
|
FuelPumpSolidIcon: () => FuelPumpSolidIcon,
|
|
39
39
|
LogOutIcon: () => LogOutIcon,
|
|
40
|
+
Logo: () => Logo,
|
|
40
41
|
MapPinIcon: () => MapPinIcon,
|
|
41
42
|
MiniMapCard: () => MiniMapCard,
|
|
42
43
|
NavItem: () => NavItem,
|
|
@@ -311,8 +312,17 @@ function Card({ children, className = "", noPadding = false, ...rest }) {
|
|
|
311
312
|
);
|
|
312
313
|
}
|
|
313
314
|
|
|
314
|
-
// src/atoms/
|
|
315
|
+
// src/atoms/Logo/Logo.tsx
|
|
315
316
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
317
|
+
function Logo({ accent, text, accentClassName = "text-brand-primary", textClassName = "text-text-primary", className = "" }) {
|
|
318
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: `inline-flex whitespace-nowrap font-black italic uppercase tracking-tight ${className}`.trim(), children: [
|
|
319
|
+
accent && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: accentClassName, children: accent }),
|
|
320
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: textClassName, children: text })
|
|
321
|
+
] });
|
|
322
|
+
}
|
|
323
|
+
|
|
324
|
+
// src/atoms/ProgressBar/ProgressBar.tsx
|
|
325
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
316
326
|
function ProgressBar({
|
|
317
327
|
value,
|
|
318
328
|
fillClassName = "bg-info",
|
|
@@ -322,10 +332,10 @@ function ProgressBar({
|
|
|
322
332
|
}) {
|
|
323
333
|
const clamped = Math.min(100, Math.max(0, value));
|
|
324
334
|
if (segments > 1) {
|
|
325
|
-
return /* @__PURE__ */ (0,
|
|
335
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: `flex w-full gap-0.5 overflow-hidden rounded-full bg-border ${heightClassName} ${className}`.trim(), children: Array.from({ length: segments }).map((_, i) => {
|
|
326
336
|
const segmentStart = i / segments * 100;
|
|
327
337
|
const filled = clamped > segmentStart;
|
|
328
|
-
return /* @__PURE__ */ (0,
|
|
338
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
329
339
|
"div",
|
|
330
340
|
{
|
|
331
341
|
className: `h-full flex-1 ${filled ? fillClassName : "opacity-20 " + fillClassName}`
|
|
@@ -334,38 +344,38 @@ function ProgressBar({
|
|
|
334
344
|
);
|
|
335
345
|
}) });
|
|
336
346
|
}
|
|
337
|
-
return /* @__PURE__ */ (0,
|
|
347
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: `w-full overflow-hidden rounded-full bg-border ${heightClassName} ${className}`.trim(), children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: `h-full rounded-full ${fillClassName}`, style: { width: `${clamped}%` } }) });
|
|
338
348
|
}
|
|
339
349
|
|
|
340
350
|
// src/atoms/Snackbar/Snackbar.tsx
|
|
341
|
-
var
|
|
351
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
342
352
|
var TONE_CLASSES2 = {
|
|
343
353
|
success: "bg-success",
|
|
344
354
|
danger: "bg-danger",
|
|
345
355
|
neutral: "bg-text-secondary"
|
|
346
356
|
};
|
|
347
357
|
var TONE_ICON = {
|
|
348
|
-
success: /* @__PURE__ */ (0,
|
|
349
|
-
danger: /* @__PURE__ */ (0,
|
|
358
|
+
success: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CheckCircleIcon, { className: "size-5" }),
|
|
359
|
+
danger: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(XIcon, { className: "size-5" }),
|
|
350
360
|
neutral: null
|
|
351
361
|
};
|
|
352
362
|
function Snackbar({ message, tone = "success", onClose, className = "" }) {
|
|
353
|
-
return /* @__PURE__ */ (0,
|
|
363
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
354
364
|
"div",
|
|
355
365
|
{
|
|
356
366
|
role: "status",
|
|
357
367
|
className: `flex w-full items-center gap-2 rounded-lg px-6 py-3 text-white shadow-card ${TONE_CLASSES2[tone]} ${className}`.trim(),
|
|
358
368
|
children: [
|
|
359
369
|
TONE_ICON[tone],
|
|
360
|
-
/* @__PURE__ */ (0,
|
|
361
|
-
/* @__PURE__ */ (0,
|
|
370
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "flex-1 text-sm font-semibold", children: message }),
|
|
371
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
362
372
|
"button",
|
|
363
373
|
{
|
|
364
374
|
type: "button",
|
|
365
375
|
onClick: onClose,
|
|
366
376
|
"aria-label": "Cerrar",
|
|
367
377
|
className: "text-white/80 transition-colors hover:text-white",
|
|
368
|
-
children: /* @__PURE__ */ (0,
|
|
378
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(XIcon, { className: "size-4" })
|
|
369
379
|
}
|
|
370
380
|
)
|
|
371
381
|
]
|
|
@@ -374,16 +384,16 @@ function Snackbar({ message, tone = "success", onClose, className = "" }) {
|
|
|
374
384
|
}
|
|
375
385
|
|
|
376
386
|
// src/molecules/SegmentedTabs/SegmentedTabs.tsx
|
|
377
|
-
var
|
|
387
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
378
388
|
function SegmentedTabs({ options, value, onChange, className = "" }) {
|
|
379
|
-
return /* @__PURE__ */ (0,
|
|
389
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
380
390
|
"div",
|
|
381
391
|
{
|
|
382
392
|
role: "tablist",
|
|
383
393
|
className: `inline-flex items-start gap-0 rounded-lg bg-surface-muted p-1 ${className}`.trim(),
|
|
384
394
|
children: options.map((option) => {
|
|
385
395
|
const active = option.value === value;
|
|
386
|
-
return /* @__PURE__ */ (0,
|
|
396
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
387
397
|
"button",
|
|
388
398
|
{
|
|
389
399
|
type: "button",
|
|
@@ -401,9 +411,9 @@ function SegmentedTabs({ options, value, onChange, className = "" }) {
|
|
|
401
411
|
}
|
|
402
412
|
|
|
403
413
|
// src/molecules/NavItem/NavItem.tsx
|
|
404
|
-
var
|
|
414
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
405
415
|
function NavItem({ icon, label, active = false, href = "#" }) {
|
|
406
|
-
return /* @__PURE__ */ (0,
|
|
416
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
|
|
407
417
|
"a",
|
|
408
418
|
{
|
|
409
419
|
href,
|
|
@@ -417,10 +427,10 @@ function NavItem({ icon, label, active = false, href = "#" }) {
|
|
|
417
427
|
}
|
|
418
428
|
|
|
419
429
|
// src/molecules/StatTile/StatTile.tsx
|
|
420
|
-
var
|
|
430
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
421
431
|
var DELTA_ICON = {
|
|
422
|
-
success: /* @__PURE__ */ (0,
|
|
423
|
-
danger: /* @__PURE__ */ (0,
|
|
432
|
+
success: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(TrendUpIcon, { className: "size-4" }),
|
|
433
|
+
danger: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(TrendDownIcon, { className: "size-4" }),
|
|
424
434
|
neutral: null
|
|
425
435
|
};
|
|
426
436
|
function StatTile({
|
|
@@ -433,23 +443,23 @@ function StatTile({
|
|
|
433
443
|
progressValue,
|
|
434
444
|
progressClassName = "bg-info"
|
|
435
445
|
}) {
|
|
436
|
-
return /* @__PURE__ */ (0,
|
|
437
|
-
/* @__PURE__ */ (0,
|
|
438
|
-
/* @__PURE__ */ (0,
|
|
439
|
-
/* @__PURE__ */ (0,
|
|
440
|
-
/* @__PURE__ */ (0,
|
|
441
|
-
unit && /* @__PURE__ */ (0,
|
|
446
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "relative flex flex-1 flex-col gap-4 overflow-hidden rounded-2xl bg-surface-card p-6 shadow-card", children: [
|
|
447
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "pointer-events-none absolute right-5 top-5 text-border", children: icon }),
|
|
448
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)("h3", { className: "max-w-[80%] text-lg font-semibold text-text-secondary", children: label }),
|
|
449
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("p", { className: "flex items-baseline gap-1.5", children: [
|
|
450
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-4xl font-bold text-text-primary", children: value }),
|
|
451
|
+
unit && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-2xl font-medium text-text-tertiary", children: unit })
|
|
442
452
|
] }),
|
|
443
|
-
delta && /* @__PURE__ */ (0,
|
|
453
|
+
delta && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(Badge, { tone: deltaTone, className: "w-fit gap-1", children: [
|
|
444
454
|
DELTA_ICON[deltaTone],
|
|
445
455
|
delta
|
|
446
456
|
] }),
|
|
447
|
-
progressValue !== void 0 && /* @__PURE__ */ (0,
|
|
457
|
+
progressValue !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ProgressBar, { value: progressValue, fillClassName: progressClassName })
|
|
448
458
|
] });
|
|
449
459
|
}
|
|
450
460
|
|
|
451
461
|
// src/molecules/DecisionFactorRow/DecisionFactorRow.tsx
|
|
452
|
-
var
|
|
462
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
453
463
|
function DecisionFactorRow({
|
|
454
464
|
label,
|
|
455
465
|
statusText,
|
|
@@ -459,21 +469,21 @@ function DecisionFactorRow({
|
|
|
459
469
|
segments = 1,
|
|
460
470
|
description
|
|
461
471
|
}) {
|
|
462
|
-
return /* @__PURE__ */ (0,
|
|
463
|
-
/* @__PURE__ */ (0,
|
|
464
|
-
/* @__PURE__ */ (0,
|
|
465
|
-
/* @__PURE__ */ (0,
|
|
472
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
|
|
473
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex items-start justify-between", children: [
|
|
474
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-sm font-semibold text-text-primary", children: label }),
|
|
475
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: `text-sm font-semibold ${statusClassName}`, children: statusText })
|
|
466
476
|
] }),
|
|
467
|
-
/* @__PURE__ */ (0,
|
|
468
|
-
/* @__PURE__ */ (0,
|
|
477
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ProgressBar, { value, fillClassName, heightClassName: "h-1.5", segments }),
|
|
478
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-xs leading-relaxed text-text-secondary", children: description })
|
|
469
479
|
] });
|
|
470
480
|
}
|
|
471
481
|
|
|
472
482
|
// src/molecules/CompetitorRow/CompetitorRow.tsx
|
|
473
|
-
var
|
|
483
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
474
484
|
var TREND_ICON = {
|
|
475
|
-
up: /* @__PURE__ */ (0,
|
|
476
|
-
down: /* @__PURE__ */ (0,
|
|
485
|
+
up: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ArrowUpIcon, { className: "size-4" }),
|
|
486
|
+
down: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ArrowDownIcon, { className: "size-4" }),
|
|
477
487
|
stable: null
|
|
478
488
|
};
|
|
479
489
|
var TREND_TEXT_CLASS = {
|
|
@@ -491,32 +501,32 @@ function CompetitorRow({
|
|
|
491
501
|
trend,
|
|
492
502
|
trendLabel
|
|
493
503
|
}) {
|
|
494
|
-
return /* @__PURE__ */ (0,
|
|
495
|
-
/* @__PURE__ */ (0,
|
|
496
|
-
/* @__PURE__ */ (0,
|
|
497
|
-
/* @__PURE__ */ (0,
|
|
498
|
-
/* @__PURE__ */ (0,
|
|
499
|
-
/* @__PURE__ */ (0,
|
|
500
|
-
/* @__PURE__ */ (0,
|
|
501
|
-
/* @__PURE__ */ (0,
|
|
504
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex w-full items-center justify-between rounded-lg bg-surface-page p-4", children: [
|
|
505
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-center gap-4", children: [
|
|
506
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Avatar, { className: `${avatarBgClassName} ${avatarTextClassName}`, children: avatarLetter }),
|
|
507
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { children: [
|
|
508
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-sm font-semibold text-text-primary", children: name }),
|
|
509
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-center gap-1 text-text-secondary", children: [
|
|
510
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MapPinIcon, { className: "size-[18px]" }),
|
|
511
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { className: "text-xs font-medium tracking-wide", children: [
|
|
502
512
|
distanceKm,
|
|
503
513
|
" km"
|
|
504
514
|
] })
|
|
505
515
|
] })
|
|
506
516
|
] })
|
|
507
517
|
] }),
|
|
508
|
-
/* @__PURE__ */ (0,
|
|
509
|
-
/* @__PURE__ */ (0,
|
|
510
|
-
/* @__PURE__ */ (0,
|
|
518
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "text-right", children: [
|
|
519
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-2xl font-semibold text-text-primary", children: price }),
|
|
520
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: `flex items-center justify-end gap-1 text-xs font-medium ${TREND_TEXT_CLASS[trend]}`, children: [
|
|
511
521
|
TREND_ICON[trend],
|
|
512
|
-
/* @__PURE__ */ (0,
|
|
522
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: trendLabel })
|
|
513
523
|
] })
|
|
514
524
|
] })
|
|
515
525
|
] });
|
|
516
526
|
}
|
|
517
527
|
|
|
518
528
|
// src/molecules/PriceRangeSlider/PriceRangeSlider.tsx
|
|
519
|
-
var
|
|
529
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
520
530
|
function PriceRangeSlider({
|
|
521
531
|
min,
|
|
522
532
|
max,
|
|
@@ -528,38 +538,38 @@ function PriceRangeSlider({
|
|
|
528
538
|
currencyFormatter
|
|
529
539
|
}) {
|
|
530
540
|
const percent = (value - min) / (max - min) * 100;
|
|
531
|
-
return /* @__PURE__ */ (0,
|
|
532
|
-
/* @__PURE__ */ (0,
|
|
533
|
-
/* @__PURE__ */ (0,
|
|
534
|
-
/* @__PURE__ */ (0,
|
|
535
|
-
/* @__PURE__ */ (0,
|
|
541
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "relative h-[250px] w-full rounded-xl border border-border/30 bg-surface-page p-6 shadow-tab", children: [
|
|
542
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
543
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { children: [
|
|
544
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "text-sm text-text-secondary", children: "PRECIO ACTUAL" }),
|
|
545
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "text-2xl font-semibold text-text-primary", children: currencyFormatter(currentPrice) })
|
|
536
546
|
] }),
|
|
537
|
-
/* @__PURE__ */ (0,
|
|
538
|
-
/* @__PURE__ */ (0,
|
|
539
|
-
/* @__PURE__ */ (0,
|
|
547
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "text-right", children: [
|
|
548
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "text-sm text-brand-primary", children: "RECOMENDADO" }),
|
|
549
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "text-2xl font-semibold text-brand-primary", children: currencyFormatter(recommendedPrice) })
|
|
540
550
|
] })
|
|
541
551
|
] }),
|
|
542
|
-
/* @__PURE__ */ (0,
|
|
543
|
-
/* @__PURE__ */ (0,
|
|
552
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "absolute left-6 right-6 top-[100px] flex h-24 items-center justify-center", children: [
|
|
553
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
|
544
554
|
"div",
|
|
545
555
|
{
|
|
546
556
|
className: "pointer-events-none absolute -top-16 -translate-x-1/2 rounded-lg bg-[#2b3134] px-4 py-2 text-sm font-semibold text-white shadow-tooltip",
|
|
547
557
|
style: { left: `${percent}%` },
|
|
548
558
|
children: [
|
|
549
559
|
currencyFormatter(value),
|
|
550
|
-
/* @__PURE__ */ (0,
|
|
560
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "absolute left-1/2 top-full h-0 w-0 -translate-x-1/2 border-x-8 border-t-8 border-x-transparent border-t-[#2b3134]" })
|
|
551
561
|
]
|
|
552
562
|
}
|
|
553
563
|
),
|
|
554
|
-
/* @__PURE__ */ (0,
|
|
555
|
-
/* @__PURE__ */ (0,
|
|
564
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "relative h-2 w-full rounded-full bg-border", children: [
|
|
565
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
556
566
|
"div",
|
|
557
567
|
{
|
|
558
568
|
className: "h-full rounded-full bg-brand-primary",
|
|
559
569
|
style: { width: `${percent}%` }
|
|
560
570
|
}
|
|
561
571
|
),
|
|
562
|
-
/* @__PURE__ */ (0,
|
|
572
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
563
573
|
"input",
|
|
564
574
|
{
|
|
565
575
|
type: "range",
|
|
@@ -574,42 +584,42 @@ function PriceRangeSlider({
|
|
|
574
584
|
)
|
|
575
585
|
] })
|
|
576
586
|
] }),
|
|
577
|
-
/* @__PURE__ */ (0,
|
|
578
|
-
/* @__PURE__ */ (0,
|
|
579
|
-
/* @__PURE__ */ (0,
|
|
587
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "absolute bottom-6 left-6 right-6 flex items-start justify-between text-sm text-text-secondary", children: [
|
|
588
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { children: currencyFormatter(min) }),
|
|
589
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { children: currencyFormatter(max) })
|
|
580
590
|
] })
|
|
581
591
|
] });
|
|
582
592
|
}
|
|
583
593
|
|
|
584
594
|
// src/molecules/MiniMapCard/MiniMapCard.tsx
|
|
585
|
-
var
|
|
595
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
586
596
|
function MiniMapCard({ overlayTitle, overlayLinkLabel, competitorCount }) {
|
|
587
|
-
return /* @__PURE__ */ (0,
|
|
588
|
-
/* @__PURE__ */ (0,
|
|
589
|
-
/* @__PURE__ */ (0,
|
|
590
|
-
Array.from({ length: 9 }).map((_, i) => /* @__PURE__ */ (0,
|
|
591
|
-
Array.from({ length: 7 }).map((_, i) => /* @__PURE__ */ (0,
|
|
592
|
-
/* @__PURE__ */ (0,
|
|
593
|
-
/* @__PURE__ */ (0,
|
|
594
|
-
/* @__PURE__ */ (0,
|
|
595
|
-
/* @__PURE__ */ (0,
|
|
597
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "relative h-64 w-full overflow-hidden rounded-xl bg-white p-2 shadow-tab", children: [
|
|
598
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "relative h-full w-full overflow-hidden rounded-lg bg-[#dbe9ee]", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("svg", { viewBox: "0 0 320 220", className: "h-full w-full", preserveAspectRatio: "xMidYMid slice", children: [
|
|
599
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("rect", { width: "320", height: "220", fill: "#dbe9ee" }),
|
|
600
|
+
Array.from({ length: 9 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("line", { x1: i * 40, y1: "0", x2: i * 40, y2: "220", stroke: "#c5dbe2", strokeWidth: "1" }, `v${i}`)),
|
|
601
|
+
Array.from({ length: 7 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("line", { x1: "0", y1: i * 36, x2: "320", y2: i * 36, stroke: "#c5dbe2", strokeWidth: "1" }, `h${i}`)),
|
|
602
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("circle", { cx: "160", cy: "110", r: "10", fill: "#006395" }),
|
|
603
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("circle", { cx: "100", cy: "70", r: "6", fill: "#404850" }),
|
|
604
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("circle", { cx: "220", cy: "60", r: "6", fill: "#404850" }),
|
|
605
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("circle", { cx: "235", cy: "150", r: "6", fill: "#404850" })
|
|
596
606
|
] }) }),
|
|
597
|
-
/* @__PURE__ */ (0,
|
|
598
|
-
/* @__PURE__ */ (0,
|
|
599
|
-
/* @__PURE__ */ (0,
|
|
607
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "absolute inset-x-4 bottom-4 flex flex-col gap-1 rounded-lg bg-surface-page/90 p-3 shadow-modal backdrop-blur-sm", children: [
|
|
608
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center gap-1 text-xs font-medium uppercase tracking-wider text-text-primary", children: [
|
|
609
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(MapPinIcon, { className: "size-3.5" }),
|
|
600
610
|
overlayTitle
|
|
601
611
|
] }),
|
|
602
|
-
/* @__PURE__ */ (0,
|
|
612
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "text-sm font-semibold text-brand-primary", "aria-label": `${overlayLinkLabel} - ${competitorCount} en total`, children: overlayLinkLabel })
|
|
603
613
|
] })
|
|
604
614
|
] });
|
|
605
615
|
}
|
|
606
616
|
|
|
607
617
|
// src/molecules/WeekdayPicker/WeekdayPicker.tsx
|
|
608
|
-
var
|
|
618
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
609
619
|
function WeekdayPicker({ labels, selected, onToggle, className = "" }) {
|
|
610
|
-
return /* @__PURE__ */ (0,
|
|
620
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { role: "group", className: `flex flex-wrap gap-2 ${className}`.trim(), children: labels.map((label, day) => {
|
|
611
621
|
const active = selected.includes(day);
|
|
612
|
-
return /* @__PURE__ */ (0,
|
|
622
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
613
623
|
"button",
|
|
614
624
|
{
|
|
615
625
|
type: "button",
|
|
@@ -624,45 +634,45 @@ function WeekdayPicker({ labels, selected, onToggle, className = "" }) {
|
|
|
624
634
|
}
|
|
625
635
|
|
|
626
636
|
// src/molecules/SelectableCard/SelectableCard.tsx
|
|
627
|
-
var
|
|
637
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
628
638
|
function SelectableCard({ icon, title, subtitle, media, selected = false, onClick, className = "" }) {
|
|
629
639
|
const base2 = `w-full rounded-xl border text-left transition-colors ${selected ? "border-brand-primary bg-brand-primary/5" : "border-border hover:bg-surface-subtle"} ${className}`.trim();
|
|
630
640
|
if (media) {
|
|
631
|
-
return /* @__PURE__ */ (0,
|
|
632
|
-
/* @__PURE__ */ (0,
|
|
633
|
-
/* @__PURE__ */ (0,
|
|
634
|
-
icon && /* @__PURE__ */ (0,
|
|
641
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("button", { type: "button", "aria-pressed": selected, onClick, className: `overflow-hidden ${base2}`, children: [
|
|
642
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "isolate h-36 w-full overflow-hidden", children: media }),
|
|
643
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center gap-3 p-4", children: [
|
|
644
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
635
645
|
"span",
|
|
636
646
|
{
|
|
637
647
|
className: `flex h-8 w-8 shrink-0 items-center justify-center rounded-full ${selected ? "bg-brand-primary text-white" : "bg-surface-muted text-text-secondary"}`,
|
|
638
648
|
children: icon
|
|
639
649
|
}
|
|
640
650
|
),
|
|
641
|
-
/* @__PURE__ */ (0,
|
|
642
|
-
/* @__PURE__ */ (0,
|
|
643
|
-
subtitle && /* @__PURE__ */ (0,
|
|
651
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: "flex flex-col", children: [
|
|
652
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "font-medium text-text-primary", children: title }),
|
|
653
|
+
subtitle && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-sm text-text-tertiary", children: subtitle })
|
|
644
654
|
] })
|
|
645
655
|
] })
|
|
646
656
|
] });
|
|
647
657
|
}
|
|
648
|
-
return /* @__PURE__ */ (0,
|
|
649
|
-
icon && /* @__PURE__ */ (0,
|
|
658
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("button", { type: "button", "aria-pressed": selected, onClick, className: `flex items-center gap-3 p-4 ${base2}`, children: [
|
|
659
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
650
660
|
"span",
|
|
651
661
|
{
|
|
652
662
|
className: `flex h-10 w-10 shrink-0 items-center justify-center rounded-full ${selected ? "bg-brand-primary text-white" : "bg-surface-muted text-text-secondary"}`,
|
|
653
663
|
children: icon
|
|
654
664
|
}
|
|
655
665
|
),
|
|
656
|
-
/* @__PURE__ */ (0,
|
|
657
|
-
/* @__PURE__ */ (0,
|
|
658
|
-
subtitle && /* @__PURE__ */ (0,
|
|
666
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: "flex flex-col", children: [
|
|
667
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "font-medium text-text-primary", children: title }),
|
|
668
|
+
subtitle && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-sm text-text-tertiary", children: subtitle })
|
|
659
669
|
] })
|
|
660
670
|
] });
|
|
661
671
|
}
|
|
662
672
|
|
|
663
673
|
// src/molecules/FileDropzone/FileDropzone.tsx
|
|
664
674
|
var import_react = require("react");
|
|
665
|
-
var
|
|
675
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
666
676
|
function FileDropzone({
|
|
667
677
|
accept,
|
|
668
678
|
onFileSelected,
|
|
@@ -687,7 +697,7 @@ function FileDropzone({
|
|
|
687
697
|
setDragActive(false);
|
|
688
698
|
onFileSelected(e.dataTransfer.files?.[0] ?? null);
|
|
689
699
|
}
|
|
690
|
-
return /* @__PURE__ */ (0,
|
|
700
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
691
701
|
"div",
|
|
692
702
|
{
|
|
693
703
|
role: "button",
|
|
@@ -702,7 +712,7 @@ function FileDropzone({
|
|
|
702
712
|
onDrop: handleDrop,
|
|
703
713
|
className: `flex cursor-pointer flex-col items-center justify-center gap-2 rounded-xl border-2 border-dashed px-6 py-8 text-center transition-colors ${dragActive ? "border-brand-primary bg-brand-primary/5" : "border-border hover:border-brand-primary/60"} ${className}`.trim(),
|
|
704
714
|
children: [
|
|
705
|
-
/* @__PURE__ */ (0,
|
|
715
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
706
716
|
"input",
|
|
707
717
|
{
|
|
708
718
|
ref: inputRef,
|
|
@@ -712,10 +722,10 @@ function FileDropzone({
|
|
|
712
722
|
onChange: (e) => onFileSelected(e.target.files?.[0] ?? null)
|
|
713
723
|
}
|
|
714
724
|
),
|
|
715
|
-
/* @__PURE__ */ (0,
|
|
716
|
-
selectedFileName ? /* @__PURE__ */ (0,
|
|
717
|
-
/* @__PURE__ */ (0,
|
|
718
|
-
hint && /* @__PURE__ */ (0,
|
|
725
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(UploadIcon, { className: `size-6 ${dragActive ? "text-brand-primary" : "text-text-tertiary"}` }),
|
|
726
|
+
selectedFileName ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-sm font-medium text-text-primary", children: selectedFileName }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
|
|
727
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-sm font-medium text-text-primary", children: label }),
|
|
728
|
+
hint && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-xs text-text-tertiary", children: hint })
|
|
719
729
|
] })
|
|
720
730
|
]
|
|
721
731
|
}
|
|
@@ -723,7 +733,7 @@ function FileDropzone({
|
|
|
723
733
|
}
|
|
724
734
|
|
|
725
735
|
// src/organisms/Sidebar/Sidebar.tsx
|
|
726
|
-
var
|
|
736
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
727
737
|
function Sidebar({
|
|
728
738
|
brandName = "Redinamic",
|
|
729
739
|
stations,
|
|
@@ -733,43 +743,43 @@ function Sidebar({
|
|
|
733
743
|
user,
|
|
734
744
|
onLogout
|
|
735
745
|
}) {
|
|
736
|
-
return /* @__PURE__ */ (0,
|
|
737
|
-
/* @__PURE__ */ (0,
|
|
738
|
-
/* @__PURE__ */ (0,
|
|
739
|
-
/* @__PURE__ */ (0,
|
|
740
|
-
/* @__PURE__ */ (0,
|
|
746
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("aside", { className: "fixed left-0 top-0 flex h-screen w-[260px] flex-col justify-between bg-brand-sidebar pb-2 pt-8", children: [
|
|
747
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex flex-col gap-6 px-4 pb-6", children: [
|
|
748
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-3 px-2", children: [
|
|
749
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex size-8 items-center justify-center rounded bg-brand-logo", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(BoltIcon, { className: "size-4 text-brand-sidebar" }) }),
|
|
750
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-2xl font-semibold tracking-tight text-white", children: brandName })
|
|
741
751
|
] }),
|
|
742
|
-
/* @__PURE__ */ (0,
|
|
743
|
-
/* @__PURE__ */ (0,
|
|
744
|
-
/* @__PURE__ */ (0,
|
|
752
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "relative", children: [
|
|
753
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(MapPinIcon, { className: "pointer-events-none absolute left-4 top-1/2 size-4 -translate-y-1/2 text-white" }),
|
|
754
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
745
755
|
"select",
|
|
746
756
|
{
|
|
747
757
|
value: selectedStationId,
|
|
748
758
|
onChange: (event) => onSelectStation(event.target.value),
|
|
749
759
|
className: "w-full appearance-none rounded-xl border border-white/10 bg-white/10 py-2.5 pl-10 pr-9 text-sm font-semibold text-white outline-none",
|
|
750
|
-
children: stations.map((station) => /* @__PURE__ */ (0,
|
|
760
|
+
children: stations.map((station) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("option", { value: station.id, className: "text-text-primary", children: station.label }, station.id))
|
|
751
761
|
}
|
|
752
762
|
),
|
|
753
|
-
/* @__PURE__ */ (0,
|
|
763
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ChevronDownIcon, { className: "pointer-events-none absolute right-3 top-1/2 size-3 -translate-y-1/2 text-white" })
|
|
754
764
|
] })
|
|
755
765
|
] }),
|
|
756
|
-
/* @__PURE__ */ (0,
|
|
757
|
-
/* @__PURE__ */ (0,
|
|
758
|
-
/* @__PURE__ */ (0,
|
|
759
|
-
/* @__PURE__ */ (0,
|
|
760
|
-
/* @__PURE__ */ (0,
|
|
761
|
-
/* @__PURE__ */ (0,
|
|
762
|
-
/* @__PURE__ */ (0,
|
|
766
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("nav", { className: "flex flex-1 flex-col gap-1 px-4", children: navItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(NavItem, { icon: item.icon, label: item.label, active: item.active, href: item.href }, item.key)) }),
|
|
767
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "border-t border-white/10 px-4 pt-4", children: [
|
|
768
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-3 px-4 py-3", children: [
|
|
769
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Avatar, { className: "bg-brand-primary text-white", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(UserCircleIcon, { className: "size-4" }) }),
|
|
770
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { children: [
|
|
771
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "text-sm font-semibold text-white", children: user.name }),
|
|
772
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "text-xs text-white/60", children: user.role })
|
|
763
773
|
] })
|
|
764
774
|
] }),
|
|
765
|
-
/* @__PURE__ */ (0,
|
|
775
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
|
|
766
776
|
"button",
|
|
767
777
|
{
|
|
768
778
|
type: "button",
|
|
769
779
|
onClick: onLogout,
|
|
770
780
|
className: "flex w-full items-center gap-3 rounded-lg px-4 py-2 text-sm font-semibold text-white/50 transition-colors hover:text-white/80",
|
|
771
781
|
children: [
|
|
772
|
-
/* @__PURE__ */ (0,
|
|
782
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LogOutIcon, { className: "size-4" }),
|
|
773
783
|
"Cerrar Sesi\xF3n"
|
|
774
784
|
]
|
|
775
785
|
}
|
|
@@ -779,7 +789,7 @@ function Sidebar({
|
|
|
779
789
|
}
|
|
780
790
|
|
|
781
791
|
// src/organisms/TopBar/TopBar.tsx
|
|
782
|
-
var
|
|
792
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
783
793
|
function TopBar({
|
|
784
794
|
stationName,
|
|
785
795
|
lastUpdatedLabel,
|
|
@@ -787,36 +797,36 @@ function TopBar({
|
|
|
787
797
|
refreshing = false,
|
|
788
798
|
middleContent
|
|
789
799
|
}) {
|
|
790
|
-
return /* @__PURE__ */ (0,
|
|
791
|
-
/* @__PURE__ */ (0,
|
|
792
|
-
/* @__PURE__ */ (0,
|
|
793
|
-
/* @__PURE__ */ (0,
|
|
794
|
-
/* @__PURE__ */ (0,
|
|
800
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("header", { className: "fixed left-[260px] right-0 top-0 z-10 flex h-20 items-center justify-between gap-4 bg-surface-page/80 px-6 shadow-header backdrop-blur-md", children: [
|
|
801
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "shrink-0", children: [
|
|
802
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
803
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(MapPinIcon, { className: "size-4 text-text-primary" }),
|
|
804
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-sm font-semibold text-text-primary", children: stationName })
|
|
795
805
|
] }),
|
|
796
|
-
/* @__PURE__ */ (0,
|
|
797
|
-
/* @__PURE__ */ (0,
|
|
798
|
-
/* @__PURE__ */ (0,
|
|
806
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "mt-1 flex items-center gap-2", children: [
|
|
807
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "size-2 rounded-full bg-success-dark" }),
|
|
808
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-xs font-medium text-text-secondary", children: lastUpdatedLabel })
|
|
799
809
|
] })
|
|
800
810
|
] }),
|
|
801
811
|
middleContent,
|
|
802
|
-
/* @__PURE__ */ (0,
|
|
803
|
-
/* @__PURE__ */ (0,
|
|
812
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex shrink-0 items-center gap-4", children: [
|
|
813
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
804
814
|
Button,
|
|
805
815
|
{
|
|
806
816
|
variant: "primary",
|
|
807
|
-
icon: /* @__PURE__ */ (0,
|
|
817
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(RefreshIcon, { className: `size-4 ${refreshing ? "animate-spin" : ""}` }),
|
|
808
818
|
onClick: onRefresh,
|
|
809
819
|
disabled: refreshing,
|
|
810
820
|
children: "Actualizar datos"
|
|
811
821
|
}
|
|
812
822
|
),
|
|
813
|
-
/* @__PURE__ */ (0,
|
|
823
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Avatar, { className: "bg-brand-primary text-white", size: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(UserCircleIcon, { className: "size-4" }) })
|
|
814
824
|
] })
|
|
815
825
|
] });
|
|
816
826
|
}
|
|
817
827
|
|
|
818
828
|
// src/organisms/ConfirmDialog/ConfirmDialog.tsx
|
|
819
|
-
var
|
|
829
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
820
830
|
function ConfirmDialog({
|
|
821
831
|
open,
|
|
822
832
|
onClose,
|
|
@@ -831,49 +841,49 @@ function ConfirmDialog({
|
|
|
831
841
|
confirming = false
|
|
832
842
|
}) {
|
|
833
843
|
if (!open) return null;
|
|
834
|
-
return /* @__PURE__ */ (0,
|
|
835
|
-
/* @__PURE__ */ (0,
|
|
836
|
-
/* @__PURE__ */ (0,
|
|
844
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/40 p-4", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "w-full max-w-md overflow-hidden rounded-2xl bg-white shadow-modal", children: [
|
|
845
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "relative flex items-center justify-center bg-gradient-to-r from-brand-primary to-info-dark py-8", children: [
|
|
846
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
837
847
|
"button",
|
|
838
848
|
{
|
|
839
849
|
type: "button",
|
|
840
850
|
onClick: onClose,
|
|
841
851
|
"aria-label": "Cerrar",
|
|
842
852
|
className: "absolute right-4 top-4 text-white/80 hover:text-white",
|
|
843
|
-
children: /* @__PURE__ */ (0,
|
|
853
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(XIcon, { className: "size-5" })
|
|
844
854
|
}
|
|
845
855
|
),
|
|
846
|
-
/* @__PURE__ */ (0,
|
|
856
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex size-14 items-center justify-center rounded-full bg-white text-brand-primary", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(WalletIcon, { className: "size-6" }) })
|
|
847
857
|
] }),
|
|
848
|
-
/* @__PURE__ */ (0,
|
|
849
|
-
/* @__PURE__ */ (0,
|
|
850
|
-
/* @__PURE__ */ (0,
|
|
851
|
-
/* @__PURE__ */ (0,
|
|
852
|
-
/* @__PURE__ */ (0,
|
|
853
|
-
/* @__PURE__ */ (0,
|
|
854
|
-
/* @__PURE__ */ (0,
|
|
855
|
-
/* @__PURE__ */ (0,
|
|
858
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-3 px-8 py-6 text-center", children: [
|
|
859
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h2", { className: "text-xl font-bold text-text-primary", children: title }),
|
|
860
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "rounded-full bg-surface-muted px-3 py-1 text-xs font-semibold text-text-secondary", children: productLabel }),
|
|
861
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-sm text-text-secondary", children: description }),
|
|
862
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "mt-2 flex w-full items-center justify-between rounded-xl bg-surface-subtle p-4", children: [
|
|
863
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "text-left", children: [
|
|
864
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-xs uppercase text-text-secondary", children: "Actual" }),
|
|
865
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-lg font-semibold text-text-tertiary line-through", children: currentPrice })
|
|
856
866
|
] }),
|
|
857
|
-
/* @__PURE__ */ (0,
|
|
858
|
-
/* @__PURE__ */ (0,
|
|
859
|
-
/* @__PURE__ */ (0,
|
|
860
|
-
/* @__PURE__ */ (0,
|
|
867
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-text-secondary", children: "\u2192" }),
|
|
868
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "text-right", children: [
|
|
869
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-xs uppercase text-success-dark", children: "Recomendado" }),
|
|
870
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-lg font-semibold text-brand-primary", children: newPrice })
|
|
861
871
|
] })
|
|
862
872
|
] }),
|
|
863
|
-
/* @__PURE__ */ (0,
|
|
864
|
-
/* @__PURE__ */ (0,
|
|
865
|
-
/* @__PURE__ */ (0,
|
|
866
|
-
/* @__PURE__ */ (0,
|
|
873
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex w-full items-center justify-between text-sm", children: [
|
|
874
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "text-left", children: [
|
|
875
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-xs text-text-secondary", children: "Impacto en Margen" }),
|
|
876
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "font-semibold text-success-dark", children: marginImpactLabel })
|
|
867
877
|
] }),
|
|
868
|
-
/* @__PURE__ */ (0,
|
|
869
|
-
/* @__PURE__ */ (0,
|
|
870
|
-
/* @__PURE__ */ (0,
|
|
878
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "text-right", children: [
|
|
879
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-xs text-text-secondary", children: "Volumen Estimado" }),
|
|
880
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "font-semibold text-success-dark", children: volumeImpactLabel })
|
|
871
881
|
] })
|
|
872
882
|
] })
|
|
873
883
|
] }),
|
|
874
|
-
/* @__PURE__ */ (0,
|
|
875
|
-
/* @__PURE__ */ (0,
|
|
876
|
-
/* @__PURE__ */ (0,
|
|
884
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center justify-end gap-4 border-t border-border px-8 py-4", children: [
|
|
885
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Button, { variant: "text", onClick: onClose, children: "Cancelar" }),
|
|
886
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Button, { variant: "primary", onClick: onConfirm, disabled: confirming, children: confirming ? "Aplicando..." : "Confirmar y aplicar" })
|
|
877
887
|
] })
|
|
878
888
|
] }) });
|
|
879
889
|
}
|
|
@@ -896,6 +906,7 @@ function ConfirmDialog({
|
|
|
896
906
|
FuelIcon,
|
|
897
907
|
FuelPumpSolidIcon,
|
|
898
908
|
LogOutIcon,
|
|
909
|
+
Logo,
|
|
899
910
|
MapPinIcon,
|
|
900
911
|
MiniMapCard,
|
|
901
912
|
NavItem,
|