@axzydev/axzy_ui_system 1.4.4 → 1.4.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +489 -351
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.d.cts +38 -1
- package/dist/index.d.ts +38 -1
- package/dist/index.js +452 -315
- package/dist/index.js.map +1 -1
- package/dist/layered.css +3 -0
- package/package.json +1 -1
- package/src/components/molecules/line-bar-chart/line-bar-chart.props.ts +28 -0
- package/src/components/molecules/line-bar-chart/line-bar-chart.tsx +169 -0
- package/src/index.ts +4 -2
package/dist/index.cjs
CHANGED
|
@@ -59,6 +59,7 @@ __export(index_exports, {
|
|
|
59
59
|
ITInput: () => ITInput,
|
|
60
60
|
ITInputNumber: () => ITInputNumber,
|
|
61
61
|
ITLayout: () => ITLayout,
|
|
62
|
+
ITLineBarChart: () => line_bar_chart_default,
|
|
62
63
|
ITLoader: () => ITLoader,
|
|
63
64
|
ITMaskedInput: () => ITMaskedInput,
|
|
64
65
|
ITMultiSelect: () => ITMultiSelect,
|
|
@@ -8318,13 +8319,149 @@ function ITStatCard({
|
|
|
8318
8319
|
);
|
|
8319
8320
|
}
|
|
8320
8321
|
|
|
8322
|
+
// src/components/molecules/line-bar-chart/line-bar-chart.tsx
|
|
8323
|
+
var import_react37 = require("react");
|
|
8324
|
+
var import_jsx_runtime61 = require("react/jsx-runtime");
|
|
8325
|
+
var compact = (value) => new Intl.NumberFormat("es-MX", { notation: "compact", maximumFractionDigits: 1 }).format(value);
|
|
8326
|
+
var plain = (value) => new Intl.NumberFormat("es-MX").format(value);
|
|
8327
|
+
function ITLineBarChart({
|
|
8328
|
+
data,
|
|
8329
|
+
ariaLabel,
|
|
8330
|
+
lineLabel = "Serie A",
|
|
8331
|
+
barLabel = "Serie B",
|
|
8332
|
+
lineColor = "#10b981",
|
|
8333
|
+
barColor = "#3b82f6",
|
|
8334
|
+
height = 240,
|
|
8335
|
+
formatValue = plain,
|
|
8336
|
+
formatAxis = compact,
|
|
8337
|
+
className = ""
|
|
8338
|
+
}) {
|
|
8339
|
+
const gradientId = (0, import_react37.useId)().replace(/[:]/g, "");
|
|
8340
|
+
const [hover, setHover] = (0, import_react37.useState)(null);
|
|
8341
|
+
const width = 720;
|
|
8342
|
+
const padding = { top: 16, right: 16, bottom: 28, left: 52 };
|
|
8343
|
+
const plotWidth = width - padding.left - padding.right;
|
|
8344
|
+
const plotHeight = height - padding.top - padding.bottom;
|
|
8345
|
+
const max = (0, import_react37.useMemo)(
|
|
8346
|
+
() => Math.max(...data.flatMap((d) => [d.line, d.bar]), 1),
|
|
8347
|
+
[data]
|
|
8348
|
+
);
|
|
8349
|
+
const gridValues = [0, 0.25, 0.5, 0.75, 1].map((f) => max * f);
|
|
8350
|
+
const step = data.length > 0 ? plotWidth / data.length : plotWidth;
|
|
8351
|
+
const barWidth = Math.max(Math.min(step * 0.42, 26), 4);
|
|
8352
|
+
const x = (index) => padding.left + step * index + step / 2;
|
|
8353
|
+
const y = (value) => padding.top + plotHeight - value / max * plotHeight;
|
|
8354
|
+
const linePoints = data.map((d, i) => `${x(i)},${y(d.line)}`).join(" ");
|
|
8355
|
+
const areaPath = data.length > 0 ? `M ${x(0)} ${y(data[0].line)} ` + data.slice(1).map((d, i) => `L ${x(i + 1)} ${y(d.line)}`).join(" ") + ` L ${x(data.length - 1)} ${padding.top + plotHeight} L ${x(0)} ${padding.top + plotHeight} Z` : "";
|
|
8356
|
+
const active = hover !== null ? data[hover] : null;
|
|
8357
|
+
return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: `flex flex-col gap-3 ${className}`.trim(), children: [
|
|
8358
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
|
|
8359
|
+
"svg",
|
|
8360
|
+
{
|
|
8361
|
+
role: "img",
|
|
8362
|
+
"aria-label": ariaLabel,
|
|
8363
|
+
viewBox: `0 0 ${width} ${height}`,
|
|
8364
|
+
style: { height, width: "100%" },
|
|
8365
|
+
onMouseLeave: () => setHover(null),
|
|
8366
|
+
children: [
|
|
8367
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("linearGradient", { id: `area-${gradientId}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
|
|
8368
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("stop", { offset: "0%", stopColor: lineColor, stopOpacity: "0.22" }),
|
|
8369
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("stop", { offset: "100%", stopColor: lineColor, stopOpacity: "0.02" })
|
|
8370
|
+
] }) }),
|
|
8371
|
+
gridValues.map((value, i) => /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("g", { children: [
|
|
8372
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
8373
|
+
"line",
|
|
8374
|
+
{
|
|
8375
|
+
x1: padding.left,
|
|
8376
|
+
x2: width - padding.right,
|
|
8377
|
+
y1: y(value),
|
|
8378
|
+
y2: y(value),
|
|
8379
|
+
stroke: "#e2e8f0",
|
|
8380
|
+
strokeWidth: 1,
|
|
8381
|
+
strokeDasharray: i === 0 ? void 0 : "3 4"
|
|
8382
|
+
}
|
|
8383
|
+
),
|
|
8384
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("text", { x: padding.left - 8, y: y(value) + 3, textAnchor: "end", fontSize: 10, fill: "#94a3b8", children: formatAxis(Math.round(value)) })
|
|
8385
|
+
] }, i)),
|
|
8386
|
+
data.map((d, i) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
8387
|
+
"rect",
|
|
8388
|
+
{
|
|
8389
|
+
x: x(i) - barWidth / 2,
|
|
8390
|
+
y: y(d.bar),
|
|
8391
|
+
width: barWidth,
|
|
8392
|
+
height: Math.max(padding.top + plotHeight - y(d.bar), 1),
|
|
8393
|
+
rx: 3,
|
|
8394
|
+
fill: barColor,
|
|
8395
|
+
opacity: hover === null || hover === i ? 0.85 : 0.35
|
|
8396
|
+
},
|
|
8397
|
+
`bar-${d.label}`
|
|
8398
|
+
)),
|
|
8399
|
+
areaPath && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: areaPath, fill: `url(#area-${gradientId})` }),
|
|
8400
|
+
data.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
8401
|
+
"polyline",
|
|
8402
|
+
{
|
|
8403
|
+
points: linePoints,
|
|
8404
|
+
fill: "none",
|
|
8405
|
+
stroke: lineColor,
|
|
8406
|
+
strokeWidth: 2.5,
|
|
8407
|
+
strokeLinecap: "round",
|
|
8408
|
+
strokeLinejoin: "round"
|
|
8409
|
+
}
|
|
8410
|
+
),
|
|
8411
|
+
data.map((d, i) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
8412
|
+
"circle",
|
|
8413
|
+
{
|
|
8414
|
+
cx: x(i),
|
|
8415
|
+
cy: y(d.line),
|
|
8416
|
+
r: hover === i ? 4.5 : 3,
|
|
8417
|
+
fill: "#ffffff",
|
|
8418
|
+
stroke: lineColor,
|
|
8419
|
+
strokeWidth: 2
|
|
8420
|
+
},
|
|
8421
|
+
`dot-${d.label}`
|
|
8422
|
+
)),
|
|
8423
|
+
data.map((d, i) => /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("g", { onMouseEnter: () => setHover(i), children: [
|
|
8424
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("rect", { x: padding.left + step * i, y: padding.top, width: step, height: plotHeight, fill: "transparent" }),
|
|
8425
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("text", { x: x(i), y: height - 8, textAnchor: "middle", fontSize: 10, fill: "#64748b", children: d.label })
|
|
8426
|
+
] }, `hit-${d.label}`)),
|
|
8427
|
+
active && hover !== null && /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("g", { transform: `translate(${Math.min(Math.max(x(hover) - 62, 4), width - 132)}, ${padding.top + 4})`, children: [
|
|
8428
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("rect", { width: 128, height: 46, rx: 6, fill: "#0f172a", opacity: 0.9 }),
|
|
8429
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("text", { x: 10, y: 18, fontSize: 10, fill: "#e2e8f0", children: active.label }),
|
|
8430
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("text", { x: 10, y: 32, fontSize: 10, fill: lineColor, children: [
|
|
8431
|
+
lineLabel,
|
|
8432
|
+
": ",
|
|
8433
|
+
formatValue(active.line)
|
|
8434
|
+
] }),
|
|
8435
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("text", { x: 10, y: 44, fontSize: 10, fill: "#93c5fd", children: [
|
|
8436
|
+
barLabel,
|
|
8437
|
+
": ",
|
|
8438
|
+
formatValue(active.bar)
|
|
8439
|
+
] })
|
|
8440
|
+
] })
|
|
8441
|
+
]
|
|
8442
|
+
}
|
|
8443
|
+
),
|
|
8444
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("ul", { className: "flex flex-wrap items-center gap-4 text-[11px]", style: { color: "#475569" }, children: [
|
|
8445
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("li", { children: [
|
|
8446
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { className: "h-2.5 w-2.5 rounded-sm", style: { background: lineColor }, "aria-hidden": true }),
|
|
8447
|
+
lineLabel
|
|
8448
|
+
] }),
|
|
8449
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("li", { children: [
|
|
8450
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { className: "h-2.5 w-2.5 rounded-sm", style: { background: barColor }, "aria-hidden": true }),
|
|
8451
|
+
barLabel
|
|
8452
|
+
] })
|
|
8453
|
+
] })
|
|
8454
|
+
] });
|
|
8455
|
+
}
|
|
8456
|
+
var line_bar_chart_default = ITLineBarChart;
|
|
8457
|
+
|
|
8321
8458
|
// src/components/molecules/table/table.tsx
|
|
8322
8459
|
var import_clsx44 = __toESM(require("clsx"), 1);
|
|
8323
|
-
var
|
|
8460
|
+
var import_react38 = __toESM(require("react"), 1);
|
|
8324
8461
|
var import_fa27 = require("react-icons/fa");
|
|
8325
8462
|
var import_md2 = require("react-icons/md");
|
|
8326
8463
|
var import_date_fns3 = require("date-fns");
|
|
8327
|
-
var
|
|
8464
|
+
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
8328
8465
|
function ITTable({
|
|
8329
8466
|
columns,
|
|
8330
8467
|
data = [],
|
|
@@ -8348,7 +8485,7 @@ function ITTable({
|
|
|
8348
8485
|
overscan = 5,
|
|
8349
8486
|
stickyHeader = false
|
|
8350
8487
|
}) {
|
|
8351
|
-
const [viewMode, setViewMode] = (0,
|
|
8488
|
+
const [viewMode, setViewMode] = (0, import_react38.useState)(defaultView);
|
|
8352
8489
|
const { ref: rootRef, width: containerWidth } = useElementSize();
|
|
8353
8490
|
const isFixed = layout === "fixed";
|
|
8354
8491
|
const forcedCards = autoCardBreakpoint > 0 && containerWidth > 0 && containerWidth < autoCardBreakpoint;
|
|
@@ -8365,7 +8502,7 @@ function ITTable({
|
|
|
8365
8502
|
handleSort,
|
|
8366
8503
|
handleItemsPerPageChange
|
|
8367
8504
|
} = useTableState({ defaultItemsPerPage });
|
|
8368
|
-
const sortedData =
|
|
8505
|
+
const sortedData = import_react38.default.useMemo(() => {
|
|
8369
8506
|
const safeData = Array.isArray(data) ? data : [];
|
|
8370
8507
|
if (!sortConfig) return safeData;
|
|
8371
8508
|
return [...safeData].sort((a, b) => {
|
|
@@ -8455,7 +8592,7 @@ function ITTable({
|
|
|
8455
8592
|
const isStickyHeader = stickyHeader && isTableVirtual;
|
|
8456
8593
|
const resolvedRowHeight = rowHeight ?? getRowHeight(size, density);
|
|
8457
8594
|
const columnCount = columns.length;
|
|
8458
|
-
const pinnedMeta =
|
|
8595
|
+
const pinnedMeta = import_react38.default.useMemo(() => getPinnedColumnMeta(columns), [columns]);
|
|
8459
8596
|
const {
|
|
8460
8597
|
scrollRef,
|
|
8461
8598
|
startIndex,
|
|
@@ -8480,14 +8617,14 @@ function ITTable({
|
|
|
8480
8617
|
if (currentValue === true) return "Filtrar solo verdaderos";
|
|
8481
8618
|
return "Filtrar solo falsos";
|
|
8482
8619
|
};
|
|
8483
|
-
return /* @__PURE__ */ (0,
|
|
8620
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8484
8621
|
"button",
|
|
8485
8622
|
{
|
|
8486
8623
|
className: "flex items-center justify-center cursor-pointer focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 rounded-full p-1 transition-all duration-200",
|
|
8487
8624
|
onClick: () => handleFilterChange(col.key, nextValue),
|
|
8488
8625
|
"aria-label": `${getToggleLabel()} para ${col.label}`,
|
|
8489
8626
|
title: `${getToggleLabel()} para ${col.label}`,
|
|
8490
|
-
children: /* @__PURE__ */ (0,
|
|
8627
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "relative w-10 h-5 bg-secondary-300 rounded-full", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8491
8628
|
"div",
|
|
8492
8629
|
{
|
|
8493
8630
|
className: (0, import_clsx44.default)(
|
|
@@ -8505,7 +8642,7 @@ function ITTable({
|
|
|
8505
8642
|
}
|
|
8506
8643
|
if (col.filter === "catalog" && col.catalogOptions) {
|
|
8507
8644
|
if (col.catalogOptions.loading) {
|
|
8508
|
-
return /* @__PURE__ */ (0,
|
|
8645
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8509
8646
|
import_fa27.FaSpinner,
|
|
8510
8647
|
{
|
|
8511
8648
|
className: "animate-spin",
|
|
@@ -8515,9 +8652,9 @@ function ITTable({
|
|
|
8515
8652
|
);
|
|
8516
8653
|
}
|
|
8517
8654
|
if (col.catalogOptions.error) {
|
|
8518
|
-
return /* @__PURE__ */ (0,
|
|
8655
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ITText, { as: "span", className: "text-danger-500 text-xs", children: "Error cargando" });
|
|
8519
8656
|
}
|
|
8520
|
-
return /* @__PURE__ */ (0,
|
|
8657
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8521
8658
|
ITSelect,
|
|
8522
8659
|
{
|
|
8523
8660
|
name: `filter-${col.key}`,
|
|
@@ -8541,7 +8678,7 @@ function ITTable({
|
|
|
8541
8678
|
}
|
|
8542
8679
|
if (col.filter === "search" && col.catalogOptions) {
|
|
8543
8680
|
if (col.catalogOptions.loading) {
|
|
8544
|
-
return /* @__PURE__ */ (0,
|
|
8681
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8545
8682
|
import_fa27.FaSpinner,
|
|
8546
8683
|
{
|
|
8547
8684
|
className: "animate-spin",
|
|
@@ -8551,10 +8688,10 @@ function ITTable({
|
|
|
8551
8688
|
);
|
|
8552
8689
|
}
|
|
8553
8690
|
if (col.catalogOptions.error) {
|
|
8554
|
-
return /* @__PURE__ */ (0,
|
|
8691
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ITText, { as: "span", className: "text-danger-500 text-xs", children: "Error cargando" });
|
|
8555
8692
|
}
|
|
8556
8693
|
const searchValue = filters[col.key];
|
|
8557
|
-
return /* @__PURE__ */ (0,
|
|
8694
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8558
8695
|
ITSearchSelect,
|
|
8559
8696
|
{
|
|
8560
8697
|
name: `filter-${col.key}`,
|
|
@@ -8577,7 +8714,7 @@ function ITTable({
|
|
|
8577
8714
|
}
|
|
8578
8715
|
if (col.filter === "date") {
|
|
8579
8716
|
const dateValue = filters[col.key];
|
|
8580
|
-
return /* @__PURE__ */ (0,
|
|
8717
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8581
8718
|
ITDatePicker,
|
|
8582
8719
|
{
|
|
8583
8720
|
name: `filter-${col.key}`,
|
|
@@ -8593,7 +8730,7 @@ function ITTable({
|
|
|
8593
8730
|
}
|
|
8594
8731
|
if (col.filter === "date-range") {
|
|
8595
8732
|
const rangeValue = filters[col.key];
|
|
8596
|
-
return /* @__PURE__ */ (0,
|
|
8733
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8597
8734
|
ITDatePicker,
|
|
8598
8735
|
{
|
|
8599
8736
|
name: `filter-${col.key}`,
|
|
@@ -8608,7 +8745,7 @@ function ITTable({
|
|
|
8608
8745
|
}
|
|
8609
8746
|
);
|
|
8610
8747
|
}
|
|
8611
|
-
return /* @__PURE__ */ (0,
|
|
8748
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8612
8749
|
ITInput,
|
|
8613
8750
|
{
|
|
8614
8751
|
name: `filter-${col.key}`,
|
|
@@ -8630,14 +8767,14 @@ function ITTable({
|
|
|
8630
8767
|
case "number":
|
|
8631
8768
|
return typeof value === "number" && col.currencyMX ? formatCurrencyMX(value) : value;
|
|
8632
8769
|
case "boolean":
|
|
8633
|
-
return value ? /* @__PURE__ */ (0,
|
|
8770
|
+
return value ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8634
8771
|
import_fa27.FaCheck,
|
|
8635
8772
|
{
|
|
8636
8773
|
className: "text-success-500",
|
|
8637
8774
|
"aria-label": "Verdadero",
|
|
8638
8775
|
title: "Verdadero"
|
|
8639
8776
|
}
|
|
8640
|
-
) : /* @__PURE__ */ (0,
|
|
8777
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8641
8778
|
import_fa27.FaTimes,
|
|
8642
8779
|
{
|
|
8643
8780
|
className: "text-danger-500",
|
|
@@ -8662,12 +8799,12 @@ function ITTable({
|
|
|
8662
8799
|
const renderDefaultCard = (row) => {
|
|
8663
8800
|
const dataCols = columns.filter((c) => c.type !== "actions");
|
|
8664
8801
|
const actionCol = columns.find((c) => c.type === "actions");
|
|
8665
|
-
return /* @__PURE__ */ (0,
|
|
8666
|
-
dataCols.map((col) => /* @__PURE__ */ (0,
|
|
8667
|
-
/* @__PURE__ */ (0,
|
|
8668
|
-
/* @__PURE__ */ (0,
|
|
8802
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "bg-white dark:bg-slate-800 rounded-lg border border-slate-200 dark:border-slate-700 p-3 space-y-2 shadow-sm", children: [
|
|
8803
|
+
dataCols.map((col) => /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
|
|
8804
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { className: "text-[10px] font-bold uppercase tracking-wider text-slate-400 whitespace-nowrap flex-shrink-0 min-w-[70px]", children: col.label }),
|
|
8805
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { className: "text-sm font-medium text-slate-800 dark:text-white text-right truncate", children: renderCellContent(col, row) })
|
|
8669
8806
|
] }, col.key)),
|
|
8670
|
-
actionCol?.actions && /* @__PURE__ */ (0,
|
|
8807
|
+
actionCol?.actions && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "flex items-center justify-end gap-2 pt-2 border-t border-slate-100 dark:border-slate-700", children: actionCol.actions(row) })
|
|
8671
8808
|
] });
|
|
8672
8809
|
};
|
|
8673
8810
|
const handleRowClick = (row) => (event) => {
|
|
@@ -8681,61 +8818,61 @@ function ITTable({
|
|
|
8681
8818
|
event.preventDefault();
|
|
8682
8819
|
onRowClick(row, event);
|
|
8683
8820
|
};
|
|
8684
|
-
return /* @__PURE__ */ (0,
|
|
8685
|
-
title && /* @__PURE__ */ (0,
|
|
8686
|
-
/* @__PURE__ */ (0,
|
|
8687
|
-
/* @__PURE__ */ (0,
|
|
8688
|
-
/* @__PURE__ */ (0,
|
|
8821
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { ref: rootRef, className: (0, import_clsx44.default)("space-y-4 w-full", containerClassName), children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: tableContainer, style: { backgroundColor: "var(--color-table-rowBg, #ffffff)" }, children: [
|
|
8822
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "px-6 py-5 flex items-center justify-between", style: { backgroundColor: "var(--color-table-rowBg, #ffffff)" }, children: [
|
|
8823
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ITText, { as: "h2", className: "text-xl font-bold text-secondary-900 leading-tight", children: title }),
|
|
8824
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "flex items-center bg-slate-100 dark:bg-slate-800/80 rounded-lg p-0.5 border border-slate-200 dark:border-slate-700/50", children: [
|
|
8825
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
|
|
8689
8826
|
"button",
|
|
8690
8827
|
{
|
|
8691
8828
|
onClick: () => setViewMode("table"),
|
|
8692
8829
|
disabled: forcedCards,
|
|
8693
8830
|
className: `flex items-center gap-1.5 px-3 py-1.5 rounded-md text-xs font-semibold transition-all ${effectiveView === "table" ? "bg-white dark:bg-slate-900 text-slate-900 dark:text-white shadow-sm border border-slate-200/50 dark:border-slate-700" : "text-slate-500 dark:text-slate-400 hover:text-slate-700 dark:hover:text-slate-200"}`,
|
|
8694
8831
|
children: [
|
|
8695
|
-
/* @__PURE__ */ (0,
|
|
8832
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_fa27.FaTable, { size: 11 }),
|
|
8696
8833
|
"Table"
|
|
8697
8834
|
]
|
|
8698
8835
|
}
|
|
8699
8836
|
),
|
|
8700
|
-
/* @__PURE__ */ (0,
|
|
8837
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
|
|
8701
8838
|
"button",
|
|
8702
8839
|
{
|
|
8703
8840
|
onClick: () => setViewMode("cards"),
|
|
8704
8841
|
className: `flex items-center gap-1.5 px-3 py-1.5 rounded-md text-xs font-semibold transition-all ${effectiveView === "cards" ? "bg-white dark:bg-slate-900 text-slate-900 dark:text-white shadow-sm border border-slate-200/50 dark:border-slate-700" : "text-slate-500 dark:text-slate-400 hover:text-slate-700 dark:hover:text-slate-200"}`,
|
|
8705
8842
|
children: [
|
|
8706
|
-
/* @__PURE__ */ (0,
|
|
8843
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_fa27.FaThLarge, { size: 11 }),
|
|
8707
8844
|
"Cards"
|
|
8708
8845
|
]
|
|
8709
8846
|
}
|
|
8710
8847
|
)
|
|
8711
8848
|
] })
|
|
8712
8849
|
] }),
|
|
8713
|
-
!title && /* @__PURE__ */ (0,
|
|
8714
|
-
/* @__PURE__ */ (0,
|
|
8850
|
+
!title && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "flex justify-end px-4 pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "flex items-center bg-slate-100 dark:bg-slate-800/80 rounded-lg p-0.5 border border-slate-200 dark:border-slate-700/50", children: [
|
|
8851
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
|
|
8715
8852
|
"button",
|
|
8716
8853
|
{
|
|
8717
8854
|
onClick: () => setViewMode("table"),
|
|
8718
8855
|
disabled: forcedCards,
|
|
8719
8856
|
className: `flex items-center gap-1.5 px-3 py-1.5 rounded-md text-xs font-semibold transition-all ${effectiveView === "table" ? "bg-white dark:bg-slate-900 text-slate-900 dark:text-white shadow-sm border border-slate-200/50 dark:border-slate-700" : "text-slate-500 dark:text-slate-400 hover:text-slate-700 dark:hover:text-slate-200"}`,
|
|
8720
8857
|
children: [
|
|
8721
|
-
/* @__PURE__ */ (0,
|
|
8858
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_fa27.FaTable, { size: 11 }),
|
|
8722
8859
|
"Table"
|
|
8723
8860
|
]
|
|
8724
8861
|
}
|
|
8725
8862
|
),
|
|
8726
|
-
/* @__PURE__ */ (0,
|
|
8863
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
|
|
8727
8864
|
"button",
|
|
8728
8865
|
{
|
|
8729
8866
|
onClick: () => setViewMode("cards"),
|
|
8730
8867
|
className: `flex items-center gap-1.5 px-3 py-1.5 rounded-md text-xs font-semibold transition-all ${effectiveView === "cards" ? "bg-white dark:bg-slate-900 text-slate-900 dark:text-white shadow-sm border border-slate-200/50 dark:border-slate-700" : "text-slate-500 dark:text-slate-400 hover:text-slate-700 dark:hover:text-slate-200"}`,
|
|
8731
8868
|
children: [
|
|
8732
|
-
/* @__PURE__ */ (0,
|
|
8869
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_fa27.FaThLarge, { size: 11 }),
|
|
8733
8870
|
"Cards"
|
|
8734
8871
|
]
|
|
8735
8872
|
}
|
|
8736
8873
|
)
|
|
8737
8874
|
] }) }),
|
|
8738
|
-
effectiveView === "cards" ? /* @__PURE__ */ (0,
|
|
8875
|
+
effectiveView === "cards" ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "p-4 space-y-3 max-h-[400px] overflow-y-auto", children: currentData.length > 0 ? currentData.map((row, i) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8739
8876
|
"div",
|
|
8740
8877
|
{
|
|
8741
8878
|
className: (0, import_clsx44.default)(tableCardHover, onRowClick && tableCardClickable),
|
|
@@ -8746,16 +8883,16 @@ function ITTable({
|
|
|
8746
8883
|
children: renderCard ? renderCard(row) : renderDefaultCard(row)
|
|
8747
8884
|
},
|
|
8748
8885
|
i
|
|
8749
|
-
)) : /* @__PURE__ */ (0,
|
|
8750
|
-
/* @__PURE__ */ (0,
|
|
8751
|
-
/* @__PURE__ */ (0,
|
|
8752
|
-
] }) }) : /* @__PURE__ */ (0,
|
|
8886
|
+
)) : /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: (0, import_clsx44.default)(tableEmptyContent, "py-12"), children: [
|
|
8887
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ITText, { as: "span", className: "text-lg", children: "No se encontraron resultados" }),
|
|
8888
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ITText, { as: "span", className: "text-sm mt-1", children: "Intenta ajustar los filtros" })
|
|
8889
|
+
] }) }) : /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8753
8890
|
"div",
|
|
8754
8891
|
{
|
|
8755
8892
|
ref: isTableVirtual ? scrollRef : void 0,
|
|
8756
8893
|
className: isTableVirtual ? "overflow-x-auto overflow-y-auto" : "overflow-x-auto",
|
|
8757
8894
|
style: isTableVirtual ? { maxHeight: virtualizedMaxHeight } : void 0,
|
|
8758
|
-
children: /* @__PURE__ */ (0,
|
|
8895
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
|
|
8759
8896
|
"table",
|
|
8760
8897
|
{
|
|
8761
8898
|
className: (0, import_clsx44.default)(
|
|
@@ -8768,14 +8905,14 @@ function ITTable({
|
|
|
8768
8905
|
style: isFixed ? { tableLayout: "fixed" } : void 0,
|
|
8769
8906
|
"aria-rowcount": isTableVirtual ? currentData.length + 1 : void 0,
|
|
8770
8907
|
children: [
|
|
8771
|
-
hasColumnWidths && /* @__PURE__ */ (0,
|
|
8908
|
+
hasColumnWidths && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("colgroup", { children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8772
8909
|
"col",
|
|
8773
8910
|
{
|
|
8774
8911
|
style: col.width != null ? { width: typeof col.width === "number" ? `${col.width}px` : col.width } : void 0
|
|
8775
8912
|
},
|
|
8776
8913
|
col.key
|
|
8777
8914
|
)) }),
|
|
8778
|
-
/* @__PURE__ */ (0,
|
|
8915
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8779
8916
|
"tr",
|
|
8780
8917
|
{
|
|
8781
8918
|
className: (0, import_clsx44.default)(tableHeaderRow, "dark:text-slate-200"),
|
|
@@ -8783,7 +8920,7 @@ function ITTable({
|
|
|
8783
8920
|
children: columns.map((col) => {
|
|
8784
8921
|
const pin = pinnedMeta[col.key];
|
|
8785
8922
|
const isPinned = pin != null;
|
|
8786
|
-
return /* @__PURE__ */ (0,
|
|
8923
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8787
8924
|
"th",
|
|
8788
8925
|
{
|
|
8789
8926
|
scope: "col",
|
|
@@ -8800,20 +8937,20 @@ function ITTable({
|
|
|
8800
8937
|
...isStickyHeader || isPinned ? { backgroundColor: "var(--color-table-headerBg, #f8fafc)" } : {},
|
|
8801
8938
|
...isPinned ? pin.side === "left" ? { left: pin.offset } : { right: pin.offset } : {}
|
|
8802
8939
|
} : void 0,
|
|
8803
|
-
children: /* @__PURE__ */ (0,
|
|
8804
|
-
/* @__PURE__ */ (0,
|
|
8805
|
-
/* @__PURE__ */ (0,
|
|
8806
|
-
col.sortable && col.type !== "actions" && /* @__PURE__ */ (0,
|
|
8940
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: isFixed ? "flex flex-col gap-3" : "flex flex-col gap-3 min-w-[150px]", children: [
|
|
8941
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
|
|
8942
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ITText, { as: "span", className: "text-slate-900 dark:text-white font-bold", children: col.label }),
|
|
8943
|
+
col.sortable && col.type !== "actions" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8807
8944
|
"button",
|
|
8808
8945
|
{
|
|
8809
8946
|
onClick: () => handleSort(col.key),
|
|
8810
8947
|
className: `p-1 rounded-md transition-colors ${sortConfig?.key === col.key ? "bg-secondary-200 text-secondary-900" : "hover:bg-secondary-200 text-secondary-400 hover:text-secondary-700"}`,
|
|
8811
8948
|
title: `Ordenar por ${col.label}`,
|
|
8812
|
-
children: /* @__PURE__ */ (0,
|
|
8949
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_md2.MdOutlineSwapVert, { className: "w-4 h-4", "aria-hidden": "true" })
|
|
8813
8950
|
}
|
|
8814
8951
|
)
|
|
8815
8952
|
] }),
|
|
8816
|
-
/* @__PURE__ */ (0,
|
|
8953
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "w-full", children: col.filter ? renderFilterInput(col) : null })
|
|
8817
8954
|
] })
|
|
8818
8955
|
},
|
|
8819
8956
|
col.key
|
|
@@ -8821,11 +8958,11 @@ function ITTable({
|
|
|
8821
8958
|
})
|
|
8822
8959
|
}
|
|
8823
8960
|
) }),
|
|
8824
|
-
/* @__PURE__ */ (0,
|
|
8825
|
-
isTableVirtual && topSpacerHeight > 0 && /* @__PURE__ */ (0,
|
|
8961
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("tbody", { className: (0, import_clsx44.default)(tableBody, "dark:divide-slate-700/30"), children: currentData.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_jsx_runtime62.Fragment, { children: [
|
|
8962
|
+
isTableVirtual && topSpacerHeight > 0 && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("tr", { "aria-hidden": "true", style: { height: topSpacerHeight }, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("td", { colSpan: columnCount, style: { padding: 0, border: 0 } }) }),
|
|
8826
8963
|
windowData.map((row, windowIndex) => {
|
|
8827
8964
|
const absoluteIndex = isTableVirtual ? startIndex + windowIndex : windowIndex;
|
|
8828
|
-
return /* @__PURE__ */ (0,
|
|
8965
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8829
8966
|
"tr",
|
|
8830
8967
|
{
|
|
8831
8968
|
"aria-rowindex": isTableVirtual ? absoluteIndex + 2 : void 0,
|
|
@@ -8842,7 +8979,7 @@ function ITTable({
|
|
|
8842
8979
|
const truncateTitle = col.truncate && (typeof rawValue === "string" || typeof rawValue === "number") ? String(rawValue) : void 0;
|
|
8843
8980
|
const pin = pinnedMeta[col.key];
|
|
8844
8981
|
const isPinned = pin != null;
|
|
8845
|
-
return /* @__PURE__ */ (0,
|
|
8982
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8846
8983
|
"td",
|
|
8847
8984
|
{
|
|
8848
8985
|
className: (0, import_clsx44.default)(
|
|
@@ -8857,7 +8994,7 @@ function ITTable({
|
|
|
8857
8994
|
...isPinned ? pin.side === "left" ? { left: pin.offset } : { right: pin.offset } : {}
|
|
8858
8995
|
} : void 0,
|
|
8859
8996
|
title: truncateTitle,
|
|
8860
|
-
children: col.type === "actions" ? /* @__PURE__ */ (0,
|
|
8997
|
+
children: col.type === "actions" ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: tableActionsCell, children: renderCellContent(col, row) }) : /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: (0, import_clsx44.default)(tableCellText, col.truncate && "truncate"), children: renderCellContent(col, row) })
|
|
8861
8998
|
},
|
|
8862
8999
|
`${absoluteIndex}-${col.key}`
|
|
8863
9000
|
);
|
|
@@ -8866,17 +9003,17 @@ function ITTable({
|
|
|
8866
9003
|
absoluteIndex
|
|
8867
9004
|
);
|
|
8868
9005
|
}),
|
|
8869
|
-
isTableVirtual && bottomSpacerHeight > 0 && /* @__PURE__ */ (0,
|
|
8870
|
-
] }) : /* @__PURE__ */ (0,
|
|
8871
|
-
/* @__PURE__ */ (0,
|
|
8872
|
-
/* @__PURE__ */ (0,
|
|
9006
|
+
isTableVirtual && bottomSpacerHeight > 0 && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("tr", { "aria-hidden": "true", style: { height: bottomSpacerHeight }, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("td", { colSpan: columnCount, style: { padding: 0, border: 0 } }) })
|
|
9007
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("td", { colSpan: columns.length, className: "px-6 py-12 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: tableEmptyContent, children: [
|
|
9008
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ITText, { as: "span", className: "text-lg", children: "No se encontraron resultados" }),
|
|
9009
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ITText, { as: "span", className: "text-sm mt-1", children: "Intenta ajustar los filtros" })
|
|
8873
9010
|
] }) }) }) })
|
|
8874
9011
|
]
|
|
8875
9012
|
}
|
|
8876
9013
|
)
|
|
8877
9014
|
}
|
|
8878
9015
|
),
|
|
8879
|
-
/* @__PURE__ */ (0,
|
|
9016
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "rounded-b-xl px-6 py-4", style: { backgroundColor: "var(--color-table-rowBg, #ffffff)" }, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8880
9017
|
ITPagination,
|
|
8881
9018
|
{
|
|
8882
9019
|
currentPage,
|
|
@@ -8894,7 +9031,7 @@ function ITTable({
|
|
|
8894
9031
|
|
|
8895
9032
|
// src/components/atoms/textarea/textarea.tsx
|
|
8896
9033
|
var import_clsx45 = __toESM(require("clsx"), 1);
|
|
8897
|
-
var
|
|
9034
|
+
var import_jsx_runtime63 = require("react/jsx-runtime");
|
|
8898
9035
|
var resizeMap = {
|
|
8899
9036
|
none: "resize-none",
|
|
8900
9037
|
vertical: "resize-y",
|
|
@@ -8914,9 +9051,9 @@ function ITTextarea({
|
|
|
8914
9051
|
maxLength,
|
|
8915
9052
|
resize = "vertical"
|
|
8916
9053
|
}) {
|
|
8917
|
-
return /* @__PURE__ */ (0,
|
|
8918
|
-
label && /* @__PURE__ */ (0,
|
|
8919
|
-
/* @__PURE__ */ (0,
|
|
9054
|
+
return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: (0, import_clsx45.default)("flex flex-col gap-1.5", className), children: [
|
|
9055
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(ITText, { as: "label", className: inputLabel(!!error), htmlFor: name, children: label }),
|
|
9056
|
+
/* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
|
|
8920
9057
|
"textarea",
|
|
8921
9058
|
{
|
|
8922
9059
|
id: name,
|
|
@@ -8936,14 +9073,14 @@ function ITTextarea({
|
|
|
8936
9073
|
)
|
|
8937
9074
|
}
|
|
8938
9075
|
),
|
|
8939
|
-
error && /* @__PURE__ */ (0,
|
|
9076
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(ITText, { as: "span", className: inputError, children: error })
|
|
8940
9077
|
] });
|
|
8941
9078
|
}
|
|
8942
9079
|
|
|
8943
9080
|
// src/components/molecules/tabs/tabs.tsx
|
|
8944
|
-
var
|
|
9081
|
+
var import_react39 = require("react");
|
|
8945
9082
|
var import_clsx46 = require("clsx");
|
|
8946
|
-
var
|
|
9083
|
+
var import_jsx_runtime64 = require("react/jsx-runtime");
|
|
8947
9084
|
var ITTabs = ({
|
|
8948
9085
|
items,
|
|
8949
9086
|
defaultActiveId,
|
|
@@ -8952,21 +9089,21 @@ var ITTabs = ({
|
|
|
8952
9089
|
className = "",
|
|
8953
9090
|
containerClassName = ""
|
|
8954
9091
|
}) => {
|
|
8955
|
-
const [activeId, setActiveId] = (0,
|
|
9092
|
+
const [activeId, setActiveId] = (0, import_react39.useState)(defaultActiveId || items[0]?.id);
|
|
8956
9093
|
const handleTabClick = (id, disabled) => {
|
|
8957
9094
|
if (disabled) return;
|
|
8958
9095
|
setActiveId(id);
|
|
8959
9096
|
if (onChange) onChange(id);
|
|
8960
9097
|
};
|
|
8961
9098
|
const activeContent = items.find((item) => item.id === activeId)?.content;
|
|
8962
|
-
return /* @__PURE__ */ (0,
|
|
8963
|
-
/* @__PURE__ */ (0,
|
|
9099
|
+
return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: (0, import_clsx46.clsx)("w-full", containerClassName), children: [
|
|
9100
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: (0, import_clsx46.clsx)(
|
|
8964
9101
|
"flex border-secondary-200 mb-4",
|
|
8965
9102
|
variant === "line" ? "border-b" : "gap-2 p-1 bg-secondary-100 rounded-lg w-fit",
|
|
8966
9103
|
className
|
|
8967
9104
|
), children: items.map((item) => {
|
|
8968
9105
|
const isActive = item.id === activeId;
|
|
8969
|
-
return /* @__PURE__ */ (0,
|
|
9106
|
+
return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
|
|
8970
9107
|
"button",
|
|
8971
9108
|
{
|
|
8972
9109
|
onClick: () => handleTabClick(item.id, item.disabled),
|
|
@@ -8986,21 +9123,21 @@ var ITTabs = ({
|
|
|
8986
9123
|
item.disabled && "opacity-50 cursor-not-allowed"
|
|
8987
9124
|
),
|
|
8988
9125
|
children: [
|
|
8989
|
-
item.icon && /* @__PURE__ */ (0,
|
|
8990
|
-
/* @__PURE__ */ (0,
|
|
9126
|
+
item.icon && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("span", { className: "w-4 h-4", children: item.icon }),
|
|
9127
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)(ITText, { as: "span", children: item.label })
|
|
8991
9128
|
]
|
|
8992
9129
|
},
|
|
8993
9130
|
item.id
|
|
8994
9131
|
);
|
|
8995
9132
|
}) }),
|
|
8996
|
-
/* @__PURE__ */ (0,
|
|
9133
|
+
/* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "tab-content animate-fadeIn", children: activeContent })
|
|
8997
9134
|
] });
|
|
8998
9135
|
};
|
|
8999
9136
|
var tabs_default = ITTabs;
|
|
9000
9137
|
|
|
9001
9138
|
// src/components/organisms/triple-filter/tripleFilter.tsx
|
|
9002
9139
|
var import_clsx47 = __toESM(require("clsx"), 1);
|
|
9003
|
-
var
|
|
9140
|
+
var import_jsx_runtime65 = require("react/jsx-runtime");
|
|
9004
9141
|
var colorMap2 = {
|
|
9005
9142
|
primary: "text-primary-600",
|
|
9006
9143
|
secondary: "text-secondary-600",
|
|
@@ -9019,11 +9156,11 @@ var ITTripleFilter = ({
|
|
|
9019
9156
|
color = "primary",
|
|
9020
9157
|
className
|
|
9021
9158
|
}) => {
|
|
9022
|
-
return /* @__PURE__ */ (0,
|
|
9159
|
+
return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
9023
9160
|
"div",
|
|
9024
9161
|
{
|
|
9025
9162
|
className: (0, import_clsx47.default)("flex bg-slate-100 p-1 rounded-xl gap-1 w-fit", className),
|
|
9026
|
-
children: options.map((option) => /* @__PURE__ */ (0,
|
|
9163
|
+
children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
|
|
9027
9164
|
"button",
|
|
9028
9165
|
{
|
|
9029
9166
|
onClick: () => onChange(option.value),
|
|
@@ -9031,7 +9168,7 @@ var ITTripleFilter = ({
|
|
|
9031
9168
|
"px-4 py-1.5 rounded-lg text-[10px] font-bold uppercase tracking-wider transition-all duration-200 whitespace-nowrap",
|
|
9032
9169
|
value === option.value ? (0, import_clsx47.default)("bg-white shadow-sm", colorMap2[color]) : "text-slate-400 hover:text-slate-600"
|
|
9033
9170
|
),
|
|
9034
|
-
children: /* @__PURE__ */ (0,
|
|
9171
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(ITText, { as: "span", children: option.label })
|
|
9035
9172
|
},
|
|
9036
9173
|
String(option.value)
|
|
9037
9174
|
))
|
|
@@ -9052,9 +9189,9 @@ var positionStyles = {
|
|
|
9052
9189
|
|
|
9053
9190
|
// src/components/organisms/toast/toast.tsx
|
|
9054
9191
|
var import_clsx48 = __toESM(require("clsx"), 1);
|
|
9055
|
-
var
|
|
9192
|
+
var import_react40 = require("react");
|
|
9056
9193
|
var import_fa28 = require("react-icons/fa");
|
|
9057
|
-
var
|
|
9194
|
+
var import_jsx_runtime66 = require("react/jsx-runtime");
|
|
9058
9195
|
function ITToast({
|
|
9059
9196
|
message,
|
|
9060
9197
|
type = "info",
|
|
@@ -9062,8 +9199,8 @@ function ITToast({
|
|
|
9062
9199
|
position = "top-right",
|
|
9063
9200
|
onClose
|
|
9064
9201
|
}) {
|
|
9065
|
-
const [isVisible, setIsVisible] = (0,
|
|
9066
|
-
(0,
|
|
9202
|
+
const [isVisible, setIsVisible] = (0, import_react40.useState)(true);
|
|
9203
|
+
(0, import_react40.useEffect)(() => {
|
|
9067
9204
|
const timer = setTimeout(() => {
|
|
9068
9205
|
setIsVisible(false);
|
|
9069
9206
|
setTimeout(() => {
|
|
@@ -9083,18 +9220,18 @@ function ITToast({
|
|
|
9083
9220
|
const TypeIcon = () => {
|
|
9084
9221
|
switch (type) {
|
|
9085
9222
|
case "success":
|
|
9086
|
-
return /* @__PURE__ */ (0,
|
|
9223
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_fa28.FaCheckCircle, { className: "w-5 h-5 flex-shrink-0" });
|
|
9087
9224
|
case "error":
|
|
9088
9225
|
case "danger":
|
|
9089
|
-
return /* @__PURE__ */ (0,
|
|
9226
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_fa28.FaTimesCircle, { className: "w-5 h-5 flex-shrink-0" });
|
|
9090
9227
|
case "warning":
|
|
9091
|
-
return /* @__PURE__ */ (0,
|
|
9228
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_fa28.FaExclamationTriangle, { className: "w-5 h-5 flex-shrink-0" });
|
|
9092
9229
|
case "info":
|
|
9093
9230
|
default:
|
|
9094
|
-
return /* @__PURE__ */ (0,
|
|
9231
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_fa28.FaInfoCircle, { className: "w-5 h-5 flex-shrink-0" });
|
|
9095
9232
|
}
|
|
9096
9233
|
};
|
|
9097
|
-
return /* @__PURE__ */ (0,
|
|
9234
|
+
return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
9098
9235
|
"div",
|
|
9099
9236
|
{
|
|
9100
9237
|
className: (0, import_clsx48.default)(
|
|
@@ -9110,17 +9247,17 @@ function ITToast({
|
|
|
9110
9247
|
style: { backgroundColor },
|
|
9111
9248
|
role: "alert",
|
|
9112
9249
|
children: [
|
|
9113
|
-
/* @__PURE__ */ (0,
|
|
9114
|
-
/* @__PURE__ */ (0,
|
|
9115
|
-
/* @__PURE__ */ (0,
|
|
9250
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "flex items-center gap-3", children: [
|
|
9251
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(TypeIcon, {}),
|
|
9252
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(ITText, { as: "span", className: "font-medium text-sm sm:text-base leading-snug", children: message })
|
|
9116
9253
|
] }),
|
|
9117
|
-
/* @__PURE__ */ (0,
|
|
9254
|
+
/* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
|
|
9118
9255
|
"button",
|
|
9119
9256
|
{
|
|
9120
9257
|
onClick: handleClose,
|
|
9121
9258
|
className: "p-1.5 rounded-full hover:bg-black/15 transition-colors focus:outline-none focus:ring-2 focus:ring-white/50",
|
|
9122
9259
|
"aria-label": "Close notification",
|
|
9123
|
-
children: /* @__PURE__ */ (0,
|
|
9260
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_fa28.FaTimes, { className: "w-4 h-4" })
|
|
9124
9261
|
}
|
|
9125
9262
|
)
|
|
9126
9263
|
]
|
|
@@ -9129,7 +9266,7 @@ function ITToast({
|
|
|
9129
9266
|
}
|
|
9130
9267
|
|
|
9131
9268
|
// src/components/molecules/wysiwyg/wysiwyg.tsx
|
|
9132
|
-
var
|
|
9269
|
+
var import_react42 = require("react");
|
|
9133
9270
|
var import_clsx50 = __toESM(require("clsx"), 1);
|
|
9134
9271
|
var import_fa29 = require("react-icons/fa");
|
|
9135
9272
|
|
|
@@ -9145,9 +9282,9 @@ var toolbarActions = [
|
|
|
9145
9282
|
];
|
|
9146
9283
|
|
|
9147
9284
|
// src/components/atoms/tooltip/tooltip.tsx
|
|
9148
|
-
var
|
|
9285
|
+
var import_react41 = require("react");
|
|
9149
9286
|
var import_clsx49 = __toESM(require("clsx"), 1);
|
|
9150
|
-
var
|
|
9287
|
+
var import_jsx_runtime67 = require("react/jsx-runtime");
|
|
9151
9288
|
var positionClasses2 = {
|
|
9152
9289
|
top: "bottom-full left-1/2 -translate-x-1/2 mb-2",
|
|
9153
9290
|
bottom: "top-full left-1/2 -translate-x-1/2 mt-2",
|
|
@@ -9167,7 +9304,7 @@ function ITTooltip({
|
|
|
9167
9304
|
delay = 200,
|
|
9168
9305
|
className
|
|
9169
9306
|
}) {
|
|
9170
|
-
const [visible, setVisible] = (0,
|
|
9307
|
+
const [visible, setVisible] = (0, import_react41.useState)(false);
|
|
9171
9308
|
let timeout;
|
|
9172
9309
|
const handleMouseEnter = () => {
|
|
9173
9310
|
timeout = setTimeout(() => setVisible(true), delay);
|
|
@@ -9176,7 +9313,7 @@ function ITTooltip({
|
|
|
9176
9313
|
clearTimeout(timeout);
|
|
9177
9314
|
setVisible(false);
|
|
9178
9315
|
};
|
|
9179
|
-
return /* @__PURE__ */ (0,
|
|
9316
|
+
return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
|
|
9180
9317
|
"div",
|
|
9181
9318
|
{
|
|
9182
9319
|
className: (0, import_clsx49.default)("relative inline-flex", className),
|
|
@@ -9184,9 +9321,9 @@ function ITTooltip({
|
|
|
9184
9321
|
onMouseLeave: handleMouseLeave,
|
|
9185
9322
|
children: [
|
|
9186
9323
|
children,
|
|
9187
|
-
visible && /* @__PURE__ */ (0,
|
|
9188
|
-
/* @__PURE__ */ (0,
|
|
9189
|
-
/* @__PURE__ */ (0,
|
|
9324
|
+
visible && /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { className: (0, import_clsx49.default)("absolute z-[70] pointer-events-none", positionClasses2[position]), children: [
|
|
9325
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "bg-slate-800 dark:bg-slate-700 text-white text-xs rounded-lg px-2.5 py-1.5 whitespace-nowrap shadow-lg", children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(ITText, { as: "span", children: content }) }),
|
|
9326
|
+
/* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: (0, import_clsx49.default)("absolute", arrowClasses[position]) })
|
|
9190
9327
|
] })
|
|
9191
9328
|
]
|
|
9192
9329
|
}
|
|
@@ -9194,16 +9331,16 @@ function ITTooltip({
|
|
|
9194
9331
|
}
|
|
9195
9332
|
|
|
9196
9333
|
// src/components/molecules/wysiwyg/wysiwyg.tsx
|
|
9197
|
-
var
|
|
9334
|
+
var import_jsx_runtime68 = require("react/jsx-runtime");
|
|
9198
9335
|
var INLINE_TAGS = /* @__PURE__ */ new Set(["STRONG", "B", "EM", "I", "U", "MARK"]);
|
|
9199
9336
|
var ACTION_META = {
|
|
9200
|
-
bold: { label: "Negrita", icon: /* @__PURE__ */ (0,
|
|
9201
|
-
italic: { label: "It\xE1lica", icon: /* @__PURE__ */ (0,
|
|
9202
|
-
underline: { label: "Subrayado", icon: /* @__PURE__ */ (0,
|
|
9203
|
-
highlight: { label: "Marcador", icon: /* @__PURE__ */ (0,
|
|
9204
|
-
ul: { label: "Lista con vi\xF1etas", icon: /* @__PURE__ */ (0,
|
|
9205
|
-
ol: { label: "Lista numerada", icon: /* @__PURE__ */ (0,
|
|
9206
|
-
clear: { label: "Limpiar formato", icon: /* @__PURE__ */ (0,
|
|
9337
|
+
bold: { label: "Negrita", icon: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_fa29.FaBold, {}) },
|
|
9338
|
+
italic: { label: "It\xE1lica", icon: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_fa29.FaItalic, {}) },
|
|
9339
|
+
underline: { label: "Subrayado", icon: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_fa29.FaUnderline, {}) },
|
|
9340
|
+
highlight: { label: "Marcador", icon: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_fa29.FaHighlighter, {}) },
|
|
9341
|
+
ul: { label: "Lista con vi\xF1etas", icon: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_fa29.FaListUl, {}) },
|
|
9342
|
+
ol: { label: "Lista numerada", icon: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_fa29.FaListOl, {}) },
|
|
9343
|
+
clear: { label: "Limpiar formato", icon: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_fa29.FaEraser, {}) }
|
|
9207
9344
|
};
|
|
9208
9345
|
function ITWysiwyg({
|
|
9209
9346
|
value,
|
|
@@ -9220,12 +9357,12 @@ function ITWysiwyg({
|
|
|
9220
9357
|
toolbar = toolbarActions,
|
|
9221
9358
|
className
|
|
9222
9359
|
}) {
|
|
9223
|
-
const editorRef = (0,
|
|
9224
|
-
const focusedRef = (0,
|
|
9225
|
-
const [active, setActive] = (0,
|
|
9360
|
+
const editorRef = (0, import_react42.useRef)(null);
|
|
9361
|
+
const focusedRef = (0, import_react42.useRef)(false);
|
|
9362
|
+
const [active, setActive] = (0, import_react42.useState)({});
|
|
9226
9363
|
const isLocked = disabled || readOnly;
|
|
9227
9364
|
const sizeConfig = inputSizeTokens[size] ?? inputSizeTokens.md;
|
|
9228
|
-
const findAncestor = (0,
|
|
9365
|
+
const findAncestor = (0, import_react42.useCallback)(
|
|
9229
9366
|
(node, predicate) => {
|
|
9230
9367
|
const editor = editorRef.current;
|
|
9231
9368
|
if (!editor) return null;
|
|
@@ -9238,7 +9375,7 @@ function ITWysiwyg({
|
|
|
9238
9375
|
},
|
|
9239
9376
|
[]
|
|
9240
9377
|
);
|
|
9241
|
-
const isInlineTag = (0,
|
|
9378
|
+
const isInlineTag = (0, import_react42.useCallback)((el, tag) => {
|
|
9242
9379
|
if (tag === "STRONG" || tag === "B") {
|
|
9243
9380
|
return el.tagName === "STRONG" || el.tagName === "B";
|
|
9244
9381
|
}
|
|
@@ -9247,7 +9384,7 @@ function ITWysiwyg({
|
|
|
9247
9384
|
}
|
|
9248
9385
|
return el.tagName === tag;
|
|
9249
9386
|
}, []);
|
|
9250
|
-
const getTextNodesInRange = (0,
|
|
9387
|
+
const getTextNodesInRange = (0, import_react42.useCallback)((range) => {
|
|
9251
9388
|
const editor = editorRef.current;
|
|
9252
9389
|
if (!editor) return [];
|
|
9253
9390
|
const out = [];
|
|
@@ -9258,7 +9395,7 @@ function ITWysiwyg({
|
|
|
9258
9395
|
}
|
|
9259
9396
|
return out;
|
|
9260
9397
|
}, []);
|
|
9261
|
-
const placeCaretAtEnd = (0,
|
|
9398
|
+
const placeCaretAtEnd = (0, import_react42.useCallback)((target) => {
|
|
9262
9399
|
const editor = editorRef.current;
|
|
9263
9400
|
const sel = window.getSelection();
|
|
9264
9401
|
if (!editor || !sel) return;
|
|
@@ -9269,11 +9406,11 @@ function ITWysiwyg({
|
|
|
9269
9406
|
sel.addRange(range);
|
|
9270
9407
|
if (document.activeElement !== editor) editor.focus();
|
|
9271
9408
|
}, []);
|
|
9272
|
-
const emitChange = (0,
|
|
9409
|
+
const emitChange = (0, import_react42.useCallback)(() => {
|
|
9273
9410
|
const editor = editorRef.current;
|
|
9274
9411
|
if (editor) onChange?.(editor.innerHTML);
|
|
9275
9412
|
}, [onChange]);
|
|
9276
|
-
const updateActive = (0,
|
|
9413
|
+
const updateActive = (0, import_react42.useCallback)(() => {
|
|
9277
9414
|
const editor = editorRef.current;
|
|
9278
9415
|
const sel = window.getSelection();
|
|
9279
9416
|
const node = sel?.anchorNode ?? null;
|
|
@@ -9292,13 +9429,13 @@ function ITWysiwyg({
|
|
|
9292
9429
|
(prev) => JSON.stringify(prev) === JSON.stringify(next) ? prev : next
|
|
9293
9430
|
);
|
|
9294
9431
|
}, [findAncestor, isInlineTag]);
|
|
9295
|
-
const unwrapElement = (0,
|
|
9432
|
+
const unwrapElement = (0, import_react42.useCallback)((el) => {
|
|
9296
9433
|
const parent = el.parentNode;
|
|
9297
9434
|
if (!parent) return;
|
|
9298
9435
|
while (el.firstChild) parent.insertBefore(el.firstChild, el);
|
|
9299
9436
|
el.remove();
|
|
9300
9437
|
}, []);
|
|
9301
|
-
const applyInline = (0,
|
|
9438
|
+
const applyInline = (0, import_react42.useCallback)(
|
|
9302
9439
|
(tag, prepare) => {
|
|
9303
9440
|
const editor = editorRef.current;
|
|
9304
9441
|
const sel = window.getSelection();
|
|
@@ -9380,7 +9517,7 @@ function ITWysiwyg({
|
|
|
9380
9517
|
updateActive
|
|
9381
9518
|
]
|
|
9382
9519
|
);
|
|
9383
|
-
const normalizeBlocks = (0,
|
|
9520
|
+
const normalizeBlocks = (0, import_react42.useCallback)(() => {
|
|
9384
9521
|
const editor = editorRef.current;
|
|
9385
9522
|
if (!editor) return;
|
|
9386
9523
|
const children = Array.from(editor.childNodes);
|
|
@@ -9402,7 +9539,7 @@ function ITWysiwyg({
|
|
|
9402
9539
|
}
|
|
9403
9540
|
flush();
|
|
9404
9541
|
}, []);
|
|
9405
|
-
const convertLiToDiv = (0,
|
|
9542
|
+
const convertLiToDiv = (0, import_react42.useCallback)((li) => {
|
|
9406
9543
|
const list = li.parentElement;
|
|
9407
9544
|
if (!list || !list.parentNode) return;
|
|
9408
9545
|
const div = document.createElement("div");
|
|
@@ -9410,20 +9547,20 @@ function ITWysiwyg({
|
|
|
9410
9547
|
list.parentNode.insertBefore(div, list);
|
|
9411
9548
|
li.remove();
|
|
9412
9549
|
}, []);
|
|
9413
|
-
const cleanupEmptyLists = (0,
|
|
9550
|
+
const cleanupEmptyLists = (0, import_react42.useCallback)(() => {
|
|
9414
9551
|
const editor = editorRef.current;
|
|
9415
9552
|
if (!editor) return;
|
|
9416
9553
|
editor.querySelectorAll("ul, ol").forEach((list) => {
|
|
9417
9554
|
if (!list.querySelector("li")) list.remove();
|
|
9418
9555
|
});
|
|
9419
9556
|
}, []);
|
|
9420
|
-
const retagList = (0,
|
|
9557
|
+
const retagList = (0, import_react42.useCallback)((list, type) => {
|
|
9421
9558
|
if (!list.parentNode) return;
|
|
9422
9559
|
const nl = document.createElement(type);
|
|
9423
9560
|
while (list.firstChild) nl.appendChild(list.firstChild);
|
|
9424
9561
|
list.parentNode.replaceChild(nl, list);
|
|
9425
9562
|
}, []);
|
|
9426
|
-
const toggleList = (0,
|
|
9563
|
+
const toggleList = (0, import_react42.useCallback)(
|
|
9427
9564
|
(type) => {
|
|
9428
9565
|
const editor = editorRef.current;
|
|
9429
9566
|
const sel = window.getSelection();
|
|
@@ -9521,7 +9658,7 @@ function ITWysiwyg({
|
|
|
9521
9658
|
updateActive
|
|
9522
9659
|
]
|
|
9523
9660
|
);
|
|
9524
|
-
const clearFormatting = (0,
|
|
9661
|
+
const clearFormatting = (0, import_react42.useCallback)(() => {
|
|
9525
9662
|
const editor = editorRef.current;
|
|
9526
9663
|
const sel = window.getSelection();
|
|
9527
9664
|
if (!editor || !sel || sel.rangeCount === 0) return;
|
|
@@ -9555,7 +9692,7 @@ function ITWysiwyg({
|
|
|
9555
9692
|
emitChange,
|
|
9556
9693
|
updateActive
|
|
9557
9694
|
]);
|
|
9558
|
-
(0,
|
|
9695
|
+
(0, import_react42.useEffect)(() => {
|
|
9559
9696
|
const editor = editorRef.current;
|
|
9560
9697
|
if (!editor) return;
|
|
9561
9698
|
if (!focusedRef.current) {
|
|
@@ -9563,7 +9700,7 @@ function ITWysiwyg({
|
|
|
9563
9700
|
if (editor.innerHTML !== next) editor.innerHTML = next;
|
|
9564
9701
|
}
|
|
9565
9702
|
}, [value]);
|
|
9566
|
-
(0,
|
|
9703
|
+
(0, import_react42.useEffect)(() => {
|
|
9567
9704
|
const onSelectionChange = () => {
|
|
9568
9705
|
const editor = editorRef.current;
|
|
9569
9706
|
const sel = window.getSelection();
|
|
@@ -9619,7 +9756,7 @@ function ITWysiwyg({
|
|
|
9619
9756
|
}) => {
|
|
9620
9757
|
const meta = ACTION_META[action];
|
|
9621
9758
|
const isActive = !!active[action];
|
|
9622
|
-
return /* @__PURE__ */ (0,
|
|
9759
|
+
return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ITTooltip, { content: meta.label, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
9623
9760
|
"button",
|
|
9624
9761
|
{
|
|
9625
9762
|
type: "button",
|
|
@@ -9639,9 +9776,9 @@ function ITWysiwyg({
|
|
|
9639
9776
|
}
|
|
9640
9777
|
) });
|
|
9641
9778
|
};
|
|
9642
|
-
return /* @__PURE__ */ (0,
|
|
9643
|
-
label && /* @__PURE__ */ (0,
|
|
9644
|
-
/* @__PURE__ */ (0,
|
|
9779
|
+
return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: inputWrapper(className), children: [
|
|
9780
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ITText, { as: "label", className: inputLabel(!!error), htmlFor: name, children: label }),
|
|
9781
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
|
|
9645
9782
|
"div",
|
|
9646
9783
|
{
|
|
9647
9784
|
className: (0, import_clsx50.default)(
|
|
@@ -9650,20 +9787,20 @@ function ITWysiwyg({
|
|
|
9650
9787
|
isLocked && "opacity-50 cursor-not-allowed bg-secondary-100 dark:bg-slate-800"
|
|
9651
9788
|
),
|
|
9652
9789
|
children: [
|
|
9653
|
-
/* @__PURE__ */ (0,
|
|
9790
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
9654
9791
|
"div",
|
|
9655
9792
|
{
|
|
9656
9793
|
className: (0, import_clsx50.default)(
|
|
9657
9794
|
"flex flex-wrap items-center gap-0.5 px-1.5 py-1 border-b border-secondary-200 bg-secondary-50 dark:bg-slate-800",
|
|
9658
9795
|
isLocked && "bg-secondary-100 dark:bg-slate-900"
|
|
9659
9796
|
),
|
|
9660
|
-
children: toolbar.map((action, i) => /* @__PURE__ */ (0,
|
|
9661
|
-
i > 0 && (action === "ul" || action === "ol" || action === "clear") && /* @__PURE__ */ (0,
|
|
9662
|
-
/* @__PURE__ */ (0,
|
|
9797
|
+
children: toolbar.map((action, i) => /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("span", { className: "flex items-center", children: [
|
|
9798
|
+
i > 0 && (action === "ul" || action === "ol" || action === "clear") && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "mx-1 h-4 w-px bg-secondary-200 dark:bg-slate-600" }),
|
|
9799
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ToolbarButton, { action })
|
|
9663
9800
|
] }, action))
|
|
9664
9801
|
}
|
|
9665
9802
|
),
|
|
9666
|
-
/* @__PURE__ */ (0,
|
|
9803
|
+
/* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
|
|
9667
9804
|
"div",
|
|
9668
9805
|
{
|
|
9669
9806
|
id: name,
|
|
@@ -9697,12 +9834,12 @@ function ITWysiwyg({
|
|
|
9697
9834
|
]
|
|
9698
9835
|
}
|
|
9699
9836
|
),
|
|
9700
|
-
error && /* @__PURE__ */ (0,
|
|
9837
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ITText, { as: "span", className: inputError, children: error })
|
|
9701
9838
|
] });
|
|
9702
9839
|
}
|
|
9703
9840
|
|
|
9704
9841
|
// src/components/organisms/dropfile/dropfile.tsx
|
|
9705
|
-
var
|
|
9842
|
+
var import_react43 = require("react");
|
|
9706
9843
|
var import_react_dropzone = require("react-dropzone");
|
|
9707
9844
|
var import_clsx51 = __toESM(require("clsx"), 1);
|
|
9708
9845
|
|
|
@@ -9732,7 +9869,7 @@ var UploadStatus = /* @__PURE__ */ ((UploadStatus2) => {
|
|
|
9732
9869
|
})(UploadStatus || {});
|
|
9733
9870
|
|
|
9734
9871
|
// src/components/organisms/dropfile/dropfile.tsx
|
|
9735
|
-
var
|
|
9872
|
+
var import_jsx_runtime69 = require("react/jsx-runtime");
|
|
9736
9873
|
var ITDropfile = ({
|
|
9737
9874
|
onFileSelect,
|
|
9738
9875
|
onCancel,
|
|
@@ -9748,15 +9885,15 @@ var ITDropfile = ({
|
|
|
9748
9885
|
buttonLabel = "Subir archivo",
|
|
9749
9886
|
modalTitle
|
|
9750
9887
|
}) => {
|
|
9751
|
-
const [isModalOpen, setIsModalOpen] = (0,
|
|
9752
|
-
const [selectedFile, setSelectedFile] = (0,
|
|
9753
|
-
const [fileType, setFileType] = (0,
|
|
9754
|
-
const [imagePreview, setImagePreview] = (0,
|
|
9755
|
-
const [isConfirmed, setIsConfirmed] = (0,
|
|
9756
|
-
const [internalUploadStatus, setInternalUploadStatus] = (0,
|
|
9888
|
+
const [isModalOpen, setIsModalOpen] = (0, import_react43.useState)(false);
|
|
9889
|
+
const [selectedFile, setSelectedFile] = (0, import_react43.useState)(null);
|
|
9890
|
+
const [fileType, setFileType] = (0, import_react43.useState)(null);
|
|
9891
|
+
const [imagePreview, setImagePreview] = (0, import_react43.useState)(initialPreviewUrl || null);
|
|
9892
|
+
const [isConfirmed, setIsConfirmed] = (0, import_react43.useState)(false);
|
|
9893
|
+
const [internalUploadStatus, setInternalUploadStatus] = (0, import_react43.useState)(
|
|
9757
9894
|
initialPreviewUrl ? "subido" /* UPLOADED */ : "pendiente" /* PENDING */
|
|
9758
9895
|
);
|
|
9759
|
-
(0,
|
|
9896
|
+
(0, import_react43.useEffect)(() => {
|
|
9760
9897
|
if (initialPreviewUrl && !selectedFile) {
|
|
9761
9898
|
setImagePreview(initialPreviewUrl);
|
|
9762
9899
|
if (externalStatus === void 0) setInternalUploadStatus("subido" /* UPLOADED */);
|
|
@@ -9871,9 +10008,9 @@ var ITDropfile = ({
|
|
|
9871
10008
|
}
|
|
9872
10009
|
};
|
|
9873
10010
|
const { label, color, dotColor } = config2[status];
|
|
9874
|
-
return /* @__PURE__ */ (0,
|
|
9875
|
-
/* @__PURE__ */ (0,
|
|
9876
|
-
/* @__PURE__ */ (0,
|
|
10011
|
+
return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: `inline-flex items-center gap-2 px-2.5 py-1 rounded-full border ${color}`, children: [
|
|
10012
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: `w-2 h-2 rounded-full ${dotColor}` }),
|
|
10013
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITText, { as: "span", className: "text-xs font-medium flex items-center gap-1.5", children: label })
|
|
9877
10014
|
] });
|
|
9878
10015
|
};
|
|
9879
10016
|
const onDrop = (acceptedFiles) => {
|
|
@@ -9905,12 +10042,12 @@ var ITDropfile = ({
|
|
|
9905
10042
|
accept: getAcceptedFileTypes(),
|
|
9906
10043
|
maxFiles: 1
|
|
9907
10044
|
});
|
|
9908
|
-
(0,
|
|
10045
|
+
(0, import_react43.useEffect)(() => {
|
|
9909
10046
|
const renderPDF = async () => {
|
|
9910
10047
|
};
|
|
9911
10048
|
renderPDF();
|
|
9912
10049
|
}, [selectedFile, fileType]);
|
|
9913
|
-
(0,
|
|
10050
|
+
(0, import_react43.useEffect)(() => {
|
|
9914
10051
|
return () => {
|
|
9915
10052
|
if (imagePreview) {
|
|
9916
10053
|
URL.revokeObjectURL(imagePreview);
|
|
@@ -9947,7 +10084,7 @@ var ITDropfile = ({
|
|
|
9947
10084
|
const handleDelete = () => {
|
|
9948
10085
|
handleCancel();
|
|
9949
10086
|
};
|
|
9950
|
-
(0,
|
|
10087
|
+
(0, import_react43.useEffect)(() => {
|
|
9951
10088
|
if (view === "button" && isConfirmed && uploadStatus === "subido" /* UPLOADED */) {
|
|
9952
10089
|
const timeout = setTimeout(() => {
|
|
9953
10090
|
setIsModalOpen(false);
|
|
@@ -9964,18 +10101,18 @@ var ITDropfile = ({
|
|
|
9964
10101
|
return () => clearTimeout(timeout);
|
|
9965
10102
|
}
|
|
9966
10103
|
}, [view, isConfirmed, uploadStatus, externalStatus, onStatusChange]);
|
|
9967
|
-
const headerRow = /* @__PURE__ */ (0,
|
|
9968
|
-
/* @__PURE__ */ (0,
|
|
9969
|
-
/* @__PURE__ */ (0,
|
|
9970
|
-
/* @__PURE__ */ (0,
|
|
10104
|
+
const headerRow = /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex items-center justify-between mb-2", children: [
|
|
10105
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("label", { className: "block text-sm font-semibold text-secondary-700", children: [
|
|
10106
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITText, { as: "span", children: "Subir archivo " }),
|
|
10107
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(ITText, { as: "span", className: "text-secondary-400 font-normal text-xs", children: [
|
|
9971
10108
|
"(",
|
|
9972
10109
|
getFileExtensions(),
|
|
9973
10110
|
")"
|
|
9974
10111
|
] })
|
|
9975
10112
|
] }),
|
|
9976
|
-
showStatusBadge && selectedFile && /* @__PURE__ */ (0,
|
|
10113
|
+
showStatusBadge && selectedFile && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(StatusBadge, { status: uploadStatus })
|
|
9977
10114
|
] });
|
|
9978
|
-
const dropZoneOrPreview = /* @__PURE__ */ (0,
|
|
10115
|
+
const dropZoneOrPreview = /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_jsx_runtime69.Fragment, { children: !selectedFile && !imagePreview ? /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
|
|
9979
10116
|
"div",
|
|
9980
10117
|
{
|
|
9981
10118
|
...getRootProps(),
|
|
@@ -9985,41 +10122,41 @@ var ITDropfile = ({
|
|
|
9985
10122
|
${isDragActive ? "border-primary-500 bg-primary-50 scale-[1.01]" : "border-secondary-300 bg-white hover:border-primary-400 hover:bg-secondary-50"}
|
|
9986
10123
|
`,
|
|
9987
10124
|
children: [
|
|
9988
|
-
/* @__PURE__ */ (0,
|
|
9989
|
-
/* @__PURE__ */ (0,
|
|
10125
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("input", { ...getInputProps() }),
|
|
10126
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: `mb-3 p-3 rounded-full transition-colors duration-300 ${isDragActive ? "bg-primary-100" : "bg-secondary-100 group-hover:bg-primary-50"}`, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
9990
10127
|
"svg",
|
|
9991
10128
|
{
|
|
9992
10129
|
className: `w-6 h-6 transition-colors duration-300 ${isDragActive ? "text-primary-600" : "text-secondary-400 group-hover:text-primary-500"}`,
|
|
9993
10130
|
fill: "none",
|
|
9994
10131
|
viewBox: "0 0 24 24",
|
|
9995
10132
|
stroke: "currentColor",
|
|
9996
|
-
children: /* @__PURE__ */ (0,
|
|
10133
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" })
|
|
9997
10134
|
}
|
|
9998
10135
|
) }),
|
|
9999
|
-
/* @__PURE__ */ (0,
|
|
10136
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "text-center space-y-1", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITText, { as: "p", className: `text-sm font-medium transition-colors duration-300 ${isDragActive ? "text-primary-700" : "text-secondary-700"}`, children: isDragActive ? "\xA1Suelta aqu\xED!" : "Haz clic o arrastra" }) })
|
|
10000
10137
|
]
|
|
10001
10138
|
}
|
|
10002
|
-
) : /* @__PURE__ */ (0,
|
|
10003
|
-
/* @__PURE__ */ (0,
|
|
10004
|
-
/* @__PURE__ */ (0,
|
|
10005
|
-
/* @__PURE__ */ (0,
|
|
10006
|
-
/* @__PURE__ */ (0,
|
|
10007
|
-
/* @__PURE__ */ (0,
|
|
10139
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "w-full bg-white border border-secondary-200 rounded-xl shadow-sm overflow-hidden animate-fade-in", children: [
|
|
10140
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "flex items-center justify-between p-3 bg-secondary-50 border-b border-secondary-100", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex items-center gap-3 overflow-hidden", children: [
|
|
10141
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "flex-shrink-0 w-8 h-8 rounded-lg bg-primary-100 flex items-center justify-center text-primary-600", children: selectedFile && fileType?.startsWith("image/") || !selectedFile && imagePreview ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" }) }) : /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" }) }) }),
|
|
10142
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "min-w-0", children: [
|
|
10143
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITText, { as: "p", className: "text-xs font-medium text-secondary-900 truncate", title: selectedFile?.name || "Imagen cargada", children: selectedFile?.name || "Imagen cargada" }),
|
|
10144
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITText, { as: "p", className: "text-[10px] text-secondary-500", children: selectedFile ? (selectedFile.size / 1024 / 1024).toFixed(2) + " MB" : "" })
|
|
10008
10145
|
] })
|
|
10009
10146
|
] }) }),
|
|
10010
|
-
/* @__PURE__ */ (0,
|
|
10147
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: (0, import_clsx51.default)("relative bg-secondary-100 flex items-center justify-center", !contentClassName ? "max-h-[200px] min-h-[100px] overflow-auto" : contentClassName), children: selectedFile && fileType?.startsWith("image/") || !selectedFile && imagePreview ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
10011
10148
|
"img",
|
|
10012
10149
|
{
|
|
10013
10150
|
src: imagePreview,
|
|
10014
10151
|
alt: "Vista previa",
|
|
10015
10152
|
className: "w-full h-full object-contain max-h-[200px]"
|
|
10016
10153
|
}
|
|
10017
|
-
) : /* @__PURE__ */ (0,
|
|
10018
|
-
/* @__PURE__ */ (0,
|
|
10019
|
-
/* @__PURE__ */ (0,
|
|
10154
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "py-8 flex flex-col items-center text-secondary-400", children: [
|
|
10155
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("svg", { className: "w-10 h-10 mb-2 opacity-50", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z" }) }),
|
|
10156
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITText, { as: "span", className: "text-xs", children: "Sin vista previa" })
|
|
10020
10157
|
] }) }),
|
|
10021
|
-
/* @__PURE__ */ (0,
|
|
10022
|
-
/* @__PURE__ */ (0,
|
|
10158
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "px-3 py-2 bg-white border-t border-secondary-100 flex justify-end gap-2", children: !isConfirmed ? /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_jsx_runtime69.Fragment, { children: [
|
|
10159
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
10023
10160
|
ITButton,
|
|
10024
10161
|
{
|
|
10025
10162
|
type: "button",
|
|
@@ -10027,10 +10164,10 @@ var ITDropfile = ({
|
|
|
10027
10164
|
color: "secondary",
|
|
10028
10165
|
size: "sm",
|
|
10029
10166
|
onClick: handleCancel,
|
|
10030
|
-
children: /* @__PURE__ */ (0,
|
|
10167
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITText, { children: "Cancelar" })
|
|
10031
10168
|
}
|
|
10032
10169
|
),
|
|
10033
|
-
/* @__PURE__ */ (0,
|
|
10170
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
10034
10171
|
ITButton,
|
|
10035
10172
|
{
|
|
10036
10173
|
type: "button",
|
|
@@ -10038,13 +10175,13 @@ var ITDropfile = ({
|
|
|
10038
10175
|
color: "primary",
|
|
10039
10176
|
size: "sm",
|
|
10040
10177
|
onClick: handleConfirm,
|
|
10041
|
-
children: /* @__PURE__ */ (0,
|
|
10042
|
-
/* @__PURE__ */ (0,
|
|
10043
|
-
/* @__PURE__ */ (0,
|
|
10178
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
10179
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITText, { children: "Confirmar" }),
|
|
10180
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("svg", { className: "w-3 h-3", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) })
|
|
10044
10181
|
] })
|
|
10045
10182
|
}
|
|
10046
10183
|
)
|
|
10047
|
-
] }) : /* @__PURE__ */ (0,
|
|
10184
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
|
|
10048
10185
|
ITButton,
|
|
10049
10186
|
{
|
|
10050
10187
|
type: "button",
|
|
@@ -10053,12 +10190,12 @@ var ITDropfile = ({
|
|
|
10053
10190
|
size: "sm",
|
|
10054
10191
|
onClick: handleDelete,
|
|
10055
10192
|
children: [
|
|
10056
|
-
/* @__PURE__ */ (0,
|
|
10057
|
-
/* @__PURE__ */ (0,
|
|
10193
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("svg", { className: "w-3 h-3", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" }) }),
|
|
10194
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITText, { children: "Eliminar" })
|
|
10058
10195
|
]
|
|
10059
10196
|
}
|
|
10060
10197
|
) }),
|
|
10061
|
-
uploadStatus === "subiendo" /* UPLOADING */ && /* @__PURE__ */ (0,
|
|
10198
|
+
uploadStatus === "subiendo" /* UPLOADING */ && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "px-4 pb-2", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "w-full bg-secondary-200 rounded-full h-1.5", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
10062
10199
|
"div",
|
|
10063
10200
|
{
|
|
10064
10201
|
className: "bg-primary-600 h-1.5 rounded-full transition-all duration-1000 ease-out",
|
|
@@ -10071,8 +10208,8 @@ var ITDropfile = ({
|
|
|
10071
10208
|
] }) });
|
|
10072
10209
|
if (view === "button") {
|
|
10073
10210
|
const hasFile = Boolean(selectedFile || imagePreview);
|
|
10074
|
-
return /* @__PURE__ */ (0,
|
|
10075
|
-
/* @__PURE__ */ (0,
|
|
10211
|
+
return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: (0, import_clsx51.default)("inline-block", containerClassName), children: [
|
|
10212
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
10076
10213
|
ITButton,
|
|
10077
10214
|
{
|
|
10078
10215
|
type: "button",
|
|
@@ -10080,20 +10217,20 @@ var ITDropfile = ({
|
|
|
10080
10217
|
color: hasFile ? "primary" : "secondary",
|
|
10081
10218
|
size: "sm",
|
|
10082
10219
|
onClick: () => setIsModalOpen(true),
|
|
10083
|
-
children: /* @__PURE__ */ (0,
|
|
10084
|
-
/* @__PURE__ */ (0,
|
|
10085
|
-
/* @__PURE__ */ (0,
|
|
10086
|
-
showStatusBadge && hasFile && /* @__PURE__ */ (0,
|
|
10220
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "flex items-center gap-2 max-w-[220px]", children: [
|
|
10221
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)("svg", { className: "w-4 h-4 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" }) }),
|
|
10222
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITText, { className: "truncate", children: selectedFile?.name || (hasFile ? "Archivo cargado" : buttonLabel) }),
|
|
10223
|
+
showStatusBadge && hasFile && /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(StatusBadge, { status: uploadStatus })
|
|
10087
10224
|
] })
|
|
10088
10225
|
}
|
|
10089
10226
|
),
|
|
10090
|
-
/* @__PURE__ */ (0,
|
|
10227
|
+
/* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ITDialog, { isOpen: isModalOpen, onClose: () => setIsModalOpen(false), title: modalTitle ?? buttonLabel, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "w-full transition-all duration-300", children: [
|
|
10091
10228
|
headerRow,
|
|
10092
10229
|
dropZoneOrPreview
|
|
10093
10230
|
] }) })
|
|
10094
10231
|
] });
|
|
10095
10232
|
}
|
|
10096
|
-
return /* @__PURE__ */ (0,
|
|
10233
|
+
return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: (0, import_clsx51.default)("w-full transition-all duration-300", containerClassName), children: [
|
|
10097
10234
|
headerRow,
|
|
10098
10235
|
dropZoneOrPreview
|
|
10099
10236
|
] });
|
|
@@ -10101,13 +10238,13 @@ var ITDropfile = ({
|
|
|
10101
10238
|
var dropfile_default = ITDropfile;
|
|
10102
10239
|
|
|
10103
10240
|
// src/components/templates/layout/layout.tsx
|
|
10104
|
-
var
|
|
10241
|
+
var import_react45 = require("react");
|
|
10105
10242
|
var import_clsx52 = __toESM(require("clsx"), 1);
|
|
10106
10243
|
|
|
10107
10244
|
// src/components/organisms/topbar/topbar.tsx
|
|
10108
10245
|
var import_fa30 = require("react-icons/fa");
|
|
10109
|
-
var
|
|
10110
|
-
var
|
|
10246
|
+
var import_react44 = require("react");
|
|
10247
|
+
var import_jsx_runtime70 = require("react/jsx-runtime");
|
|
10111
10248
|
function ITTopBar({
|
|
10112
10249
|
logo,
|
|
10113
10250
|
logoText,
|
|
@@ -10123,10 +10260,10 @@ function ITTopBar({
|
|
|
10123
10260
|
}) {
|
|
10124
10261
|
const flat = useITFlatAppearance();
|
|
10125
10262
|
const initials = (userMenu?.userName ?? "").trim().split(/\s+/).slice(0, 2).map((word) => word.charAt(0).toUpperCase()).join("");
|
|
10126
|
-
const [isUserMenuOpen, setIsUserMenuOpen] = (0,
|
|
10127
|
-
const userMenuRef = (0,
|
|
10263
|
+
const [isUserMenuOpen, setIsUserMenuOpen] = (0, import_react44.useState)(false);
|
|
10264
|
+
const userMenuRef = (0, import_react44.useRef)(null);
|
|
10128
10265
|
useClickOutside_default(userMenuRef, () => setIsUserMenuOpen(false));
|
|
10129
|
-
return /* @__PURE__ */ (0,
|
|
10266
|
+
return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
10130
10267
|
"header",
|
|
10131
10268
|
{
|
|
10132
10269
|
className: `sticky top-0 z-40 transition-all duration-300 ${flat ? "" : "backdrop-blur-md"}`,
|
|
@@ -10135,9 +10272,9 @@ function ITTopBar({
|
|
|
10135
10272
|
borderBottom: "1px solid var(--it-topbar-border, rgba(15, 23, 42, 0.06))",
|
|
10136
10273
|
boxShadow: flat ? "none" : "var(--shadow-xs)"
|
|
10137
10274
|
},
|
|
10138
|
-
children: /* @__PURE__ */ (0,
|
|
10139
|
-
/* @__PURE__ */ (0,
|
|
10140
|
-
showMobileMenuButton && /* @__PURE__ */ (0,
|
|
10275
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: `flex items-center justify-between px-6 lg:px-8 ${flat ? "h-[64px]" : "h-[72px]"}`, children: [
|
|
10276
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "flex items-center gap-5", children: [
|
|
10277
|
+
showMobileMenuButton && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
10141
10278
|
"button",
|
|
10142
10279
|
{
|
|
10143
10280
|
type: "button",
|
|
@@ -10149,12 +10286,12 @@ function ITTopBar({
|
|
|
10149
10286
|
onMouseEnter: (e) => e.currentTarget.style.backgroundColor = "var(--it-topbar-user-hover, #f1f5f9)",
|
|
10150
10287
|
onMouseLeave: (e) => e.currentTarget.style.backgroundColor = "transparent",
|
|
10151
10288
|
onClick: onToggleMobileMenu,
|
|
10152
|
-
children: /* @__PURE__ */ (0,
|
|
10289
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_fa30.FaBars, { className: "w-[1.125rem] h-[1.125rem]" })
|
|
10153
10290
|
}
|
|
10154
10291
|
),
|
|
10155
|
-
/* @__PURE__ */ (0,
|
|
10156
|
-
logo && /* @__PURE__ */ (0,
|
|
10157
|
-
logoText && /* @__PURE__ */ (0,
|
|
10292
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: `items-center gap-3 ${hideBrandOnDesktop ? "flex lg:hidden" : "flex"}`, children: [
|
|
10293
|
+
logo && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "flex-shrink-0 drop-shadow-sm", children: logo }),
|
|
10294
|
+
logoText && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
10158
10295
|
ITText,
|
|
10159
10296
|
{
|
|
10160
10297
|
as: "span",
|
|
@@ -10164,7 +10301,7 @@ function ITTopBar({
|
|
|
10164
10301
|
}
|
|
10165
10302
|
)
|
|
10166
10303
|
] }),
|
|
10167
|
-
navItems && navItems.length > 0 && /* @__PURE__ */ (0,
|
|
10304
|
+
navItems && navItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("nav", { className: "hidden md:flex ml-8 space-x-1 border-l pl-8", style: { borderColor: "var(--it-topbar-border, rgba(15, 23, 42, 0.06))" }, children: navItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
10168
10305
|
"button",
|
|
10169
10306
|
{
|
|
10170
10307
|
onClick: () => onNavItemClick?.(item.id),
|
|
@@ -10178,19 +10315,19 @@ function ITTopBar({
|
|
|
10178
10315
|
e.currentTarget.style.color = "var(--it-topbar-text, #475569)";
|
|
10179
10316
|
e.currentTarget.style.backgroundColor = "transparent";
|
|
10180
10317
|
},
|
|
10181
|
-
children: /* @__PURE__ */ (0,
|
|
10182
|
-
item.icon && /* @__PURE__ */ (0,
|
|
10183
|
-
/* @__PURE__ */ (0,
|
|
10318
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
10319
|
+
item.icon && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { className: "opacity-70", children: item.icon }),
|
|
10320
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ITText, { as: "span", children: item.label })
|
|
10184
10321
|
] })
|
|
10185
10322
|
},
|
|
10186
10323
|
item.id
|
|
10187
10324
|
)) })
|
|
10188
10325
|
] }),
|
|
10189
|
-
centerContent && /* @__PURE__ */ (0,
|
|
10190
|
-
(children || userMenu) && /* @__PURE__ */ (0,
|
|
10326
|
+
centerContent && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: `hidden lg:flex flex-1 min-w-0 items-center ${hideBrandOnDesktop ? "justify-start pr-4" : "justify-center px-4"}`, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "w-full max-w-[420px]", children: centerContent }) }),
|
|
10327
|
+
(children || userMenu) && /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
10191
10328
|
children,
|
|
10192
|
-
userMenu && /* @__PURE__ */ (0,
|
|
10193
|
-
/* @__PURE__ */ (0,
|
|
10329
|
+
userMenu && /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "relative", children: [
|
|
10330
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
|
|
10194
10331
|
"button",
|
|
10195
10332
|
{
|
|
10196
10333
|
type: "button",
|
|
@@ -10206,15 +10343,15 @@ function ITTopBar({
|
|
|
10206
10343
|
},
|
|
10207
10344
|
onClick: () => setIsUserMenuOpen(!isUserMenuOpen),
|
|
10208
10345
|
children: [
|
|
10209
|
-
/* @__PURE__ */ (0,
|
|
10210
|
-
userMenu.userImage ? /* @__PURE__ */ (0,
|
|
10346
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "relative", children: [
|
|
10347
|
+
userMenu.userImage ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
10211
10348
|
"img",
|
|
10212
10349
|
{
|
|
10213
10350
|
className: "w-9 h-9 rounded-full object-cover ring-2 ring-white shadow-sm",
|
|
10214
10351
|
src: userMenu.userImage,
|
|
10215
10352
|
alt: "Current user"
|
|
10216
10353
|
}
|
|
10217
|
-
) : flat && initials ? /* @__PURE__ */ (0,
|
|
10354
|
+
) : flat && initials ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
10218
10355
|
"div",
|
|
10219
10356
|
{
|
|
10220
10357
|
"aria-hidden": "true",
|
|
@@ -10225,11 +10362,11 @@ function ITTopBar({
|
|
|
10225
10362
|
},
|
|
10226
10363
|
children: initials
|
|
10227
10364
|
}
|
|
10228
|
-
) : /* @__PURE__ */ (0,
|
|
10229
|
-
!flat && /* @__PURE__ */ (0,
|
|
10365
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "w-9 h-9 rounded-full bg-slate-100 flex items-center justify-center ring-2 ring-white shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(import_fa30.FaUserCircle, { className: "w-6 h-6", style: { color: "var(--it-topbar-icon, #94a3b8)" } }) }),
|
|
10366
|
+
!flat && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "absolute bottom-0 right-0 w-2.5 h-2.5 bg-green-500 border-2 border-white rounded-full" })
|
|
10230
10367
|
] }),
|
|
10231
|
-
/* @__PURE__ */ (0,
|
|
10232
|
-
/* @__PURE__ */ (0,
|
|
10368
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: `hidden sm:flex flex-col py-0.5 ${flat ? "text-right" : "text-left"}`, children: [
|
|
10369
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
10233
10370
|
ITText,
|
|
10234
10371
|
{
|
|
10235
10372
|
as: "span",
|
|
@@ -10238,7 +10375,7 @@ function ITTopBar({
|
|
|
10238
10375
|
children: userMenu.userName
|
|
10239
10376
|
}
|
|
10240
10377
|
),
|
|
10241
|
-
/* @__PURE__ */ (0,
|
|
10378
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
10242
10379
|
ITText,
|
|
10243
10380
|
{
|
|
10244
10381
|
as: "span",
|
|
@@ -10251,7 +10388,7 @@ function ITTopBar({
|
|
|
10251
10388
|
]
|
|
10252
10389
|
}
|
|
10253
10390
|
),
|
|
10254
|
-
/* @__PURE__ */ (0,
|
|
10391
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
|
|
10255
10392
|
"div",
|
|
10256
10393
|
{
|
|
10257
10394
|
ref: userMenuRef,
|
|
@@ -10264,15 +10401,15 @@ function ITTopBar({
|
|
|
10264
10401
|
border: "1px solid var(--it-topbar-user-dropdown-border, #f1f5f9)"
|
|
10265
10402
|
},
|
|
10266
10403
|
children: [
|
|
10267
|
-
/* @__PURE__ */ (0,
|
|
10268
|
-
/* @__PURE__ */ (0,
|
|
10269
|
-
/* @__PURE__ */ (0,
|
|
10404
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "px-5 py-4 border-b", style: { borderColor: "var(--it-topbar-user-dropdown-border, #f1f5f9)", backgroundColor: "var(--it-topbar-user-bg, #f8fafc)" }, children: [
|
|
10405
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ITText, { as: "span", className: "block font-bold text-[0.9rem]", style: { color: "var(--it-topbar-user-text, #0f172a)" }, children: userMenu.userName }),
|
|
10406
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ITText, { as: "span", className: "block text-xs font-medium truncate mt-0.5", style: { color: "var(--it-topbar-user-subtitle, #64748b)" }, children: userMenu.userEmail })
|
|
10270
10407
|
] }),
|
|
10271
|
-
/* @__PURE__ */ (0,
|
|
10408
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)("ul", { className: "py-2", children: userMenu.menuItems.map((m, i) => {
|
|
10272
10409
|
const isDestructive = m.label.toLowerCase().includes("salir") || m.label.toLowerCase().includes("cerrar") || m.label.toLowerCase().includes("logout");
|
|
10273
|
-
return /* @__PURE__ */ (0,
|
|
10274
|
-
i === userMenu.menuItems.length - 1 && isDestructive && i > 0 && /* @__PURE__ */ (0,
|
|
10275
|
-
/* @__PURE__ */ (0,
|
|
10410
|
+
return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("li", { className: "px-2", children: [
|
|
10411
|
+
i === userMenu.menuItems.length - 1 && isDestructive && i > 0 && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("div", { className: "h-px bg-slate-100 my-1 mx-2" }),
|
|
10412
|
+
/* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
|
|
10276
10413
|
"button",
|
|
10277
10414
|
{
|
|
10278
10415
|
onClick: () => {
|
|
@@ -10287,7 +10424,7 @@ function ITTopBar({
|
|
|
10287
10424
|
onMouseLeave: (e) => {
|
|
10288
10425
|
e.currentTarget.style.backgroundColor = "transparent";
|
|
10289
10426
|
},
|
|
10290
|
-
children: /* @__PURE__ */ (0,
|
|
10427
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ITText, { as: "span", children: m.label })
|
|
10291
10428
|
}
|
|
10292
10429
|
)
|
|
10293
10430
|
] }, i);
|
|
@@ -10303,7 +10440,7 @@ function ITTopBar({
|
|
|
10303
10440
|
}
|
|
10304
10441
|
|
|
10305
10442
|
// src/components/templates/layout/layout.tsx
|
|
10306
|
-
var
|
|
10443
|
+
var import_jsx_runtime71 = require("react/jsx-runtime");
|
|
10307
10444
|
function ITLayout({
|
|
10308
10445
|
topBar,
|
|
10309
10446
|
sidebar,
|
|
@@ -10312,8 +10449,8 @@ function ITLayout({
|
|
|
10312
10449
|
contentClassName = "",
|
|
10313
10450
|
sidebarFullHeight = false
|
|
10314
10451
|
}) {
|
|
10315
|
-
const [internalCollapsed, setInternalCollapsed] = (0,
|
|
10316
|
-
const [mobileSidebarOpen, setMobileSidebarOpen] = (0,
|
|
10452
|
+
const [internalCollapsed, setInternalCollapsed] = (0, import_react45.useState)(true);
|
|
10453
|
+
const [mobileSidebarOpen, setMobileSidebarOpen] = (0, import_react45.useState)(false);
|
|
10317
10454
|
const flat = useITFlatAppearance();
|
|
10318
10455
|
const isControlled = sidebar.isCollapsed !== void 0;
|
|
10319
10456
|
const desktopCollapsed = isControlled ? sidebar.isCollapsed : internalCollapsed;
|
|
@@ -10327,7 +10464,7 @@ function ITLayout({
|
|
|
10327
10464
|
else setMobileSidebarOpen((v) => !v);
|
|
10328
10465
|
};
|
|
10329
10466
|
const brand = sidebarFullHeight ? sidebar.brand ?? { logo: topBar.logo, text: topBar.logoText } : sidebar.brand;
|
|
10330
|
-
const topBarNode = /* @__PURE__ */ (0,
|
|
10467
|
+
const topBarNode = /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
|
|
10331
10468
|
ITTopBar,
|
|
10332
10469
|
{
|
|
10333
10470
|
...topBar,
|
|
@@ -10340,9 +10477,9 @@ function ITLayout({
|
|
|
10340
10477
|
const desktopSidebar = (
|
|
10341
10478
|
// Full-height: the sidebar sits beside the top bar, so it needs to win the
|
|
10342
10479
|
// stacking order when the collapsed rail expands over the content on hover.
|
|
10343
|
-
/* @__PURE__ */ (0,
|
|
10344
|
-
/* @__PURE__ */ (0,
|
|
10345
|
-
/* @__PURE__ */ (0,
|
|
10480
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: `hidden lg:block relative h-full ${sidebarFullHeight ? "z-50" : "z-40"}`, children: [
|
|
10481
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: `${reservedWidth} h-full flex-shrink-0` }),
|
|
10482
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "absolute top-0 left-0 h-full", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
|
|
10346
10483
|
ITSidebar,
|
|
10347
10484
|
{
|
|
10348
10485
|
...sidebar,
|
|
@@ -10355,17 +10492,17 @@ function ITLayout({
|
|
|
10355
10492
|
) })
|
|
10356
10493
|
] })
|
|
10357
10494
|
);
|
|
10358
|
-
const mobileSidebar = mobileSidebarOpen && /* @__PURE__ */ (0,
|
|
10495
|
+
const mobileSidebar = mobileSidebarOpen && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
|
|
10359
10496
|
"div",
|
|
10360
10497
|
{
|
|
10361
10498
|
className: "lg:hidden fixed inset-0 z-[40] transition-opacity duration-300 backdrop-blur-sm bg-black/40",
|
|
10362
10499
|
onClick: () => setMobileSidebarOpen(false),
|
|
10363
|
-
children: /* @__PURE__ */ (0,
|
|
10500
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
|
|
10364
10501
|
"div",
|
|
10365
10502
|
{
|
|
10366
10503
|
className: "h-full w-fit flex transform transition-transform duration-300 ease-[cubic-bezier(0.2,0,0,1)]",
|
|
10367
10504
|
onClick: (e) => e.stopPropagation(),
|
|
10368
|
-
children: /* @__PURE__ */ (0,
|
|
10505
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
|
|
10369
10506
|
ITSidebar,
|
|
10370
10507
|
{
|
|
10371
10508
|
...sidebar,
|
|
@@ -10382,16 +10519,16 @@ function ITLayout({
|
|
|
10382
10519
|
)
|
|
10383
10520
|
}
|
|
10384
10521
|
);
|
|
10385
|
-
const main = /* @__PURE__ */ (0,
|
|
10522
|
+
const main = /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("main", { className: "flex-1 overflow-y-auto w-full custom-scrollbar relative z-0", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: (0, import_clsx52.default)("mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8 py-6 h-full", contentClassName), children }) });
|
|
10386
10523
|
if (sidebarFullHeight) {
|
|
10387
|
-
return /* @__PURE__ */ (0,
|
|
10524
|
+
return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
|
|
10388
10525
|
"div",
|
|
10389
10526
|
{
|
|
10390
10527
|
className: `flex h-screen overflow-hidden w-full relative ${className}`,
|
|
10391
10528
|
style: { backgroundColor: layoutTokens.backgroundColor },
|
|
10392
10529
|
children: [
|
|
10393
10530
|
desktopSidebar,
|
|
10394
|
-
/* @__PURE__ */ (0,
|
|
10531
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "flex flex-col flex-1 min-w-0 overflow-hidden", children: [
|
|
10395
10532
|
topBarNode,
|
|
10396
10533
|
main
|
|
10397
10534
|
] }),
|
|
@@ -10400,9 +10537,9 @@ function ITLayout({
|
|
|
10400
10537
|
}
|
|
10401
10538
|
);
|
|
10402
10539
|
}
|
|
10403
|
-
return /* @__PURE__ */ (0,
|
|
10540
|
+
return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: `flex flex-col h-screen overflow-hidden w-full ${className}`, children: [
|
|
10404
10541
|
topBarNode,
|
|
10405
|
-
/* @__PURE__ */ (0,
|
|
10542
|
+
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
|
|
10406
10543
|
"div",
|
|
10407
10544
|
{
|
|
10408
10545
|
className: "flex flex-1 overflow-hidden relative",
|
|
@@ -10426,7 +10563,7 @@ var sizeClasses = {
|
|
|
10426
10563
|
};
|
|
10427
10564
|
|
|
10428
10565
|
// src/components/atoms/loader/loader.tsx
|
|
10429
|
-
var
|
|
10566
|
+
var import_jsx_runtime72 = require("react/jsx-runtime");
|
|
10430
10567
|
function ITLoader({
|
|
10431
10568
|
size = "md",
|
|
10432
10569
|
variant = "spinner",
|
|
@@ -10441,22 +10578,22 @@ function ITLoader({
|
|
|
10441
10578
|
const bgStyle = isCssValue ? { backgroundColor: resolvedColor } : {};
|
|
10442
10579
|
const colorClass = !isCssValue ? color : "";
|
|
10443
10580
|
if (variant === "spinner") {
|
|
10444
|
-
return /* @__PURE__ */ (0,
|
|
10581
|
+
return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
10445
10582
|
"div",
|
|
10446
10583
|
{
|
|
10447
10584
|
className: `inline-block ${sizeClasses[size]} animate-spin rounded-full border-2 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite] ${colorClass} ${className}`,
|
|
10448
10585
|
role: "status",
|
|
10449
10586
|
style,
|
|
10450
|
-
children: /* @__PURE__ */ (0,
|
|
10587
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ITText, { as: "span", className: "!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]", children: "Loading..." })
|
|
10451
10588
|
}
|
|
10452
10589
|
);
|
|
10453
10590
|
}
|
|
10454
10591
|
if (variant === "dots") {
|
|
10455
|
-
return /* @__PURE__ */ (0,
|
|
10592
|
+
return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
10456
10593
|
"div",
|
|
10457
10594
|
{
|
|
10458
10595
|
className: `flex items-center justify-center space-x-2 ${className}`,
|
|
10459
|
-
children: [...Array(3)].map((_, i) => /* @__PURE__ */ (0,
|
|
10596
|
+
children: [...Array(3)].map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
10460
10597
|
"div",
|
|
10461
10598
|
{
|
|
10462
10599
|
className: `${sizeClasses[size.replace(/l|g/, "")]} animate-bounce rounded-full ${colorClass}`,
|
|
@@ -10471,11 +10608,11 @@ function ITLoader({
|
|
|
10471
10608
|
);
|
|
10472
10609
|
}
|
|
10473
10610
|
if (variant === "bar") {
|
|
10474
|
-
return /* @__PURE__ */ (0,
|
|
10611
|
+
return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
10475
10612
|
"div",
|
|
10476
10613
|
{
|
|
10477
10614
|
className: `w-full ${size === "sm" ? "h-1" : size === "md" ? "h-1.5" : size === "lg" ? "h-2" : "h-2.5"} bg-secondary-200 rounded-full overflow-hidden ${className}`,
|
|
10478
|
-
children: /* @__PURE__ */ (0,
|
|
10615
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
10479
10616
|
"div",
|
|
10480
10617
|
{
|
|
10481
10618
|
className: `h-full animate-progress ${colorClass}`,
|
|
@@ -10491,7 +10628,7 @@ function ITLoader({
|
|
|
10491
10628
|
);
|
|
10492
10629
|
}
|
|
10493
10630
|
if (variant === "pulse") {
|
|
10494
|
-
return /* @__PURE__ */ (0,
|
|
10631
|
+
return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
10495
10632
|
"div",
|
|
10496
10633
|
{
|
|
10497
10634
|
className: `rounded-full ${sizeClasses[size]} animate-pulse ${colorClass} ${className}`,
|
|
@@ -10504,9 +10641,9 @@ function ITLoader({
|
|
|
10504
10641
|
|
|
10505
10642
|
// src/components/molecules/stepper/stepper.tsx
|
|
10506
10643
|
var import_clsx53 = __toESM(require("clsx"), 1);
|
|
10507
|
-
var
|
|
10644
|
+
var import_react46 = require("react");
|
|
10508
10645
|
var import_fa31 = require("react-icons/fa");
|
|
10509
|
-
var
|
|
10646
|
+
var import_jsx_runtime73 = require("react/jsx-runtime");
|
|
10510
10647
|
function ITStepper({
|
|
10511
10648
|
steps,
|
|
10512
10649
|
currentStep,
|
|
@@ -10521,15 +10658,15 @@ function ITStepper({
|
|
|
10521
10658
|
maxContentHeight = "400px",
|
|
10522
10659
|
color = "primary"
|
|
10523
10660
|
}) {
|
|
10524
|
-
const [direction, setDirection] = (0,
|
|
10525
|
-
const contentRef = (0,
|
|
10526
|
-
const progressRef = (0,
|
|
10661
|
+
const [direction, setDirection] = (0, import_react46.useState)("next");
|
|
10662
|
+
const contentRef = (0, import_react46.useRef)(null);
|
|
10663
|
+
const progressRef = (0, import_react46.useRef)(null);
|
|
10527
10664
|
const isThemeColor = color in theme.colors;
|
|
10528
10665
|
const resolvedColor = isThemeColor ? theme.colors[color][500] : color;
|
|
10529
|
-
(0,
|
|
10666
|
+
(0, import_react46.useEffect)(() => {
|
|
10530
10667
|
onStepChange?.(currentStep);
|
|
10531
10668
|
}, [currentStep, onStepChange]);
|
|
10532
|
-
(0,
|
|
10669
|
+
(0, import_react46.useEffect)(() => {
|
|
10533
10670
|
const pct = currentStep / Math.max(1, steps.length - 1) * 100;
|
|
10534
10671
|
if (progressRef.current) {
|
|
10535
10672
|
progressRef.current.style.width = `${pct}%`;
|
|
@@ -10573,23 +10710,23 @@ function ITStepper({
|
|
|
10573
10710
|
const renderStepContent = (index, isCompleted) => {
|
|
10574
10711
|
const step = steps[index];
|
|
10575
10712
|
if (isCompleted) {
|
|
10576
|
-
return /* @__PURE__ */ (0,
|
|
10713
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_fa31.FaCheck, { className: "w-4 h-4" });
|
|
10577
10714
|
}
|
|
10578
10715
|
if (step.icon && useIcons) {
|
|
10579
|
-
return /* @__PURE__ */ (0,
|
|
10716
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "flex items-center justify-center w-5 h-5", children: step.icon });
|
|
10580
10717
|
}
|
|
10581
|
-
return /* @__PURE__ */ (0,
|
|
10718
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ITText, { as: "span", className: "text-sm font-semibold", children: index + 1 });
|
|
10582
10719
|
};
|
|
10583
|
-
return /* @__PURE__ */ (0,
|
|
10584
|
-
/* @__PURE__ */ (0,
|
|
10585
|
-
/* @__PURE__ */ (0,
|
|
10720
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: (0, import_clsx53.default)("w-full max-w-5xl mx-auto px-4", containerClassName), children: [
|
|
10721
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "relative mb-8", children: [
|
|
10722
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
10586
10723
|
"div",
|
|
10587
10724
|
{
|
|
10588
10725
|
className: "absolute left-6 right-6 top-5 h-1 bg-secondary-200 rounded-full z-0",
|
|
10589
10726
|
"aria-hidden": true
|
|
10590
10727
|
}
|
|
10591
10728
|
),
|
|
10592
|
-
/* @__PURE__ */ (0,
|
|
10729
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
10593
10730
|
"div",
|
|
10594
10731
|
{
|
|
10595
10732
|
ref: progressRef,
|
|
@@ -10597,11 +10734,11 @@ function ITStepper({
|
|
|
10597
10734
|
"aria-hidden": true
|
|
10598
10735
|
}
|
|
10599
10736
|
),
|
|
10600
|
-
/* @__PURE__ */ (0,
|
|
10737
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "flex items-start justify-between space-x-2 relative z-20", children: steps.map((step, idx) => {
|
|
10601
10738
|
const isActive = idx === currentStep;
|
|
10602
10739
|
const isCompleted = idx < currentStep;
|
|
10603
10740
|
const hasIcon = step.icon && useIcons;
|
|
10604
|
-
return /* @__PURE__ */ (0,
|
|
10741
|
+
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
10605
10742
|
"button",
|
|
10606
10743
|
{
|
|
10607
10744
|
type: "button",
|
|
@@ -10611,8 +10748,8 @@ function ITStepper({
|
|
|
10611
10748
|
"aria-label": `Paso ${idx + 1} ${step.label}`,
|
|
10612
10749
|
className: "flex-1 group",
|
|
10613
10750
|
title: step.label,
|
|
10614
|
-
children: /* @__PURE__ */ (0,
|
|
10615
|
-
/* @__PURE__ */ (0,
|
|
10751
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex flex-col items-center", children: [
|
|
10752
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
10616
10753
|
"div",
|
|
10617
10754
|
{
|
|
10618
10755
|
className: (0, import_clsx53.default)(
|
|
@@ -10626,7 +10763,7 @@ function ITStepper({
|
|
|
10626
10763
|
children: renderStepContent(idx, isCompleted)
|
|
10627
10764
|
}
|
|
10628
10765
|
),
|
|
10629
|
-
/* @__PURE__ */ (0,
|
|
10766
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
10630
10767
|
ITText,
|
|
10631
10768
|
{
|
|
10632
10769
|
as: "span",
|
|
@@ -10644,7 +10781,7 @@ function ITStepper({
|
|
|
10644
10781
|
);
|
|
10645
10782
|
}) })
|
|
10646
10783
|
] }),
|
|
10647
|
-
/* @__PURE__ */ (0,
|
|
10784
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
10648
10785
|
"div",
|
|
10649
10786
|
{
|
|
10650
10787
|
ref: contentRef,
|
|
@@ -10660,37 +10797,37 @@ function ITStepper({
|
|
|
10660
10797
|
children: steps[currentStep].content
|
|
10661
10798
|
}
|
|
10662
10799
|
),
|
|
10663
|
-
/* @__PURE__ */ (0,
|
|
10664
|
-
/* @__PURE__ */ (0,
|
|
10800
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex justify-between items-center mt-6", children: [
|
|
10801
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
10665
10802
|
ITButton,
|
|
10666
10803
|
{
|
|
10667
10804
|
variant: "outlined",
|
|
10668
10805
|
color: "secondary",
|
|
10669
10806
|
disabled: currentStep === 0,
|
|
10670
10807
|
onClick: prevStep,
|
|
10671
|
-
children: /* @__PURE__ */ (0,
|
|
10672
|
-
/* @__PURE__ */ (0,
|
|
10673
|
-
/* @__PURE__ */ (0,
|
|
10808
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
10809
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_fa31.FaChevronLeft, {}),
|
|
10810
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ITText, { as: "span", children: "Atr\xE1s" })
|
|
10674
10811
|
] })
|
|
10675
10812
|
}
|
|
10676
10813
|
),
|
|
10677
|
-
/* @__PURE__ */ (0,
|
|
10678
|
-
/* @__PURE__ */ (0,
|
|
10814
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex items-center gap-3", children: [
|
|
10815
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(ITText, { as: "div", className: "text-sm text-secondary-500 mr-2 hidden sm:block", children: [
|
|
10679
10816
|
"Paso ",
|
|
10680
10817
|
currentStep + 1,
|
|
10681
10818
|
" de ",
|
|
10682
10819
|
steps.length
|
|
10683
10820
|
] }),
|
|
10684
|
-
/* @__PURE__ */ (0,
|
|
10821
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
10685
10822
|
ITButton,
|
|
10686
10823
|
{
|
|
10687
10824
|
variant: "solid",
|
|
10688
10825
|
color,
|
|
10689
10826
|
disabled: disableNext,
|
|
10690
10827
|
onClick: nextStep,
|
|
10691
|
-
children: /* @__PURE__ */ (0,
|
|
10692
|
-
/* @__PURE__ */ (0,
|
|
10693
|
-
currentStep === steps.length - 1 ? /* @__PURE__ */ (0,
|
|
10828
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
10829
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ITText, { as: "span", children: currentStep === steps.length - 1 ? "Finalizar" : "Siguiente" }),
|
|
10830
|
+
currentStep === steps.length - 1 ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_fa31.FaCheck, {}) : /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_fa31.FaChevronRight, {})
|
|
10694
10831
|
] })
|
|
10695
10832
|
}
|
|
10696
10833
|
)
|
|
@@ -10700,7 +10837,7 @@ function ITStepper({
|
|
|
10700
10837
|
}
|
|
10701
10838
|
|
|
10702
10839
|
// src/components/theme-provider/themeProvider.tsx
|
|
10703
|
-
var
|
|
10840
|
+
var import_react47 = require("react");
|
|
10704
10841
|
var import_md3 = require("react-icons/md");
|
|
10705
10842
|
|
|
10706
10843
|
// src/components/theme-provider/themePresets.ts
|
|
@@ -10878,7 +11015,7 @@ var PRESETS = [
|
|
|
10878
11015
|
];
|
|
10879
11016
|
|
|
10880
11017
|
// src/components/theme-provider/themeProvider.tsx
|
|
10881
|
-
var
|
|
11018
|
+
var import_jsx_runtime74 = require("react/jsx-runtime");
|
|
10882
11019
|
var STORAGE_KEY = "it-theme-palette";
|
|
10883
11020
|
var SHADOW_LEVELS = {
|
|
10884
11021
|
0: {
|
|
@@ -10973,7 +11110,7 @@ function ITThemeProvider({
|
|
|
10973
11110
|
shadow,
|
|
10974
11111
|
appearance = "soft"
|
|
10975
11112
|
}) {
|
|
10976
|
-
const [palette2, setPaletteState] = (0,
|
|
11113
|
+
const [palette2, setPaletteState] = (0, import_react47.useState)(() => {
|
|
10977
11114
|
const basePalette = {
|
|
10978
11115
|
...DEFAULT_PALETTE,
|
|
10979
11116
|
...theme2,
|
|
@@ -10999,8 +11136,8 @@ function ITThemeProvider({
|
|
|
10999
11136
|
}
|
|
11000
11137
|
return basePalette;
|
|
11001
11138
|
});
|
|
11002
|
-
const [isOpen, setIsOpen] = (0,
|
|
11003
|
-
const [customPresets, setCustomPresets] = (0,
|
|
11139
|
+
const [isOpen, setIsOpen] = (0, import_react47.useState)(false);
|
|
11140
|
+
const [customPresets, setCustomPresets] = (0, import_react47.useState)(() => {
|
|
11004
11141
|
try {
|
|
11005
11142
|
const saved = localStorage.getItem("it-theme-custom-presets");
|
|
11006
11143
|
return saved ? JSON.parse(saved) : [];
|
|
@@ -11009,8 +11146,8 @@ function ITThemeProvider({
|
|
|
11009
11146
|
return [];
|
|
11010
11147
|
}
|
|
11011
11148
|
});
|
|
11012
|
-
const [newPresetName, setNewPresetName] = (0,
|
|
11013
|
-
const [isSavingPreset, setIsSavingPreset] = (0,
|
|
11149
|
+
const [newPresetName, setNewPresetName] = (0, import_react47.useState)("");
|
|
11150
|
+
const [isSavingPreset, setIsSavingPreset] = (0, import_react47.useState)(false);
|
|
11014
11151
|
const handleSavePreset = () => {
|
|
11015
11152
|
if (!newPresetName.trim()) return;
|
|
11016
11153
|
const newPreset = {
|
|
@@ -11029,8 +11166,8 @@ function ITThemeProvider({
|
|
|
11029
11166
|
setCustomPresets(updated);
|
|
11030
11167
|
localStorage.setItem("it-theme-custom-presets", JSON.stringify(updated));
|
|
11031
11168
|
};
|
|
11032
|
-
const [resolvedTheme, setResolvedTheme] = (0,
|
|
11033
|
-
const [darkModeMode, setDarkModeMode] = (0,
|
|
11169
|
+
const [resolvedTheme, setResolvedTheme] = (0, import_react47.useState)("light");
|
|
11170
|
+
const [darkModeMode, setDarkModeMode] = (0, import_react47.useState)(
|
|
11034
11171
|
() => {
|
|
11035
11172
|
const saved = localStorage.getItem("it-theme-dark-mode");
|
|
11036
11173
|
if (saved === "light" || saved === "dark" || saved === "system") {
|
|
@@ -11039,7 +11176,7 @@ function ITThemeProvider({
|
|
|
11039
11176
|
return "system";
|
|
11040
11177
|
}
|
|
11041
11178
|
);
|
|
11042
|
-
(0,
|
|
11179
|
+
(0, import_react47.useEffect)(() => {
|
|
11043
11180
|
localStorage.setItem("it-theme-dark-mode", darkModeMode);
|
|
11044
11181
|
const applyDarkMode = (isDark) => {
|
|
11045
11182
|
if (isDark) {
|
|
@@ -11064,7 +11201,7 @@ function ITThemeProvider({
|
|
|
11064
11201
|
applyDarkMode(darkModeMode === "dark");
|
|
11065
11202
|
}
|
|
11066
11203
|
}, [darkModeMode]);
|
|
11067
|
-
(0,
|
|
11204
|
+
(0, import_react47.useEffect)(() => {
|
|
11068
11205
|
if (!showFab) {
|
|
11069
11206
|
setPaletteState({
|
|
11070
11207
|
...DEFAULT_PALETTE,
|
|
@@ -11074,7 +11211,7 @@ function ITThemeProvider({
|
|
|
11074
11211
|
});
|
|
11075
11212
|
}
|
|
11076
11213
|
}, [theme2, showFab]);
|
|
11077
|
-
(0,
|
|
11214
|
+
(0, import_react47.useLayoutEffect)(() => {
|
|
11078
11215
|
const root = document.documentElement;
|
|
11079
11216
|
const scale = typeof density === "number" && isFinite(density) ? Math.min(Math.max(density, 0.5), 1.5) : 1;
|
|
11080
11217
|
root.style.setProperty("--it-density", String(scale));
|
|
@@ -11084,12 +11221,12 @@ function ITThemeProvider({
|
|
|
11084
11221
|
root.style.fontSize = "";
|
|
11085
11222
|
};
|
|
11086
11223
|
}, [density]);
|
|
11087
|
-
(0,
|
|
11224
|
+
(0, import_react47.useLayoutEffect)(() => {
|
|
11088
11225
|
const root = document.documentElement;
|
|
11089
11226
|
root.setAttribute("data-it-appearance", appearance);
|
|
11090
11227
|
return () => root.removeAttribute("data-it-appearance");
|
|
11091
11228
|
}, [appearance]);
|
|
11092
|
-
(0,
|
|
11229
|
+
(0, import_react47.useLayoutEffect)(() => {
|
|
11093
11230
|
const root = document.documentElement;
|
|
11094
11231
|
const radiusTokens = ["xs", "sm", "md", "lg", "xl", "2xl", "3xl"];
|
|
11095
11232
|
if (typeof radius === "number" && isFinite(radius)) {
|
|
@@ -11121,7 +11258,7 @@ function ITThemeProvider({
|
|
|
11121
11258
|
surfaceStyle?.remove();
|
|
11122
11259
|
};
|
|
11123
11260
|
}, [radius, shadow]);
|
|
11124
|
-
(0,
|
|
11261
|
+
(0, import_react47.useEffect)(() => {
|
|
11125
11262
|
const injectStyles = (obj, prefix = "") => {
|
|
11126
11263
|
Object.entries(obj).forEach(([key, val]) => {
|
|
11127
11264
|
if (typeof val === "object" && val !== null) {
|
|
@@ -12275,14 +12412,14 @@ function ITThemeProvider({
|
|
|
12275
12412
|
const isNested = colorKey.includes(".");
|
|
12276
12413
|
const label = isNested ? colorKey.split(".")[1] : colorKey;
|
|
12277
12414
|
const value = getNestedValue3(palette2, colorKey);
|
|
12278
|
-
return /* @__PURE__ */ (0,
|
|
12415
|
+
return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
|
|
12279
12416
|
"div",
|
|
12280
12417
|
{
|
|
12281
12418
|
className: "flex items-center justify-between p-3 rounded-xl border border-slate-100 dark:border-slate-800 bg-white dark:bg-slate-900/50 gap-3 hover:border-slate-200 dark:hover:border-slate-700 transition-colors",
|
|
12282
12419
|
children: [
|
|
12283
|
-
/* @__PURE__ */ (0,
|
|
12284
|
-
/* @__PURE__ */ (0,
|
|
12285
|
-
/* @__PURE__ */ (0,
|
|
12420
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex items-center gap-3 flex-1 min-w-0", children: [
|
|
12421
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "relative w-10 h-10 rounded-xl border-2 border-slate-200 dark:border-slate-700 overflow-hidden cursor-pointer flex-shrink-0 shadow-sm hover:scale-105 transition-transform", children: [
|
|
12422
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12286
12423
|
"input",
|
|
12287
12424
|
{
|
|
12288
12425
|
type: "color",
|
|
@@ -12291,23 +12428,23 @@ function ITThemeProvider({
|
|
|
12291
12428
|
className: "absolute inset-0 opacity-0 cursor-pointer w-full h-full"
|
|
12292
12429
|
}
|
|
12293
12430
|
),
|
|
12294
|
-
/* @__PURE__ */ (0,
|
|
12431
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "w-full h-full", style: { backgroundColor: value } })
|
|
12295
12432
|
] }),
|
|
12296
|
-
/* @__PURE__ */ (0,
|
|
12297
|
-
/* @__PURE__ */ (0,
|
|
12298
|
-
/* @__PURE__ */ (0,
|
|
12299
|
-
/* @__PURE__ */ (0,
|
|
12433
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex flex-col min-w-0", children: [
|
|
12434
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ITText, { as: "span", className: "text-xs font-bold text-slate-700 dark:text-slate-300 truncate capitalize", children: label.replace(/([A-Z])/g, " $1").trim() }),
|
|
12435
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex items-center gap-2 mt-0.5", children: [
|
|
12436
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12300
12437
|
"span",
|
|
12301
12438
|
{
|
|
12302
12439
|
className: "w-3 h-3 rounded-full border border-slate-200 dark:border-slate-600",
|
|
12303
12440
|
style: { backgroundColor: value }
|
|
12304
12441
|
}
|
|
12305
12442
|
),
|
|
12306
|
-
/* @__PURE__ */ (0,
|
|
12443
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ITText, { as: "span", className: "font-mono text-[11px] text-slate-400", children: value })
|
|
12307
12444
|
] })
|
|
12308
12445
|
] })
|
|
12309
12446
|
] }),
|
|
12310
|
-
/* @__PURE__ */ (0,
|
|
12447
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12311
12448
|
"input",
|
|
12312
12449
|
{
|
|
12313
12450
|
type: "text",
|
|
@@ -12326,14 +12463,14 @@ function ITThemeProvider({
|
|
|
12326
12463
|
isCustom
|
|
12327
12464
|
}) => {
|
|
12328
12465
|
const isSelected = JSON.stringify(preset.colors) === JSON.stringify(palette2);
|
|
12329
|
-
return /* @__PURE__ */ (0,
|
|
12466
|
+
return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
|
|
12330
12467
|
"button",
|
|
12331
12468
|
{
|
|
12332
12469
|
type: "button",
|
|
12333
12470
|
onClick: () => applyPreset(preset.colors),
|
|
12334
12471
|
className: `relative flex flex-col items-start p-2.5 rounded-xl border text-left transition-all group ${isSelected ? "border-primary-500 bg-primary-500/5 shadow-sm ring-1 ring-primary-500/20" : "border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900/50 hover:border-slate-300 dark:hover:border-slate-600"}`,
|
|
12335
12472
|
children: [
|
|
12336
|
-
isCustom && /* @__PURE__ */ (0,
|
|
12473
|
+
isCustom && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12337
12474
|
"span",
|
|
12338
12475
|
{
|
|
12339
12476
|
onClick: (e) => {
|
|
@@ -12342,11 +12479,11 @@ function ITThemeProvider({
|
|
|
12342
12479
|
},
|
|
12343
12480
|
className: "absolute top-1.5 right-1.5 opacity-0 group-hover:opacity-100 p-0.5 rounded-md hover:bg-danger-500/10 hover:text-danger-500 text-slate-400 dark:text-slate-500 cursor-pointer transition-all z-10",
|
|
12344
12481
|
title: "Eliminar",
|
|
12345
|
-
children: /* @__PURE__ */ (0,
|
|
12482
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_md3.MdClose, { size: 12 })
|
|
12346
12483
|
}
|
|
12347
12484
|
),
|
|
12348
|
-
/* @__PURE__ */ (0,
|
|
12349
|
-
/* @__PURE__ */ (0,
|
|
12485
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ITText, { as: "span", className: "text-xs font-semibold truncate w-full mb-1.5 pr-4 text-slate-700 dark:text-slate-300", children: preset.name }),
|
|
12486
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "flex gap-1", children: ["primary", "secondary", "ternary", "success"].map((c) => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12350
12487
|
"span",
|
|
12351
12488
|
{
|
|
12352
12489
|
className: "w-3 h-3 rounded-full border border-black/10",
|
|
@@ -12358,7 +12495,7 @@ function ITThemeProvider({
|
|
|
12358
12495
|
}
|
|
12359
12496
|
);
|
|
12360
12497
|
};
|
|
12361
|
-
return /* @__PURE__ */ (0,
|
|
12498
|
+
return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
|
|
12362
12499
|
ITThemeContext.Provider,
|
|
12363
12500
|
{
|
|
12364
12501
|
value: {
|
|
@@ -12375,28 +12512,28 @@ function ITThemeProvider({
|
|
|
12375
12512
|
},
|
|
12376
12513
|
children: [
|
|
12377
12514
|
children,
|
|
12378
|
-
showFab && /* @__PURE__ */ (0,
|
|
12515
|
+
showFab && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12379
12516
|
"button",
|
|
12380
12517
|
{
|
|
12381
12518
|
onClick: () => setIsOpen((prev) => !prev),
|
|
12382
12519
|
className: "it-theme-fab it-theme-bounce",
|
|
12383
12520
|
style: { backgroundColor: "var(--color-primary)" },
|
|
12384
12521
|
"aria-label": "Configurar Paleta de Colores",
|
|
12385
|
-
children: /* @__PURE__ */ (0,
|
|
12522
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_md3.MdPalette, { size: 28 })
|
|
12386
12523
|
}
|
|
12387
12524
|
),
|
|
12388
|
-
showFab && /* @__PURE__ */ (0,
|
|
12525
|
+
showFab && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12389
12526
|
ITDialog,
|
|
12390
12527
|
{
|
|
12391
12528
|
isOpen,
|
|
12392
12529
|
onClose: () => setIsOpen(false),
|
|
12393
12530
|
title: "Dise\xF1ador de Temas",
|
|
12394
12531
|
useFormHeader: true,
|
|
12395
|
-
children: /* @__PURE__ */ (0,
|
|
12396
|
-
/* @__PURE__ */ (0,
|
|
12397
|
-
/* @__PURE__ */ (0,
|
|
12398
|
-
/* @__PURE__ */ (0,
|
|
12399
|
-
/* @__PURE__ */ (0,
|
|
12532
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex gap-6 h-[580px]", children: [
|
|
12533
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "w-64 flex-shrink-0 flex flex-col gap-5 overflow-y-auto pr-1", children: [
|
|
12534
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { children: [
|
|
12535
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ITText, { as: "span", className: "text-[11px] font-bold uppercase tracking-wider text-slate-400 dark:text-slate-500 mb-2.5 block", children: "Apariencia" }),
|
|
12536
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12400
12537
|
ITSegmentedControl,
|
|
12401
12538
|
{
|
|
12402
12539
|
options: [
|
|
@@ -12410,16 +12547,16 @@ function ITThemeProvider({
|
|
|
12410
12547
|
}
|
|
12411
12548
|
)
|
|
12412
12549
|
] }),
|
|
12413
|
-
/* @__PURE__ */ (0,
|
|
12414
|
-
/* @__PURE__ */ (0,
|
|
12415
|
-
/* @__PURE__ */ (0,
|
|
12550
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { children: [
|
|
12551
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "flex items-center justify-between mb-2.5", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ITText, { as: "span", className: "text-[11px] font-bold uppercase tracking-wider text-slate-400 dark:text-slate-500", children: "Presets" }) }),
|
|
12552
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "grid grid-cols-2 gap-2", children: PRESETS.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(PresetCard, { preset }, preset.name)) })
|
|
12416
12553
|
] }),
|
|
12417
|
-
customPresets.length > 0 && /* @__PURE__ */ (0,
|
|
12418
|
-
/* @__PURE__ */ (0,
|
|
12419
|
-
/* @__PURE__ */ (0,
|
|
12554
|
+
customPresets.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { children: [
|
|
12555
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ITText, { as: "span", className: "text-[11px] font-bold uppercase tracking-wider text-slate-400 dark:text-slate-500 mb-2.5 block", children: "Mis Temas" }),
|
|
12556
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "flex flex-col gap-1.5", children: customPresets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(PresetCard, { preset, isCustom: true }, preset.name)) })
|
|
12420
12557
|
] }),
|
|
12421
|
-
isSavingPreset && /* @__PURE__ */ (0,
|
|
12422
|
-
/* @__PURE__ */ (0,
|
|
12558
|
+
isSavingPreset && /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex flex-col gap-2 p-3 rounded-xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900/50", children: [
|
|
12559
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12423
12560
|
ITInput,
|
|
12424
12561
|
{
|
|
12425
12562
|
name: "presetName",
|
|
@@ -12437,8 +12574,8 @@ function ITThemeProvider({
|
|
|
12437
12574
|
}
|
|
12438
12575
|
}
|
|
12439
12576
|
),
|
|
12440
|
-
/* @__PURE__ */ (0,
|
|
12441
|
-
/* @__PURE__ */ (0,
|
|
12577
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex gap-2", children: [
|
|
12578
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12442
12579
|
ITButton,
|
|
12443
12580
|
{
|
|
12444
12581
|
label: "Guardar",
|
|
@@ -12449,7 +12586,7 @@ function ITThemeProvider({
|
|
|
12449
12586
|
className: "flex-1"
|
|
12450
12587
|
}
|
|
12451
12588
|
),
|
|
12452
|
-
/* @__PURE__ */ (0,
|
|
12589
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12453
12590
|
ITButton,
|
|
12454
12591
|
{
|
|
12455
12592
|
label: "X",
|
|
@@ -12463,31 +12600,31 @@ function ITThemeProvider({
|
|
|
12463
12600
|
)
|
|
12464
12601
|
] })
|
|
12465
12602
|
] }),
|
|
12466
|
-
!isSavingPreset && /* @__PURE__ */ (0,
|
|
12603
|
+
!isSavingPreset && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12467
12604
|
ITButton,
|
|
12468
12605
|
{
|
|
12469
12606
|
variant: "outlined",
|
|
12470
|
-
icon: /* @__PURE__ */ (0,
|
|
12607
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_md3.MdPalette, { size: 14 }),
|
|
12471
12608
|
label: "Guardar actual",
|
|
12472
12609
|
onClick: () => setIsSavingPreset(true),
|
|
12473
12610
|
size: "sm"
|
|
12474
12611
|
}
|
|
12475
12612
|
),
|
|
12476
|
-
/* @__PURE__ */ (0,
|
|
12613
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12477
12614
|
ITButton,
|
|
12478
12615
|
{
|
|
12479
12616
|
variant: "outlined",
|
|
12480
12617
|
color: "danger",
|
|
12481
|
-
icon: /* @__PURE__ */ (0,
|
|
12618
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_md3.MdRefresh, { size: 14 }),
|
|
12482
12619
|
label: "Restaurar default",
|
|
12483
12620
|
onClick: resetTheme,
|
|
12484
12621
|
size: "sm"
|
|
12485
12622
|
}
|
|
12486
12623
|
)
|
|
12487
12624
|
] }),
|
|
12488
|
-
/* @__PURE__ */ (0,
|
|
12489
|
-
/* @__PURE__ */ (0,
|
|
12490
|
-
/* @__PURE__ */ (0,
|
|
12625
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ITDivider, { orientation: "vertical" }),
|
|
12626
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex-1 flex flex-col min-w-0", children: [
|
|
12627
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12491
12628
|
tabs_default,
|
|
12492
12629
|
{
|
|
12493
12630
|
variant: "pill",
|
|
@@ -12495,7 +12632,7 @@ function ITThemeProvider({
|
|
|
12495
12632
|
{
|
|
12496
12633
|
id: "brand",
|
|
12497
12634
|
label: "Marca",
|
|
12498
|
-
content: /* @__PURE__ */ (0,
|
|
12635
|
+
content: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 max-h-[480px] overflow-y-auto pr-2 mt-3", children: [
|
|
12499
12636
|
"primary",
|
|
12500
12637
|
"secondary",
|
|
12501
12638
|
"ternary",
|
|
@@ -12504,35 +12641,35 @@ function ITThemeProvider({
|
|
|
12504
12641
|
"info",
|
|
12505
12642
|
"alert",
|
|
12506
12643
|
"warning"
|
|
12507
|
-
].map((key) => /* @__PURE__ */ (0,
|
|
12644
|
+
].map((key) => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ColorRow, { colorKey: key }, key)) })
|
|
12508
12645
|
},
|
|
12509
12646
|
{
|
|
12510
12647
|
id: "layout",
|
|
12511
12648
|
label: "Nav & Sidebar",
|
|
12512
|
-
content: /* @__PURE__ */ (0,
|
|
12649
|
+
content: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 max-h-[480px] overflow-y-auto pr-2 mt-3", children: [
|
|
12513
12650
|
"layout.sidebarBg",
|
|
12514
12651
|
"layout.sidebarText",
|
|
12515
12652
|
"layout.navbarBg",
|
|
12516
12653
|
"layout.navbarText"
|
|
12517
|
-
].map((key) => /* @__PURE__ */ (0,
|
|
12654
|
+
].map((key) => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ColorRow, { colorKey: key }, key)) })
|
|
12518
12655
|
},
|
|
12519
12656
|
{
|
|
12520
12657
|
id: "tables",
|
|
12521
12658
|
label: "Tablas",
|
|
12522
|
-
content: /* @__PURE__ */ (0,
|
|
12659
|
+
content: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 max-h-[480px] overflow-y-auto pr-2 mt-3", children: [
|
|
12523
12660
|
"table.headerBg",
|
|
12524
12661
|
"table.headerText",
|
|
12525
12662
|
"table.rowBg",
|
|
12526
12663
|
"table.rowText",
|
|
12527
12664
|
"table.rowHover"
|
|
12528
|
-
].map((key) => /* @__PURE__ */ (0,
|
|
12665
|
+
].map((key) => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ColorRow, { colorKey: key }, key)) })
|
|
12529
12666
|
}
|
|
12530
12667
|
]
|
|
12531
12668
|
}
|
|
12532
12669
|
),
|
|
12533
|
-
/* @__PURE__ */ (0,
|
|
12534
|
-
/* @__PURE__ */ (0,
|
|
12535
|
-
/* @__PURE__ */ (0,
|
|
12670
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex items-center justify-end gap-3 mt-auto pt-4 border-t border-slate-100 dark:border-slate-800", children: [
|
|
12671
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(ITText, { as: "p", className: "text-[11px] text-slate-400 mr-auto", children: "Los cambios se guardan autom\xE1ticamente" }),
|
|
12672
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
12536
12673
|
ITButton,
|
|
12537
12674
|
{
|
|
12538
12675
|
label: "Cerrar",
|
|
@@ -12593,6 +12730,7 @@ var createValidationSchema = (fields) => Yup.object().shape(
|
|
|
12593
12730
|
ITInput,
|
|
12594
12731
|
ITInputNumber,
|
|
12595
12732
|
ITLayout,
|
|
12733
|
+
ITLineBarChart,
|
|
12596
12734
|
ITLoader,
|
|
12597
12735
|
ITMaskedInput,
|
|
12598
12736
|
ITMultiSelect,
|