pesona-ui 1.0.4 → 1.0.6

package/dist/index.cjs.js

@@ -181,6 +181,8 @@ const Badge = ({ className, text }) => {
     return React.createElement("span", { className: className }, text);
 };
 
+const Box = ({ children, className = '', ...rest }) => (React.createElement("div", { className: `box ${className}`, ...rest }, children));
+
 const Tabs = ({ className, navClassName, contentClassName, children, activeTab, handleActiveTab, customHeader, }) => {
     return (React.createElement("div", { className: `card tabs ${className}` },
         React.createElement("div", { className: `card-header ${navClassName}` },
@@ -7560,8 +7562,20 @@ function IconBase(props) {
 }
 
 // THIS FILE IS AUTO GENERATED
-function FiChevronDown (props) {
+function FiCheck (props) {
+  return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"2","strokeLinecap":"round","strokeLinejoin":"round"},"child":[{"tag":"polyline","attr":{"points":"20 6 9 17 4 12"},"child":[]}]})(props);
+}function FiChevronDown (props) {
   return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"2","strokeLinecap":"round","strokeLinejoin":"round"},"child":[{"tag":"polyline","attr":{"points":"6 9 12 15 18 9"},"child":[]}]})(props);
+}function FiChevronLeft (props) {
+  return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"2","strokeLinecap":"round","strokeLinejoin":"round"},"child":[{"tag":"polyline","attr":{"points":"15 18 9 12 15 6"},"child":[]}]})(props);
+}function FiChevronRight (props) {
+  return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"2","strokeLinecap":"round","strokeLinejoin":"round"},"child":[{"tag":"polyline","attr":{"points":"9 18 15 12 9 6"},"child":[]}]})(props);
+}function FiSkipBack (props) {
+  return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"2","strokeLinecap":"round","strokeLinejoin":"round"},"child":[{"tag":"polygon","attr":{"points":"19 20 9 12 19 4 19 20"},"child":[]},{"tag":"line","attr":{"x1":"5","y1":"19","x2":"5","y2":"5"},"child":[]}]})(props);
+}function FiSkipForward (props) {
+  return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"2","strokeLinecap":"round","strokeLinejoin":"round"},"child":[{"tag":"polygon","attr":{"points":"5 4 15 12 5 20 5 4"},"child":[]},{"tag":"line","attr":{"x1":"19","y1":"5","x2":"19","y2":"19"},"child":[]}]})(props);
+}function FiTrash (props) {
+  return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"2","strokeLinecap":"round","strokeLinejoin":"round"},"child":[{"tag":"polyline","attr":{"points":"3 6 5 6 21 6"},"child":[]},{"tag":"path","attr":{"d":"M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"},"child":[]}]})(props);
 }function FiX (props) {
   return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"2","strokeLinecap":"round","strokeLinejoin":"round"},"child":[{"tag":"line","attr":{"x1":"18","y1":"6","x2":"6","y2":"18"},"child":[]},{"tag":"line","attr":{"x1":"6","y1":"6","x2":"18","y2":"18"},"child":[]}]})(props);
 }
@@ -8612,12 +8626,58 @@ const TableFooter = ({ children, className = '' }) => {
     return React.createElement("tfoot", { className: className }, children);
 };
 
+const TableDeleteSelectedItems = ({ count, handleMultipleDelete }) => {
+    return (React.createElement("div", { className: "selected-toolbar" },
+        React.createElement(Button, { className: "btn-icon btn-danger", onClick: handleMultipleDelete },
+            React.createElement(FiTrash, null)),
+        React.createElement("p", null,
+            count,
+            " item selected")));
+};
+
+const TablePaginating = ({ startIndex, endIndex, currentPage, totalData, itemsPerPage, setItemsPerPage, setCurrentPage, totalPages, showPerPage = true, }) => {
+    return (React.createElement("div", { className: "pagination-toolbar" },
+        showPerPage && (React.createElement("div", { className: "pagination-select" },
+            React.createElement("p", null, "Baris per halaman:"),
+            React.createElement(Select, { name: "row_perpage", size: "sm", options: [
+                    { value: '10', label: '10' },
+                    { value: '20', label: '20' },
+                    { value: '30', label: '30' },
+                    { value: '50', label: '50' },
+                ], value: itemsPerPage.toString(), onChange: (e) => {
+                    setItemsPerPage(Number(e.target.value));
+                    setCurrentPage(1);
+                } }))),
+        React.createElement("div", { className: "pagination-nav" }, ` ${startIndex + 1} - ${Math.min(endIndex, totalData)} dari ${totalData}`),
+        React.createElement("div", { className: "pagination-button" },
+            React.createElement("div", { className: "btn-group" },
+                React.createElement(Button, { className: `btn-icon btn-info`, onClick: () => setCurrentPage(1), disabled: currentPage <= 1 },
+                    React.createElement(FiSkipBack, null)),
+                React.createElement(Button, { className: `btn-icon btn-info`, onClick: () => setCurrentPage(currentPage - 1), disabled: currentPage <= 1 },
+                    React.createElement(FiChevronLeft, null)),
+                React.createElement(Button, { className: `btn-icon btn-info`, onClick: () => setCurrentPage(Math.min(currentPage + 1, totalPages)), disabled: currentPage >= totalPages },
+                    React.createElement(FiChevronRight, null)),
+                React.createElement(Button, { className: `btn-icon btn-info`, onClick: () => setCurrentPage(totalPages), disabled: currentPage >= totalPages },
+                    React.createElement(FiSkipForward, null))))));
+};
+
+const TablePickSelectedItems = ({ count, selectedItem, selectedRows, }) => {
+    return (React.createElement("div", { className: "selected-toolbar-block", style: { borderRadius: '0 0 4px 0' } },
+        React.createElement("span", null,
+            count,
+            " item selected"),
+        React.createElement(Button, { className: "btn btn-primary", onClick: () => selectedItem(selectedRows) },
+            React.createElement(FiCheck, null),
+            " Gunakan")));
+};
+
 exports.Accordion = Accordion;
 exports.AccordionSection = AccordionSection;
 exports.AccordionSectionBody = AccordionSectionBody;
 exports.AccordionSectionFooter = AccordionSectionFooter;
 exports.Alert = Alert;
 exports.Badge = Badge;
+exports.Box = Box;
 exports.Button = Button;
 exports.Callout = Callout;
 exports.Card = Card;
@@ -8672,8 +8732,11 @@ exports.Tab = Tab;
 exports.Table = Table;
 exports.TableBody = TableBody;
 exports.TableCell = TableCell;
+exports.TableDeleteSelectedItems = TableDeleteSelectedItems;
 exports.TableFooter = TableFooter;
 exports.TableHeader = TableHeader;
+exports.TablePaginating = TablePaginating;
+exports.TablePickSelectedItems = TablePickSelectedItems;
 exports.TableRow = TableRow;
 exports.Tabs = Tabs;
 exports.Tooltip = Tooltip;