@redi.run/redi-components 0.0.23 → 0.0.24
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/redi-components.js +60 -64
- package/dist/redi-components.umd.cjs +1 -1
- package/package.json +1 -1
package/dist/redi-components.js
CHANGED
|
@@ -512,52 +512,48 @@ var AdvancedTable_default = ({ data: e, columns: n, defaultSort: a, defaultFilte
|
|
|
512
512
|
},
|
|
513
513
|
clearAllFilters: "Limpiar todos los filtros"
|
|
514
514
|
} }) => {
|
|
515
|
-
let [D, O] = useState(null), [k, A] = useState(null), [j, M] = useState(!1), [N, P] = useState(null), F = useRef(null), { state:
|
|
515
|
+
let [D, O] = useState(null), [k, A] = useState(null), [j, M] = useState(!1), [N, P] = useState(null), F = useRef(null), [I, L] = useState(n), { state: R, orderedColumns: z, handleSort: B, handleFilter: V, clearAllFilters: H, handlePageChange: U, handlePageSizeChange: W, handleColumnReorder: G, handleToggleColumn: K } = useAdvancedTable({
|
|
516
516
|
data: e,
|
|
517
|
-
columns:
|
|
517
|
+
columns: I,
|
|
518
518
|
defaultSort: a,
|
|
519
519
|
defaultFilters: m,
|
|
520
520
|
defaultPageSize: h,
|
|
521
521
|
pageSizeOptions: _,
|
|
522
522
|
persistConfig: C,
|
|
523
523
|
configKey: w
|
|
524
|
-
}), { paginatedData:
|
|
525
|
-
useEffect(() =>
|
|
526
|
-
|
|
527
|
-
n.find((t) => t.id === e.id) || n.push(e);
|
|
528
|
-
});
|
|
529
|
-
}, [W, n]);
|
|
530
|
-
let Y = (e, t) => {
|
|
524
|
+
}), { paginatedData: q, sortConfig: J, filters: Y, pagination: X, hiddenColumns: Z } = R;
|
|
525
|
+
useEffect(() => L(n), [n]);
|
|
526
|
+
let Q = (e, t) => {
|
|
531
527
|
O(t), e.dataTransfer.effectAllowed = "move", e.dataTransfer.setData("text/html", "");
|
|
532
|
-
},
|
|
528
|
+
}, ee = (e, t) => {
|
|
533
529
|
e.preventDefault(), e.dataTransfer.dropEffect = "move", A(t);
|
|
534
|
-
},
|
|
530
|
+
}, te = () => {
|
|
535
531
|
A(null);
|
|
536
|
-
},
|
|
532
|
+
}, ne = (e, t) => {
|
|
537
533
|
if (e.preventDefault(), D !== null) {
|
|
538
534
|
if (D !== t) {
|
|
539
|
-
let e = [...
|
|
540
|
-
e.splice(t, 0, n),
|
|
535
|
+
let e = [...R.columnOrder], [n] = e.splice(D, 1);
|
|
536
|
+
e.splice(t, 0, n), G(e);
|
|
541
537
|
}
|
|
542
538
|
O(null), A(null);
|
|
543
539
|
}
|
|
544
|
-
},
|
|
540
|
+
}, re = () => {
|
|
545
541
|
O(null), A(null);
|
|
546
|
-
},
|
|
542
|
+
}, ie = () => {}, ae = (e) => {
|
|
547
543
|
P(N === e ? null : e);
|
|
548
|
-
},
|
|
549
|
-
let
|
|
550
|
-
if (!
|
|
551
|
-
let
|
|
544
|
+
}, oe = (t) => {
|
|
545
|
+
let n = I.find((e) => e.id === t);
|
|
546
|
+
if (!n) return [];
|
|
547
|
+
let r = /* @__PURE__ */ new Map();
|
|
552
548
|
return e.forEach((e) => {
|
|
553
|
-
let t = typeof
|
|
554
|
-
|
|
555
|
-
}), Array.from(
|
|
549
|
+
let t = typeof n.accessor == "function" ? n.accessor(e) : e[n.accessor], i = formatCellValue(t);
|
|
550
|
+
r.set(i, (r.get(i) || 0) + 1);
|
|
551
|
+
}), Array.from(r.entries()).map(([e, t]) => ({
|
|
556
552
|
value: e,
|
|
557
553
|
count: t,
|
|
558
554
|
label: `${e} (${t})`
|
|
559
555
|
})).sort((e, t) => e.value.localeCompare(t.value));
|
|
560
|
-
},
|
|
556
|
+
}, se = Object.values(Y).some((e) => e.type === "text" && e.value || e.type === "select" && e.value || e.type === "multiselect" && Array.isArray(e.value) && e.value.length > 0);
|
|
561
557
|
useEffect(() => {
|
|
562
558
|
let e = (e) => {
|
|
563
559
|
F.current && !F.current.contains(e.target) && M(!1);
|
|
@@ -566,7 +562,7 @@ var AdvancedTable_default = ({ data: e, columns: n, defaultSort: a, defaultFilte
|
|
|
566
562
|
document.removeEventListener("mousedown", e);
|
|
567
563
|
};
|
|
568
564
|
}, [j]);
|
|
569
|
-
let $ = Math.ceil(
|
|
565
|
+
let $ = Math.ceil(X.total / X.pageSize);
|
|
570
566
|
return /* @__PURE__ */ jsxs("div", {
|
|
571
567
|
className: `w-full bg-redi-background border border-solid border-gray-500 rounded-xl overflow-hidden font-family-base shadow ${T}`,
|
|
572
568
|
children: [
|
|
@@ -593,21 +589,21 @@ var AdvancedTable_default = ({ data: e, columns: n, defaultSort: a, defaultFilte
|
|
|
593
589
|
children: E.columnVisibility
|
|
594
590
|
}), /* @__PURE__ */ jsx("div", {
|
|
595
591
|
className: "flex flex-col gap-2",
|
|
596
|
-
children:
|
|
592
|
+
children: I.map((e) => /* @__PURE__ */ jsxs("div", {
|
|
597
593
|
className: "flex items-center gap-2",
|
|
598
594
|
children: [/* @__PURE__ */ jsx("input", {
|
|
599
595
|
type: "checkbox",
|
|
600
596
|
className: "w-4 h-4 accent-redi-primary",
|
|
601
|
-
checked: !
|
|
602
|
-
onChange: () =>
|
|
597
|
+
checked: !Z.includes(e.id),
|
|
598
|
+
onChange: () => K(e.id)
|
|
603
599
|
}), /* @__PURE__ */ jsx("label", { children: e.label })]
|
|
604
600
|
}, e.id))
|
|
605
601
|
})]
|
|
606
602
|
})
|
|
607
603
|
})]
|
|
608
|
-
}), y &&
|
|
604
|
+
}), y && se && /* @__PURE__ */ jsx(Button_default, {
|
|
609
605
|
level: "icon",
|
|
610
|
-
onClick:
|
|
606
|
+
onClick: H,
|
|
611
607
|
label: E.clearAllFilters,
|
|
612
608
|
children: /* @__PURE__ */ jsx(CloseIcon, { color: "white" })
|
|
613
609
|
})]
|
|
@@ -615,7 +611,7 @@ var AdvancedTable_default = ({ data: e, columns: n, defaultSort: a, defaultFilte
|
|
|
615
611
|
className: "flex items-center gap-2",
|
|
616
612
|
children: x && /* @__PURE__ */ jsx(Button_default, {
|
|
617
613
|
level: "secondary",
|
|
618
|
-
onClick:
|
|
614
|
+
onClick: ie,
|
|
619
615
|
children: /* @__PURE__ */ jsx(DownloadIcon, { size: 18 })
|
|
620
616
|
})
|
|
621
617
|
})]
|
|
@@ -624,14 +620,14 @@ var AdvancedTable_default = ({ data: e, columns: n, defaultSort: a, defaultFilte
|
|
|
624
620
|
className: "overflow-x-auto max-h-[600px] min-h-[500px] overflow-y-auto bg-white relative",
|
|
625
621
|
children: /* @__PURE__ */ jsxs("table", {
|
|
626
622
|
className: "w-full border-collapse table-auto text-sm relative",
|
|
627
|
-
children: [/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children:
|
|
623
|
+
children: [/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: z.map((e, t) => /* @__PURE__ */ jsx("th", {
|
|
628
624
|
className: `bg-gray-50 border-b border-solid border-gray-200 text-left font-semibold text-redi-text p-0 sticky top-0 z-10 select-none hover:bg-gray-200 ${D === t ? "opacity-50 bg-gray-300" : ""} ${k === t ? "bg-redi-primary-bg border-l border-solid border-redi-primary" : ""}`,
|
|
629
625
|
draggable: !0,
|
|
630
|
-
onDragStart: (e) =>
|
|
631
|
-
onDragOver: (e) =>
|
|
632
|
-
onDragLeave:
|
|
633
|
-
onDrop: (e) =>
|
|
634
|
-
onDragEnd:
|
|
626
|
+
onDragStart: (e) => Q(e, t),
|
|
627
|
+
onDragOver: (e) => ee(e, t),
|
|
628
|
+
onDragLeave: te,
|
|
629
|
+
onDrop: (e) => ne(e, t),
|
|
630
|
+
onDragEnd: re,
|
|
635
631
|
children: /* @__PURE__ */ jsxs("div", {
|
|
636
632
|
className: "flex items-center py-3 px-4 gap-2 min-h-12",
|
|
637
633
|
children: [/* @__PURE__ */ jsx("div", {
|
|
@@ -642,36 +638,36 @@ var AdvancedTable_default = ({ data: e, columns: n, defaultSort: a, defaultFilte
|
|
|
642
638
|
children: [/* @__PURE__ */ jsxs("span", {
|
|
643
639
|
className: v ? "cursor-pointer py-1 px-1.5 rounded-sm flex items-center gap-1.5 text-sm font-semibold text-redi-text uppercase hover:bg-redi-text hover:text-redi-link-text" : "",
|
|
644
640
|
onClick: (t) => {
|
|
645
|
-
t.stopPropagation(), v &&
|
|
641
|
+
t.stopPropagation(), v && B(e.id);
|
|
646
642
|
},
|
|
647
|
-
children: [e.label, v &&
|
|
643
|
+
children: [e.label, v && J?.column === e.id && /* @__PURE__ */ jsx("span", {
|
|
648
644
|
className: "font-bold text-redi-link-text text-base",
|
|
649
|
-
children:
|
|
645
|
+
children: J.direction === "asc" ? " ↑" : " ↓"
|
|
650
646
|
})]
|
|
651
647
|
}), y && /* @__PURE__ */ jsxs("div", {
|
|
652
648
|
className: "relative",
|
|
653
649
|
children: [/* @__PURE__ */ jsx(Button_default, {
|
|
654
650
|
level: "icon",
|
|
655
651
|
onClick: (t) => {
|
|
656
|
-
t.stopPropagation(),
|
|
652
|
+
t.stopPropagation(), ae(e.id);
|
|
657
653
|
},
|
|
658
654
|
children: /* @__PURE__ */ jsx(FilterIcon, { size: 16 })
|
|
659
655
|
}), N === e.id && /* @__PURE__ */ jsx(AdvancedFilter_default, {
|
|
660
656
|
columnId: e.id,
|
|
661
657
|
label: e.label,
|
|
662
|
-
options:
|
|
663
|
-
textValue:
|
|
664
|
-
selectedValues:
|
|
665
|
-
onTextChange: (t) =>
|
|
666
|
-
onSelectionChange: (t) =>
|
|
658
|
+
options: oe(e.id),
|
|
659
|
+
textValue: Y[e.id]?.type === "text" ? String(Y[e.id].value || "") : "",
|
|
660
|
+
selectedValues: Y[e.id]?.type === "multiselect" && Array.isArray(Y[e.id]?.value) ? Y[e.id].value : [],
|
|
661
|
+
onTextChange: (t) => V(e.id, t, "text"),
|
|
662
|
+
onSelectionChange: (t) => V(e.id, t, "multiselect"),
|
|
667
663
|
onClose: () => P(null)
|
|
668
664
|
})]
|
|
669
665
|
})]
|
|
670
666
|
})]
|
|
671
667
|
})
|
|
672
|
-
}, e.id)) }) }), /* @__PURE__ */ jsx("tbody", { children:
|
|
668
|
+
}, e.id)) }) }), /* @__PURE__ */ jsx("tbody", { children: q.map((e, t) => /* @__PURE__ */ jsx("tr", {
|
|
673
669
|
className: "even:bg-gray-50 hover:bg-gray-100 border-b border-solid border-b-gray-100 odd:bg-white",
|
|
674
|
-
children:
|
|
670
|
+
children: z.map((n) => {
|
|
675
671
|
let r = typeof n.accessor == "function" ? n.accessor(e) : e[n.accessor];
|
|
676
672
|
return n.render ? /* @__PURE__ */ jsx("td", {
|
|
677
673
|
className: "py-3 px-4 text-redi-text font-normal leading-6 align-middle border-r border-solid border-r-gray-300 static table-cell last:border-r-0 first:font-medium",
|
|
@@ -691,15 +687,15 @@ var AdvancedTable_default = ({ data: e, columns: n, defaultSort: a, defaultFilte
|
|
|
691
687
|
children: /* @__PURE__ */ jsxs("span", { children: [
|
|
692
688
|
E.pagination?.showingItems,
|
|
693
689
|
" ",
|
|
694
|
-
(
|
|
690
|
+
(X.page - 1) * X.pageSize + 1,
|
|
695
691
|
" ",
|
|
696
692
|
E.pagination?.to,
|
|
697
693
|
" ",
|
|
698
|
-
Math.min(
|
|
694
|
+
Math.min(X.page * X.pageSize, X.total),
|
|
699
695
|
" ",
|
|
700
696
|
E.pagination?.of,
|
|
701
697
|
" ",
|
|
702
|
-
|
|
698
|
+
X.total,
|
|
703
699
|
" ",
|
|
704
700
|
E.pagination?.items
|
|
705
701
|
] })
|
|
@@ -710,8 +706,8 @@ var AdvancedTable_default = ({ data: e, columns: n, defaultSort: a, defaultFilte
|
|
|
710
706
|
children: [
|
|
711
707
|
E.pagination?.showPerPage,
|
|
712
708
|
/* @__PURE__ */ jsx("select", {
|
|
713
|
-
value:
|
|
714
|
-
onChange: (e) =>
|
|
709
|
+
value: X.pageSize,
|
|
710
|
+
onChange: (e) => W(Number(e.target.value)),
|
|
715
711
|
className: "py-1.5 px-2.5 border border-solid border-gray-300 rounded-md bg-white text-redi-text focus:outline-none focus:ring-2 focus:ring-redi-primary",
|
|
716
712
|
children: _.map((e) => /* @__PURE__ */ jsx("option", {
|
|
717
713
|
value: e,
|
|
@@ -725,34 +721,34 @@ var AdvancedTable_default = ({ data: e, columns: n, defaultSort: a, defaultFilte
|
|
|
725
721
|
children: [
|
|
726
722
|
/* @__PURE__ */ jsx(Button_default, {
|
|
727
723
|
level: "icon",
|
|
728
|
-
onClick: () =>
|
|
729
|
-
disabled:
|
|
724
|
+
onClick: () => U(1),
|
|
725
|
+
disabled: X.page === 1,
|
|
730
726
|
children: "<<"
|
|
731
727
|
}),
|
|
732
728
|
/* @__PURE__ */ jsx(Button_default, {
|
|
733
729
|
level: "icon",
|
|
734
|
-
onClick: () =>
|
|
735
|
-
disabled:
|
|
730
|
+
onClick: () => U(X.page - 1),
|
|
731
|
+
disabled: X.page === 1,
|
|
736
732
|
children: "<"
|
|
737
733
|
}),
|
|
738
734
|
Array.from({ length: Math.min(3, $) }, (e, t) => {
|
|
739
735
|
let n;
|
|
740
|
-
return n = $ <= 3 ||
|
|
741
|
-
level:
|
|
742
|
-
onClick: () =>
|
|
736
|
+
return n = $ <= 3 || X.page <= 2 ? t + 1 : X.page > $ - 2 ? $ - 2 + t : X.page - 1 + t, /* @__PURE__ */ jsx(Button_default, {
|
|
737
|
+
level: X.page === n ? "primary" : "secondary",
|
|
738
|
+
onClick: () => U(n),
|
|
743
739
|
children: n
|
|
744
740
|
}, n);
|
|
745
741
|
}),
|
|
746
742
|
/* @__PURE__ */ jsx(Button_default, {
|
|
747
743
|
level: "icon",
|
|
748
|
-
onClick: () =>
|
|
749
|
-
disabled:
|
|
744
|
+
onClick: () => U(X.page + 1),
|
|
745
|
+
disabled: X.page === $,
|
|
750
746
|
children: ">"
|
|
751
747
|
}),
|
|
752
748
|
/* @__PURE__ */ jsx(Button_default, {
|
|
753
749
|
level: "icon",
|
|
754
|
-
onClick: () =>
|
|
755
|
-
disabled:
|
|
750
|
+
onClick: () => U($),
|
|
751
|
+
disabled: X.page === $,
|
|
756
752
|
children: ">>"
|
|
757
753
|
})
|
|
758
754
|
]
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react`),require(`react/jsx-runtime`)):typeof define==`function`&&define.amd?define([`exports`,`react`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`redi-components`]={},e.React,e[`react/jsxRuntime`]))})(this,function(e,t,n){var r=Object.create,i=Object.defineProperty,a=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyNames,s=Object.getPrototypeOf,c=Object.prototype.hasOwnProperty,l=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var s=o(t),l=0,u=s.length,d;l<u;l++)d=s[l],!c.call(e,d)&&d!==n&&i(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=a(t,d))||r.enumerable});return e},u=(e,t,n)=>(n=e==null?{}:r(s(e)),l(t||!e||!e.__esModule?i(n,`default`,{value:e,enumerable:!0}):n,e));t=u(t),n=u(n);let d=({color:e,size:t=24})=>(0,n.jsx)(`svg`,{width:t,height:t,viewBox:`0 0 20 20`,fill:e,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M3 17a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm3.293-7.707a1 1 0 011.414 0L9 10.586V3a1 1 0 112 0v7.586l1.293-1.293a1 1 0 111.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z`,clipRule:`evenodd`,fill:`currentColor`})}),f=({color:e,size:t=20})=>(0,n.jsxs)(`svg`,{viewBox:`0 0 20 20`,fill:e,width:t,height:t,children:[(0,n.jsx)(`path`,{d:`M10 12a2 2 0 100-4 2 2 0 000 4z`,fill:`currentColor`}),(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M.458 10C1.732 5.943 5.522 3 10 3s8.268 2.943 9.542 7c-1.274 4.057-5.064 7-9.542 7S1.732 14.057.458 10zM14 10a4 4 0 11-8 0 4 4 0 018 0z`,clipRule:`evenodd`,fill:`currentColor`})]}),p=({color:e,size:t=24})=>(0,n.jsx)(`svg`,{fill:e,stroke:`currentColor`,viewBox:`0 0 24 24`,width:t,height:t,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M3 3a1 1 0 011-1h12a1 1 0 011 1v3a1 1 0 01-.293.707L12 11.414V15a1 1 0 01-.293.707l-2 2A1 1 0 018 17v-5.586L3.293 6.707A1 1 0 013 6V3z`,clipRule:`evenodd`,fill:`currentColor`})}),m=e=>e==null?``:typeof e==`boolean`?e?`Sí`:`No`:typeof e==`number`?e.toLocaleString():e instanceof Date?e.toLocaleDateString():String(e),h=({color:e,size:t=20})=>(0,n.jsx)(`svg`,{fill:e,width:t,height:t,viewBox:`0 0 20 20`,children:(0,n.jsx)(`path`,{fillRule:`evenodd`,d:`M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z`,clipRule:`evenodd`,fill:`currentColor`})});var g=({level:e=`primary`,size:t=`medium`,type:r=`button`,posIcon:i=`left`,disabled:a=!1,label:o,icon:s,children:c,...l})=>{let u=`disabled:text-redi-disabled-text disabled:border-redi-disabled-border disabled:cursor-not-allowed`,d={primary:`bg-redi-primary-bg hover:bg-redi-primary-bg-hover text-redi-primary-text active:ring-2 active:ring-redi-primary-bg-active active:border-[1px] active:border-white active:border-solid disabled:bg-redi-disabled-bg ${u}`,secondary:`bg-redi-secondary-bg hover:bg-redi-secondary-bg-hover text-redi-secondary-text active:ring-2 active:ring-redi-secondary-bg-active active:border-[1px] active:border-white active:border-solid border-1 border-solid disabled:bg-redi-disabled-bg ${u}`,tertiary:`bg-redi-tertiary-bg hover:bg-redi-tertiary-bg-hover text-redi-tertiary-text active:ring-2 active:ring-redi-tertiary-bg-active active:border-[1px] active:border-white active:border-solid disabled:bg-redi-disabled-bg ${u}`,link:`bg-transparent hover:bg-redi-link-bg text-redi-link-text active:ring-2 active:ring-redi-link-bg-active active:border-[1px] active:border-white active:border-solid underline underline-offset-4 ${u}`,icon:`bg-transparent hover:bg-redi-icon-bg text-redi-icon-text active:ring-2 active:ring-redi-icon-bg-active active:border-[1px] active:border-white active:border-solid ${u}`};return(0,n.jsx)(`button`,{type:r,name:`button-${o}`,disabled:a,className:`cursor-pointer rounded-lg font-family-base transition-all duration-200 ${d[e]} ${{small:`px-3 py-1 text-sm`,medium:`px-4 py-2 text-xs`,large:`px-6 py-3 text-lg`}[t]} flex gap-x-1 items-center justify-center`,...l,children:c||(0,n.jsxs)(n.Fragment,{children:[s&&i===`left`&&s,o&&e!==`icon`&&(0,n.jsx)(`span`,{children:o}),s&&i===`right`&&s]})})},_={controls:`_controls_1pwn9_1`,leftControls:`_leftControls_1pwn9_10`,rightControls:`_rightControls_1pwn9_16`,configButton:`_configButton_1pwn9_23`,configIcon:`_configIcon_1pwn9_42`,configSection:`_configSection_1pwn9_49`,configSectionTitle:`_configSectionTitle_1pwn9_57`,configOptions:`_configOptions_1pwn9_66`,configOption:`_configOption_1pwn9_66`,actionButton:`_actionButton_1pwn9_91`,export:`_export_1pwn9_110`,reset:`_reset_1pwn9_120`,buttonIcon:`_buttonIcon_1pwn9_130`,filtersContainer:`_filtersContainer_1pwn9_137`,active:`_active_1pwn9_145`,filtersRow:`_filtersRow_1pwn9_149`,filterGroup:`_filterGroup_1pwn9_156`,filterLabel:`_filterLabel_1pwn9_162`,filterDropdown:`_filterDropdown_1pwn9_172`,filterDropdownButton:`_filterDropdownButton_1pwn9_177`,filterDropdownIcon:`_filterDropdownIcon_1pwn9_200`,filterModalHeader:`_filterModalHeader_1pwn9_212`,filterSearchInput:`_filterSearchInput_1pwn9_217`,filterOptions:`_filterOptions_1pwn9_231`,filterOption:`_filterOption_1pwn9_231`,selected:`_selected_1pwn9_250`,filterOptionCheckbox:`_filterOptionCheckbox_1pwn9_254`,filterOptionLabel:`_filterOptionLabel_1pwn9_260`,filterOptionCount:`_filterOptionCount_1pwn9_266`,filterModalActions:`_filterModalActions_1pwn9_275`,filterClearButton:`_filterClearButton_1pwn9_284`,filterApplyButton:`_filterApplyButton_1pwn9_285`,tableWrapper:`_tableWrapper_1pwn9_315`,table:`_table_1pwn9_315`,header:`_header_1pwn9_332`,dragging:`_dragging_1pwn9_349`,dragOver:`_dragOver_1pwn9_354`,headerContent:`_headerContent_1pwn9_359`,dragHandle:`_dragHandle_1pwn9_367`,columnTitle:`_columnTitle_1pwn9_384`,sortable:`_sortable_1pwn9_391`,sortIcon:`_sortIcon_1pwn9_408`,filterButton:`_filterButton_1pwn9_415`,filterButtonIcon:`_filterButtonIcon_1pwn9_451`,filterModal:`_filterModal_1pwn9_212`,row:`_row_1pwn9_474`,cell:`_cell_1pwn9_486`,statusBadge:`_statusBadge_1pwn9_507`,statusActive:`_statusActive_1pwn9_517`,statusInactive:`_statusInactive_1pwn9_522`,statusPending:`_statusPending_1pwn9_527`,statusCompleted:`_statusCompleted_1pwn9_532`,statusDraft:`_statusDraft_1pwn9_537`,pagination:`_pagination_1pwn9_543`,paginationInfo:`_paginationInfo_1pwn9_553`,paginationControls:`_paginationControls_1pwn9_560`,pageSizeSelect:`_pageSizeSelect_1pwn9_575`,pageButtons:`_pageButtons_1pwn9_591`,pageButton:`_pageButton_1pwn9_591`,exportButton:`_exportButton_1pwn9_659`,resetButton:`_resetButton_1pwn9_660`,filterModalSlideIn:`_filterModalSlideIn_1pwn9_1`,shimmer:`_shimmer_1pwn9_1`,columnCheckboxes:`_columnCheckboxes_1pwn9_1195`},v=({option:e,selectedValues:t,handleOptionToggle:r})=>(0,n.jsxs)(`div`,{className:`${_.filterOption} ${t.includes(e.value)?_.selected:``}`,onClick:()=>r(e),children:[(0,n.jsx)(`input`,{type:`checkbox`,className:_.filterOptionCheckbox,checked:t.includes(e.value),onChange:()=>r(e),onClick:e=>e.stopPropagation()}),(0,n.jsx)(`span`,{className:_.filterOptionLabel,children:e.value}),(0,n.jsx)(`span`,{className:_.filterOptionCount,children:e.count})]},e.value),y=({label:e,options:r,textValue:i,selectedValues:a,onTextChange:o,onSelectionChange:s,onClose:c})=>{let[l,u]=(0,t.useState)(``),d=(0,t.useRef)(null),f=r.filter(e=>e.value.toLowerCase().includes(l.toLowerCase())||e.label.toLowerCase().includes(l.toLowerCase())),p=e=>{let t=a.includes(e.value)?a.filter(t=>t!==e.value):[...a,e.value];s(t)},m=()=>{let e=f.map(e=>e.value);s(e)},h=()=>{s([]),o(``)};return(0,t.useEffect)(()=>{let e=e=>{d.current&&!d.current.contains(e.target)&&c()};return document.addEventListener(`mousedown`,e),()=>{document.removeEventListener(`mousedown`,e)}},[c]),(0,n.jsxs)(`div`,{className:_.filterModal,ref:d,children:[(0,n.jsxs)(`div`,{className:_.filterModalHeader,children:[(0,n.jsx)(`input`,{type:`text`,className:_.filterSearchInput,placeholder:`Buscar texto en ${e.toLowerCase()}...`,value:i,onChange:e=>o(e.target.value),autoFocus:!0}),(0,n.jsx)(`input`,{type:`text`,className:_.filterSearchInput,placeholder:`Buscar opciones...`,value:l,onChange:e=>u(e.target.value),style:{marginTop:`8px`}})]}),(0,n.jsxs)(`div`,{className:_.filterOptions,children:[(0,n.jsxs)(`div`,{className:_.filterOption,style:{borderBottom:`1px solid #e5e7eb`,marginBottom:`4px`,paddingBottom:`8px`},children:[(0,n.jsx)(g,{onClick:m,size:`small`,level:`tertiary`,children:`Seleccionar todo`}),(0,n.jsx)(g,{onClick:h,size:`small`,level:`tertiary`,children:`Limpiar todo`})]}),f.map(e=>(0,n.jsx)(v,{option:e,selectedValues:a,handleOptionToggle:p},e.value)),f.length===0&&(0,n.jsx)(`div`,{className:_.filterOption,children:(0,n.jsx)(`span`,{className:_.filterOptionLabel,children:`No se encontraron opciones`})})]}),(0,n.jsxs)(`div`,{className:_.filterModalActions,children:[(0,n.jsx)(g,{onClick:h,level:`tertiary`,children:`Limpiar todo`}),(0,n.jsxs)(g,{onClick:c,level:`primary`,children:[`Aplicar (`,a.length+(i?1:0),`)`]})]})]})};
|
|
2
2
|
/*! js-cookie v3.0.5 | MIT */
|
|
3
|
-
function b(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)e[r]=n[r]}return e}var x={read:function(e){return e[0]===`"`&&(e=e.slice(1,-1)),e.replace(/(%[\dA-F]{2})+/gi,decodeURIComponent)},write:function(e){return encodeURIComponent(e).replace(/%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,decodeURIComponent)}};function S(e,t){function n(n,r,i){if(!(typeof document>`u`)){i=b({},t,i),typeof i.expires==`number`&&(i.expires=new Date(Date.now()+i.expires*864e5)),i.expires&&=i.expires.toUTCString(),n=encodeURIComponent(n).replace(/%(2[346B]|5E|60|7C)/g,decodeURIComponent).replace(/[()]/g,escape);var a=``;for(var o in i)i[o]&&(a+=`; `+o,i[o]!==!0&&(a+=`=`+i[o].split(`;`)[0]));return document.cookie=n+`=`+e.write(r,n)+a}}function r(t){if(!(typeof document>`u`||arguments.length&&!t)){for(var n=document.cookie?document.cookie.split(`; `):[],r={},i=0;i<n.length;i++){var a=n[i].split(`=`),o=a.slice(1).join(`=`);try{var s=decodeURIComponent(a[0]);if(r[s]=e.read(o,s),t===s)break}catch{}}return t?r[t]:r}}return Object.create({set:n,get:r,remove:function(e,t){n(e,``,b({},t,{expires:-1}))},withAttributes:function(e){return S(this.converter,b({},this.attributes,e))},withConverter:function(e){return S(b({},this.converter,e),this.attributes)}},{attributes:{value:Object.freeze(t)},converter:{value:Object.freeze(e)}})}var C=S(x,{path:`/`}),w=30;let T=e=>{let{data:n,columns:r,defaultSort:i,defaultFilters:a={},defaultPageSize:o=10,pageSizeOptions:s=[10,25,50,100,200,300,400,500],persistConfig:c=!0,configKey:l=`advanced-table-config`,onConfigChange:u}=e,d=(0,t.useCallback)(()=>{if(!c)return null;try{let e=C.get(l);return e?JSON.parse(e):null}catch(e){return console.warn(`Error loading table config from cookies:`,e),null}},[c,l]),f=(0,t.useCallback)(e=>{if(c)try{C.set(l,JSON.stringify(e),{expires:w})}catch(e){console.warn(`Error saving table config to cookies:`,e)}},[c,l]),p=d(),[m,h]=(0,t.useState)(p?.sortConfig||i||void 0),[g,_]=(0,t.useState)(p?.filters||a),[v,y]=(0,t.useState)(p?.columnOrder||r.map(e=>e.id)),[b,x]=(0,t.useState)(p?.hiddenColumns||[]),[S,T]=(0,t.useState)({page:1,pageSize:p?.pagination?.pageSize||o,total:n.length});(0,t.useEffect)(()=>{let e=r.map(e=>e.id);y(t=>{let n=t.filter(t=>e.includes(t)),r=e.filter(e=>!n.includes(e));return[...n,...r]}),x(t=>t.filter(t=>e.includes(t)))},[r]);let E=(0,t.useMemo)(()=>{let e=[...n];return Object.entries(g).forEach(([t,n])=>{let i=r.find(e=>e.id===t);i&&(e=e.filter(e=>{let t=typeof i.accessor==`function`?i.accessor(e):e[i.accessor],r=String(t||``).toLowerCase(),a=!0;return n.type===`text`&&n.value&&(a&&=r.includes(String(n.value).toLowerCase())),n.type===`select`&&n.value&&(a&&=r===String(n.value).toLowerCase()),n.type===`multiselect`&&Array.isArray(n.value)&&n.value.length>0&&(a&&=n.value.some(e=>r===String(e).toLowerCase())),a}))}),e},[n,g,r]),D=(0,t.useMemo)(()=>{if(!m)return E;let e=r.find(e=>e.id===m.column);return e?[...E].sort((t,n)=>{let r=typeof e.accessor==`function`?e.accessor(t):t[e.accessor],i=typeof e.accessor==`function`?e.accessor(n):n[e.accessor];if(r==null)return 1;if(i==null)return-1;let a=0;if(typeof r==`number`&&typeof i==`number`)a=r-i;else if(typeof r==`boolean`&&typeof i==`boolean`)a=r===i?0:r?1:-1;else if(r instanceof Date&&i instanceof Date)a=r.getTime()-i.getTime();else{let e=String(r).toLowerCase(),t=String(i).toLowerCase();a=e.localeCompare(t)}return m.direction===`desc`?a*-1:a}):E},[E,m,r]),O=(0,t.useMemo)(()=>{let e=(S.page-1)*S.pageSize,t=e+S.pageSize;return D.slice(e,t)},[D,S.page,S.pageSize]);(0,t.useEffect)(()=>{T(e=>({...e,total:E.length,page:Math.min(e.page,Math.ceil(E.length/e.pageSize)||1)}))},[E.length]),(0,t.useEffect)(()=>{let e={sort:m,filters:g,columnOrder:v,hiddenColumns:b,pageSize:S.pageSize};f(e),u?.({sort:m,filters:g,pagination:S,columnOrder:v,hiddenColumns:b,columns:r})},[m,g,v,b,S.pageSize,f,u,S,r]);let k=(0,t.useCallback)(e=>{h(t=>t?.column===e?t.direction===`asc`?{column:e,direction:`desc`}:void 0:{column:e,direction:`asc`})},[]),A=(0,t.useCallback)((e,t,n=`text`)=>{_(r=>({...r,[e]:{type:n,value:t,options:r[e]?.options}})),T(e=>({...e,page:1}))},[]),j=(0,t.useCallback)(e=>{_(t=>{let n={...t};return delete n[e],n})},[]),M=(0,t.useCallback)(()=>{_({})},[]),N=(0,t.useCallback)(e=>{T(t=>({...t,page:e}))},[]),P=(0,t.useCallback)(e=>{T(t=>({...t,pageSize:e,page:1}))},[]),F=(0,t.useCallback)(e=>{y(e)},[]),I=(0,t.useCallback)(e=>{x(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e])},[]),L=(0,t.useMemo)(()=>v.map(e=>r.find(t=>t.id===e)).filter(Boolean).filter(e=>!b.includes(e.id)),[v,r,b]);return{state:{data:n,filteredData:E,paginatedData:O,sortConfig:m,filters:g,pagination:S,columnOrder:v,hiddenColumns:b,loading:!1},orderedColumns:L,pageSizeOptions:s,handleSort:k,handleFilter:A,clearFilter:j,clearAllFilters:M,handlePageChange:N,handlePageSizeChange:P,handleColumnReorder:F,handleToggleColumn:I,allColumns:r}};e.AdvancedTable=({data:e,columns:r,defaultSort:i,defaultFilters:a={},defaultPageSize:o=10,pageSizeOptions:s=[10,25,50,100,200,300,400,500],enableSorting:c=!0,enableFiltering:l=!0,enablePagination:u=!0,enableExport:_=!0,persistConfig:v=!0,configKey:b=`advancedTable`,className:x=``,labels:S={configuration:`Configuración`,columnVisibility:`Columnas visibles`,pagination:{showingItems:`Mostrando`,to:`a`,of:`de`,items:`elementos`,showPerPage:`Mostrar`,perPageItems:`elementos`},clearAllFilters:`Limpiar todos los filtros`}})=>{let[C,w]=(0,t.useState)(null),[E,D]=(0,t.useState)(null),[O,k]=(0,t.useState)(!1),[A,j]=(0,t.useState)(null),M=(0,t.useRef)(null),{state:N,orderedColumns:P,handleSort:F,handleFilter:I,clearAllFilters:L,handlePageChange:R,handlePageSizeChange:z,handleColumnReorder:B,handleToggleColumn:V,allColumns:H}=T({data:e,columns:r,defaultSort:i,defaultFilters:a,defaultPageSize:o,pageSizeOptions:s,persistConfig:v,configKey:b}),{paginatedData:U,sortConfig:W,filters:G,pagination:K,hiddenColumns:q}=N;(0,t.useEffect)(()=>{H.forEach(e=>{r.find(t=>t.id===e.id)||r.push(e)})},[H,r]);let J=(e,t)=>{w(t),e.dataTransfer.effectAllowed=`move`,e.dataTransfer.setData(`text/html`,``)},Y=(e,t)=>{e.preventDefault(),e.dataTransfer.dropEffect=`move`,D(t)},X=()=>{D(null)},Z=(e,t)=>{if(e.preventDefault(),C!==null){if(C!==t){let e=[...N.columnOrder],[n]=e.splice(C,1);e.splice(t,0,n),B(e)}w(null),D(null)}},Q=()=>{w(null),D(null)},ee=()=>{},te=e=>{j(A===e?null:e)},ne=t=>{let n=r.find(e=>e.id===t);if(!n)return[];let i=new Map;return e.forEach(e=>{let t=typeof n.accessor==`function`?n.accessor(e):e[n.accessor],r=m(t);i.set(r,(i.get(r)||0)+1)}),Array.from(i.entries()).map(([e,t])=>({value:e,count:t,label:`${e} (${t})`})).sort((e,t)=>e.value.localeCompare(t.value))},re=Object.values(G).some(e=>e.type===`text`&&e.value||e.type===`select`&&e.value||e.type===`multiselect`&&Array.isArray(e.value)&&e.value.length>0);(0,t.useEffect)(()=>{let e=e=>{M.current&&!M.current.contains(e.target)&&k(!1)};return O&&document.addEventListener(`mousedown`,e),()=>{document.removeEventListener(`mousedown`,e)}},[O]);let $=Math.ceil(K.total/K.pageSize);return(0,n.jsxs)(`div`,{className:`w-full bg-redi-background border border-solid border-gray-500 rounded-xl overflow-hidden font-family-base shadow ${x}`,children:[(0,n.jsxs)(`div`,{className:`flex items-center justify-between p-4 bg-transparent border-b border-solid border-gray-400`,children:[(0,n.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,n.jsxs)(`div`,{className:`relative`,children:[(0,n.jsxs)(g,{level:`secondary`,onClick:()=>k(!O),children:[(0,n.jsx)(f,{}),(0,n.jsx)(`span`,{className:`hidden md:block`,children:S.configuration})]}),O&&(0,n.jsx)(`div`,{className:`absolute top-full left-0 bg-white border border-solid border-gray-300 rounded-md shadow-lg z-1000 mt-2 min-w-2xs max-w-xs opacity-100 visible p-4`,ref:M,children:(0,n.jsxs)(`div`,{className:`mb-4 last:mb-0`,children:[(0,n.jsx)(`div`,{className:`text-sm font-semibold text-redi-text mb-2 uppercase`,children:S.columnVisibility}),(0,n.jsx)(`div`,{className:`flex flex-col gap-2`,children:r.map(e=>(0,n.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,n.jsx)(`input`,{type:`checkbox`,className:`w-4 h-4 accent-redi-primary`,checked:!q.includes(e.id),onChange:()=>V(e.id)}),(0,n.jsx)(`label`,{children:e.label})]},e.id))})]})})]}),l&&re&&(0,n.jsx)(g,{level:`icon`,onClick:L,label:S.clearAllFilters,children:(0,n.jsx)(h,{color:`white`})})]}),(0,n.jsx)(`div`,{className:`flex items-center gap-2`,children:_&&(0,n.jsx)(g,{level:`secondary`,onClick:ee,children:(0,n.jsx)(d,{size:18})})})]}),(0,n.jsx)(`div`,{className:`overflow-x-auto max-h-[600px] min-h-[500px] overflow-y-auto bg-white relative`,children:(0,n.jsxs)(`table`,{className:`w-full border-collapse table-auto text-sm relative`,children:[(0,n.jsx)(`thead`,{children:(0,n.jsx)(`tr`,{children:P.map((e,t)=>(0,n.jsx)(`th`,{className:`bg-gray-50 border-b border-solid border-gray-200 text-left font-semibold text-redi-text p-0 sticky top-0 z-10 select-none hover:bg-gray-200 ${C===t?`opacity-50 bg-gray-300`:``} ${E===t?`bg-redi-primary-bg border-l border-solid border-redi-primary`:``}`,draggable:!0,onDragStart:e=>J(e,t),onDragOver:e=>Y(e,t),onDragLeave:X,onDrop:e=>Z(e,t),onDragEnd:Q,children:(0,n.jsxs)(`div`,{className:`flex items-center py-3 px-4 gap-2 min-h-12`,children:[(0,n.jsx)(`div`,{className:`text-gray-600 cursor-grab opacity-70 hover:opacity-100 text-base`,children:`⋮⋮`}),(0,n.jsxs)(`div`,{className:`flex flex-1 items-center gap-2`,children:[(0,n.jsxs)(`span`,{className:c?`cursor-pointer py-1 px-1.5 rounded-sm flex items-center gap-1.5 text-sm font-semibold text-redi-text uppercase hover:bg-redi-text hover:text-redi-link-text`:``,onClick:t=>{t.stopPropagation(),c&&F(e.id)},children:[e.label,c&&W?.column===e.id&&(0,n.jsx)(`span`,{className:`font-bold text-redi-link-text text-base`,children:W.direction===`asc`?` ↑`:` ↓`})]}),l&&(0,n.jsxs)(`div`,{className:`relative`,children:[(0,n.jsx)(g,{level:`icon`,onClick:t=>{t.stopPropagation(),te(e.id)},children:(0,n.jsx)(p,{size:16})}),A===e.id&&(0,n.jsx)(y,{columnId:e.id,label:e.label,options:ne(e.id),textValue:G[e.id]?.type===`text`?String(G[e.id].value||``):``,selectedValues:G[e.id]?.type===`multiselect`&&Array.isArray(G[e.id]?.value)?G[e.id].value:[],onTextChange:t=>I(e.id,t,`text`),onSelectionChange:t=>I(e.id,t,`multiselect`),onClose:()=>j(null)})]})]})]})},e.id))})}),(0,n.jsx)(`tbody`,{children:U.map((e,t)=>(0,n.jsx)(`tr`,{className:`even:bg-gray-50 hover:bg-gray-100 border-b border-solid border-b-gray-100 odd:bg-white`,children:P.map(r=>{let i=typeof r.accessor==`function`?r.accessor(e):e[r.accessor];return r.render?(0,n.jsx)(`td`,{className:`py-3 px-4 text-redi-text font-normal leading-6 align-middle border-r border-solid border-r-gray-300 static table-cell last:border-r-0 first:font-medium`,children:r.render(i,e,t)},r.id):(0,n.jsx)(`td`,{className:`py-3 px-4 text-redi-text font-normal leading-6 align-middle border-r border-solid border-r-gray-300 static table-cell last:border-r-0 first:font-medium`,children:m(i)},r.id)})},t))})]})}),u&&(0,n.jsxs)(`div`,{className:`flex items-center justify-between py-4 px-6 bg-white border-t-gray-300 border-solid border-t gap-4`,children:[(0,n.jsx)(`div`,{className:`text-redi-text text-base font-medium shrink-0`,children:(0,n.jsxs)(`span`,{children:[S.pagination?.showingItems,` `,(K.page-1)*K.pageSize+1,` `,S.pagination?.to,` `,Math.min(K.page*K.pageSize,K.total),` `,S.pagination?.of,` `,K.total,` `,S.pagination?.items]})}),(0,n.jsxs)(`div`,{className:`flex items-center gap-5`,children:[(0,n.jsxs)(`label`,{className:`flex items-center gap-3 text-sm font-semibold text-redi-text`,children:[S.pagination?.showPerPage,(0,n.jsx)(`select`,{value:K.pageSize,onChange:e=>z(Number(e.target.value)),className:`py-1.5 px-2.5 border border-solid border-gray-300 rounded-md bg-white text-redi-text focus:outline-none focus:ring-2 focus:ring-redi-primary`,children:s.map(e=>(0,n.jsx)(`option`,{value:e,children:e},e))}),S.pagination?.perPageItems]}),(0,n.jsxs)(`div`,{className:`flex gap-1 items-center`,children:[(0,n.jsx)(g,{level:`icon`,onClick:()=>R(1),disabled:K.page===1,children:`<<`}),(0,n.jsx)(g,{level:`icon`,onClick:()=>R(K.page-1),disabled:K.page===1,children:`<`}),Array.from({length:Math.min(3,$)},(e,t)=>{let r;return r=$<=3||K.page<=2?t+1:K.page>$-2?$-2+t:K.page-1+t,(0,n.jsx)(g,{level:K.page===r?`primary`:`secondary`,onClick:()=>R(r),children:r},r)}),(0,n.jsx)(g,{level:`icon`,onClick:()=>R(K.page+1),disabled:K.page===$,children:`>`}),(0,n.jsx)(g,{level:`icon`,onClick:()=>R($),disabled:K.page===$,children:`>>`})]})]})]})]})},e.Button=g});
|
|
3
|
+
function b(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)e[r]=n[r]}return e}var x={read:function(e){return e[0]===`"`&&(e=e.slice(1,-1)),e.replace(/(%[\dA-F]{2})+/gi,decodeURIComponent)},write:function(e){return encodeURIComponent(e).replace(/%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,decodeURIComponent)}};function S(e,t){function n(n,r,i){if(!(typeof document>`u`)){i=b({},t,i),typeof i.expires==`number`&&(i.expires=new Date(Date.now()+i.expires*864e5)),i.expires&&=i.expires.toUTCString(),n=encodeURIComponent(n).replace(/%(2[346B]|5E|60|7C)/g,decodeURIComponent).replace(/[()]/g,escape);var a=``;for(var o in i)i[o]&&(a+=`; `+o,i[o]!==!0&&(a+=`=`+i[o].split(`;`)[0]));return document.cookie=n+`=`+e.write(r,n)+a}}function r(t){if(!(typeof document>`u`||arguments.length&&!t)){for(var n=document.cookie?document.cookie.split(`; `):[],r={},i=0;i<n.length;i++){var a=n[i].split(`=`),o=a.slice(1).join(`=`);try{var s=decodeURIComponent(a[0]);if(r[s]=e.read(o,s),t===s)break}catch{}}return t?r[t]:r}}return Object.create({set:n,get:r,remove:function(e,t){n(e,``,b({},t,{expires:-1}))},withAttributes:function(e){return S(this.converter,b({},this.attributes,e))},withConverter:function(e){return S(b({},this.converter,e),this.attributes)}},{attributes:{value:Object.freeze(t)},converter:{value:Object.freeze(e)}})}var C=S(x,{path:`/`}),w=30;let T=e=>{let{data:n,columns:r,defaultSort:i,defaultFilters:a={},defaultPageSize:o=10,pageSizeOptions:s=[10,25,50,100,200,300,400,500],persistConfig:c=!0,configKey:l=`advanced-table-config`,onConfigChange:u}=e,d=(0,t.useCallback)(()=>{if(!c)return null;try{let e=C.get(l);return e?JSON.parse(e):null}catch(e){return console.warn(`Error loading table config from cookies:`,e),null}},[c,l]),f=(0,t.useCallback)(e=>{if(c)try{C.set(l,JSON.stringify(e),{expires:w})}catch(e){console.warn(`Error saving table config to cookies:`,e)}},[c,l]),p=d(),[m,h]=(0,t.useState)(p?.sortConfig||i||void 0),[g,_]=(0,t.useState)(p?.filters||a),[v,y]=(0,t.useState)(p?.columnOrder||r.map(e=>e.id)),[b,x]=(0,t.useState)(p?.hiddenColumns||[]),[S,T]=(0,t.useState)({page:1,pageSize:p?.pagination?.pageSize||o,total:n.length});(0,t.useEffect)(()=>{let e=r.map(e=>e.id);y(t=>{let n=t.filter(t=>e.includes(t)),r=e.filter(e=>!n.includes(e));return[...n,...r]}),x(t=>t.filter(t=>e.includes(t)))},[r]);let E=(0,t.useMemo)(()=>{let e=[...n];return Object.entries(g).forEach(([t,n])=>{let i=r.find(e=>e.id===t);i&&(e=e.filter(e=>{let t=typeof i.accessor==`function`?i.accessor(e):e[i.accessor],r=String(t||``).toLowerCase(),a=!0;return n.type===`text`&&n.value&&(a&&=r.includes(String(n.value).toLowerCase())),n.type===`select`&&n.value&&(a&&=r===String(n.value).toLowerCase()),n.type===`multiselect`&&Array.isArray(n.value)&&n.value.length>0&&(a&&=n.value.some(e=>r===String(e).toLowerCase())),a}))}),e},[n,g,r]),D=(0,t.useMemo)(()=>{if(!m)return E;let e=r.find(e=>e.id===m.column);return e?[...E].sort((t,n)=>{let r=typeof e.accessor==`function`?e.accessor(t):t[e.accessor],i=typeof e.accessor==`function`?e.accessor(n):n[e.accessor];if(r==null)return 1;if(i==null)return-1;let a=0;if(typeof r==`number`&&typeof i==`number`)a=r-i;else if(typeof r==`boolean`&&typeof i==`boolean`)a=r===i?0:r?1:-1;else if(r instanceof Date&&i instanceof Date)a=r.getTime()-i.getTime();else{let e=String(r).toLowerCase(),t=String(i).toLowerCase();a=e.localeCompare(t)}return m.direction===`desc`?a*-1:a}):E},[E,m,r]),O=(0,t.useMemo)(()=>{let e=(S.page-1)*S.pageSize,t=e+S.pageSize;return D.slice(e,t)},[D,S.page,S.pageSize]);(0,t.useEffect)(()=>{T(e=>({...e,total:E.length,page:Math.min(e.page,Math.ceil(E.length/e.pageSize)||1)}))},[E.length]),(0,t.useEffect)(()=>{let e={sort:m,filters:g,columnOrder:v,hiddenColumns:b,pageSize:S.pageSize};f(e),u?.({sort:m,filters:g,pagination:S,columnOrder:v,hiddenColumns:b,columns:r})},[m,g,v,b,S.pageSize,f,u,S,r]);let k=(0,t.useCallback)(e=>{h(t=>t?.column===e?t.direction===`asc`?{column:e,direction:`desc`}:void 0:{column:e,direction:`asc`})},[]),A=(0,t.useCallback)((e,t,n=`text`)=>{_(r=>({...r,[e]:{type:n,value:t,options:r[e]?.options}})),T(e=>({...e,page:1}))},[]),j=(0,t.useCallback)(e=>{_(t=>{let n={...t};return delete n[e],n})},[]),M=(0,t.useCallback)(()=>{_({})},[]),N=(0,t.useCallback)(e=>{T(t=>({...t,page:e}))},[]),P=(0,t.useCallback)(e=>{T(t=>({...t,pageSize:e,page:1}))},[]),F=(0,t.useCallback)(e=>{y(e)},[]),I=(0,t.useCallback)(e=>{x(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e])},[]),L=(0,t.useMemo)(()=>v.map(e=>r.find(t=>t.id===e)).filter(Boolean).filter(e=>!b.includes(e.id)),[v,r,b]);return{state:{data:n,filteredData:E,paginatedData:O,sortConfig:m,filters:g,pagination:S,columnOrder:v,hiddenColumns:b,loading:!1},orderedColumns:L,pageSizeOptions:s,handleSort:k,handleFilter:A,clearFilter:j,clearAllFilters:M,handlePageChange:N,handlePageSizeChange:P,handleColumnReorder:F,handleToggleColumn:I,allColumns:r}};e.AdvancedTable=({data:e,columns:r,defaultSort:i,defaultFilters:a={},defaultPageSize:o=10,pageSizeOptions:s=[10,25,50,100,200,300,400,500],enableSorting:c=!0,enableFiltering:l=!0,enablePagination:u=!0,enableExport:_=!0,persistConfig:v=!0,configKey:b=`advancedTable`,className:x=``,labels:S={configuration:`Configuración`,columnVisibility:`Columnas visibles`,pagination:{showingItems:`Mostrando`,to:`a`,of:`de`,items:`elementos`,showPerPage:`Mostrar`,perPageItems:`elementos`},clearAllFilters:`Limpiar todos los filtros`}})=>{let[C,w]=(0,t.useState)(null),[E,D]=(0,t.useState)(null),[O,k]=(0,t.useState)(!1),[A,j]=(0,t.useState)(null),M=(0,t.useRef)(null),[N,P]=(0,t.useState)(r),{state:F,orderedColumns:I,handleSort:L,handleFilter:R,clearAllFilters:z,handlePageChange:B,handlePageSizeChange:V,handleColumnReorder:H,handleToggleColumn:U}=T({data:e,columns:N,defaultSort:i,defaultFilters:a,defaultPageSize:o,pageSizeOptions:s,persistConfig:v,configKey:b}),{paginatedData:W,sortConfig:G,filters:K,pagination:q,hiddenColumns:J}=F;(0,t.useEffect)(()=>P(r),[r]);let Y=(e,t)=>{w(t),e.dataTransfer.effectAllowed=`move`,e.dataTransfer.setData(`text/html`,``)},X=(e,t)=>{e.preventDefault(),e.dataTransfer.dropEffect=`move`,D(t)},Z=()=>{D(null)},Q=(e,t)=>{if(e.preventDefault(),C!==null){if(C!==t){let e=[...F.columnOrder],[n]=e.splice(C,1);e.splice(t,0,n),H(e)}w(null),D(null)}},ee=()=>{w(null),D(null)},te=()=>{},ne=e=>{j(A===e?null:e)},re=t=>{let n=N.find(e=>e.id===t);if(!n)return[];let r=new Map;return e.forEach(e=>{let t=typeof n.accessor==`function`?n.accessor(e):e[n.accessor],i=m(t);r.set(i,(r.get(i)||0)+1)}),Array.from(r.entries()).map(([e,t])=>({value:e,count:t,label:`${e} (${t})`})).sort((e,t)=>e.value.localeCompare(t.value))},ie=Object.values(K).some(e=>e.type===`text`&&e.value||e.type===`select`&&e.value||e.type===`multiselect`&&Array.isArray(e.value)&&e.value.length>0);(0,t.useEffect)(()=>{let e=e=>{M.current&&!M.current.contains(e.target)&&k(!1)};return O&&document.addEventListener(`mousedown`,e),()=>{document.removeEventListener(`mousedown`,e)}},[O]);let $=Math.ceil(q.total/q.pageSize);return(0,n.jsxs)(`div`,{className:`w-full bg-redi-background border border-solid border-gray-500 rounded-xl overflow-hidden font-family-base shadow ${x}`,children:[(0,n.jsxs)(`div`,{className:`flex items-center justify-between p-4 bg-transparent border-b border-solid border-gray-400`,children:[(0,n.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,n.jsxs)(`div`,{className:`relative`,children:[(0,n.jsxs)(g,{level:`secondary`,onClick:()=>k(!O),children:[(0,n.jsx)(f,{}),(0,n.jsx)(`span`,{className:`hidden md:block`,children:S.configuration})]}),O&&(0,n.jsx)(`div`,{className:`absolute top-full left-0 bg-white border border-solid border-gray-300 rounded-md shadow-lg z-1000 mt-2 min-w-2xs max-w-xs opacity-100 visible p-4`,ref:M,children:(0,n.jsxs)(`div`,{className:`mb-4 last:mb-0`,children:[(0,n.jsx)(`div`,{className:`text-sm font-semibold text-redi-text mb-2 uppercase`,children:S.columnVisibility}),(0,n.jsx)(`div`,{className:`flex flex-col gap-2`,children:N.map(e=>(0,n.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,n.jsx)(`input`,{type:`checkbox`,className:`w-4 h-4 accent-redi-primary`,checked:!J.includes(e.id),onChange:()=>U(e.id)}),(0,n.jsx)(`label`,{children:e.label})]},e.id))})]})})]}),l&&ie&&(0,n.jsx)(g,{level:`icon`,onClick:z,label:S.clearAllFilters,children:(0,n.jsx)(h,{color:`white`})})]}),(0,n.jsx)(`div`,{className:`flex items-center gap-2`,children:_&&(0,n.jsx)(g,{level:`secondary`,onClick:te,children:(0,n.jsx)(d,{size:18})})})]}),(0,n.jsx)(`div`,{className:`overflow-x-auto max-h-[600px] min-h-[500px] overflow-y-auto bg-white relative`,children:(0,n.jsxs)(`table`,{className:`w-full border-collapse table-auto text-sm relative`,children:[(0,n.jsx)(`thead`,{children:(0,n.jsx)(`tr`,{children:I.map((e,t)=>(0,n.jsx)(`th`,{className:`bg-gray-50 border-b border-solid border-gray-200 text-left font-semibold text-redi-text p-0 sticky top-0 z-10 select-none hover:bg-gray-200 ${C===t?`opacity-50 bg-gray-300`:``} ${E===t?`bg-redi-primary-bg border-l border-solid border-redi-primary`:``}`,draggable:!0,onDragStart:e=>Y(e,t),onDragOver:e=>X(e,t),onDragLeave:Z,onDrop:e=>Q(e,t),onDragEnd:ee,children:(0,n.jsxs)(`div`,{className:`flex items-center py-3 px-4 gap-2 min-h-12`,children:[(0,n.jsx)(`div`,{className:`text-gray-600 cursor-grab opacity-70 hover:opacity-100 text-base`,children:`⋮⋮`}),(0,n.jsxs)(`div`,{className:`flex flex-1 items-center gap-2`,children:[(0,n.jsxs)(`span`,{className:c?`cursor-pointer py-1 px-1.5 rounded-sm flex items-center gap-1.5 text-sm font-semibold text-redi-text uppercase hover:bg-redi-text hover:text-redi-link-text`:``,onClick:t=>{t.stopPropagation(),c&&L(e.id)},children:[e.label,c&&G?.column===e.id&&(0,n.jsx)(`span`,{className:`font-bold text-redi-link-text text-base`,children:G.direction===`asc`?` ↑`:` ↓`})]}),l&&(0,n.jsxs)(`div`,{className:`relative`,children:[(0,n.jsx)(g,{level:`icon`,onClick:t=>{t.stopPropagation(),ne(e.id)},children:(0,n.jsx)(p,{size:16})}),A===e.id&&(0,n.jsx)(y,{columnId:e.id,label:e.label,options:re(e.id),textValue:K[e.id]?.type===`text`?String(K[e.id].value||``):``,selectedValues:K[e.id]?.type===`multiselect`&&Array.isArray(K[e.id]?.value)?K[e.id].value:[],onTextChange:t=>R(e.id,t,`text`),onSelectionChange:t=>R(e.id,t,`multiselect`),onClose:()=>j(null)})]})]})]})},e.id))})}),(0,n.jsx)(`tbody`,{children:W.map((e,t)=>(0,n.jsx)(`tr`,{className:`even:bg-gray-50 hover:bg-gray-100 border-b border-solid border-b-gray-100 odd:bg-white`,children:I.map(r=>{let i=typeof r.accessor==`function`?r.accessor(e):e[r.accessor];return r.render?(0,n.jsx)(`td`,{className:`py-3 px-4 text-redi-text font-normal leading-6 align-middle border-r border-solid border-r-gray-300 static table-cell last:border-r-0 first:font-medium`,children:r.render(i,e,t)},r.id):(0,n.jsx)(`td`,{className:`py-3 px-4 text-redi-text font-normal leading-6 align-middle border-r border-solid border-r-gray-300 static table-cell last:border-r-0 first:font-medium`,children:m(i)},r.id)})},t))})]})}),u&&(0,n.jsxs)(`div`,{className:`flex items-center justify-between py-4 px-6 bg-white border-t-gray-300 border-solid border-t gap-4`,children:[(0,n.jsx)(`div`,{className:`text-redi-text text-base font-medium shrink-0`,children:(0,n.jsxs)(`span`,{children:[S.pagination?.showingItems,` `,(q.page-1)*q.pageSize+1,` `,S.pagination?.to,` `,Math.min(q.page*q.pageSize,q.total),` `,S.pagination?.of,` `,q.total,` `,S.pagination?.items]})}),(0,n.jsxs)(`div`,{className:`flex items-center gap-5`,children:[(0,n.jsxs)(`label`,{className:`flex items-center gap-3 text-sm font-semibold text-redi-text`,children:[S.pagination?.showPerPage,(0,n.jsx)(`select`,{value:q.pageSize,onChange:e=>V(Number(e.target.value)),className:`py-1.5 px-2.5 border border-solid border-gray-300 rounded-md bg-white text-redi-text focus:outline-none focus:ring-2 focus:ring-redi-primary`,children:s.map(e=>(0,n.jsx)(`option`,{value:e,children:e},e))}),S.pagination?.perPageItems]}),(0,n.jsxs)(`div`,{className:`flex gap-1 items-center`,children:[(0,n.jsx)(g,{level:`icon`,onClick:()=>B(1),disabled:q.page===1,children:`<<`}),(0,n.jsx)(g,{level:`icon`,onClick:()=>B(q.page-1),disabled:q.page===1,children:`<`}),Array.from({length:Math.min(3,$)},(e,t)=>{let r;return r=$<=3||q.page<=2?t+1:q.page>$-2?$-2+t:q.page-1+t,(0,n.jsx)(g,{level:q.page===r?`primary`:`secondary`,onClick:()=>B(r),children:r},r)}),(0,n.jsx)(g,{level:`icon`,onClick:()=>B(q.page+1),disabled:q.page===$,children:`>`}),(0,n.jsx)(g,{level:`icon`,onClick:()=>B($),disabled:q.page===$,children:`>>`})]})]})]})]})},e.Button=g});
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@redi.run/redi-components",
|
|
3
3
|
"description": "This project was created to define the style of the UI and improve the UX in all projects from REDI",
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.24",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"author": {
|
|
7
7
|
"name": "Jonathan Manchego Sosa",
|