@mamrp/components 1.4.0 → 1.4.2

package/dist/index.mjs

@@ -540,16 +540,16 @@ function MultipleSelectChip({
   label,
   data,
   multipleitems,
-  //قابلیت انتخاب چند گزینه ای
   isLoading,
   disabled = false,
   size = "medium",
-  clear = false
+  clear = false,
+  variant = "outlined",
+  placeholder
 }) {
   const dataOptions = data?.map((value) => ({
     title: value.userName || value.name || `${value.firstName} ${value.lastName}`,
     key: value.id || `key_${Math.random()}`,
-    // Assuming each item has an 'id'
     httpMethod: numberToHttpMethodMapping[value.httpMethod],
     url: value.url,
     licensePlate: value.licensePlate
@@ -574,16 +574,6 @@ function MultipleSelectChip({
       onChange(value?.key || null);
     }
   };
-  function search(option, value) {
-    if (option.title.includes(value.title)) {
-      return true;
-    }
-    if (value.title.includes(option.title)) {
-      return true;
-    }
-    return false;
-  }
-  const CustomStyledValue = ({ children }) => /* @__PURE__ */ React3.createElement("span", { style: { color: "green", fontStyle: "italic" } }, children);
   return /* @__PURE__ */ React3.createElement(
     Controller,
     {
@@ -598,30 +588,24 @@ function MultipleSelectChip({
           disableCloseOnSelect: multipleitems,
           options: combinedOptions,
           multiple: multipleitems,
-          sx: {
-            width: "100%"
-          },
-          noOptionsText: "\u062F\u0627\u062F\u0647 \u0627\u06CC \u0628\u0631\u0627\u06CC \u0646\u0645\u0627\u06CC\u0634 \u0648\u062C\u0648\u062F \u0646\u062F\u0627\u0631\u062F",
+          sx: { width: "100%" },
+          noOptionsText: "\u062F\u0627\u062F\u0647\u200C\u0627\u06CC \u0628\u0631\u0627\u06CC \u0646\u0645\u0627\u06CC\u0634 \u0648\u062C\u0648\u062F \u0646\u062F\u0627\u0631\u062F",
           value: multipleitems ? selectedValues : combinedOptions.find(
             (option) => String(option.key) === String(value)
           ) || { title: "", key: "" },
-          onChange: (event, value2) => {
-            handleChange(event, value2, onChange);
-          },
+          onChange: (event, value2) => handleChange(event, value2, onChange),
           isOptionEqualToValue: (option, value2) => String(option.key) === String(value2?.key),
           getOptionLabel: (option) => option.title,
           loading: isLoading,
           loadingText: "\u062F\u0631 \u062D\u0627\u0644 \u0628\u0627\u0631\u06AF\u0630\u0627\u0631\u06CC...",
-          renderOption: (props, option) => {
-            return /* @__PURE__ */ React3.createElement(
-              CustomeStyle,
-              {
-                props,
-                option,
-                multipleitems: !!multipleitems
-              }
-            );
-          },
+          renderOption: (props, option) => /* @__PURE__ */ React3.createElement(
+            CustomeStyle,
+            {
+              props,
+              option,
+              multipleitems: !!multipleitems
+            }
+          ),
           slots: { popper: Popper },
           slotProps: {
             popper: {
@@ -639,7 +623,6 @@ function MultipleSelectChip({
                   name: "flip",
                   options: {
                     fallbackPlacements: ["top", "bottom"]
-                    // Ensures it flips to the top if needed
                   }
                 }
               ]
@@ -653,6 +636,8 @@ function MultipleSelectChip({
               error: !!error,
               helperText: error?.message,
               inputRef: ref,
+              variant,
+              placeholder,
               InputProps: {
                 ...params.InputProps,
                 startAdornment: /* @__PURE__ */ React3.createElement(
@@ -662,14 +647,12 @@ function MultipleSelectChip({
                       display: "flex",
                       flexWrap: "wrap",
                       maxHeight: "250px",
-                      // Set the maximum height for the chip container
                       overflowY: "auto",
-                      // Enable vertical scroll
                       padding: 0
-                      // Remove any padding to ensure chips stay inside the container
                     }
                   },
-                  /* @__PURE__ */ React3.createElement(React3.Fragment, null, isLoading ? /* @__PURE__ */ React3.createElement(Typography2, { sx: { marginRight: 1 } }, "\u062F\u0631 \u062D\u0627\u0644 \u0628\u0627\u0631\u06AF\u0630\u0627\u0631\u06CC...") : null, params.InputProps.startAdornment)
+                  isLoading ? /* @__PURE__ */ React3.createElement(Typography2, { sx: { marginRight: 1 } }, "\u062F\u0631 \u062D\u0627\u0644 \u0628\u0627\u0631\u06AF\u0630\u0627\u0631\u06CC...") : null,
+                  params.InputProps.startAdornment
                 )
               }
             }
@@ -3528,7 +3511,7 @@ var FormInputNumber = ({
   decimalScale = 2,
   autoComplete = "off",
   textAlign = "right",
-  borderless = false,
+  variant = "outlined",
   ...rest
 }) => {
   return /* @__PURE__ */ React23.createElement(
@@ -3552,30 +3535,18 @@ var FormInputNumber = ({
           },
           value: data && !value ? data : value == null ? "" : valueHandler ? valueHandler(value) : value,
           fullWidth: true,
-          variant: borderless ? "standard" : "outlined",
+          variant,
           sx: {
-            ...borderless ? {
-              "& .MuiInput-underline:before": {
-                borderBottom: "none"
-              },
-              "& .MuiInput-underline:after": {
-                borderBottom: "none"
+            "& .MuiOutlinedInput-notchedOutline": {
+              borderColor: borderColor || ""
+            },
+            "& .MuiOutlinedInput-root": {
+              borderRadius: "12px",
+              "&:hover fieldset": {
+                borderColor: borderColor ?? "#085938"
               },
-              "& .MuiInput-underline:hover:not(.Mui-disabled):before": {
-                borderBottom: "none"
-              }
-            } : {
-              "& .MuiOutlinedInput-notchedOutline": {
-                borderColor: borderColor || ""
-              },
-              "& .MuiOutlinedInput-root": {
-                borderRadius: "12px",
-                "&:hover fieldset": {
-                  borderColor: borderColor ?? "#085938"
-                },
-                "&.Mui-focused fieldset": {
-                  borderColor: borderColor ?? "#085938"
-                }
+              "&.Mui-focused fieldset": {
+                borderColor: borderColor ?? "#085938"
               }
             },
             "& .MuiInputLabel-root.Mui-focused": {
@@ -3663,6 +3634,7 @@ var FormInputText = ({
   isLoading,
   onBlurHandler,
   rows,
+  variant = "outlined",
   ...rest
 }) => {
   return /* @__PURE__ */ React24.createElement(
@@ -3684,7 +3656,7 @@ var FormInputText = ({
           value,
           fullWidth: true,
           label,
-          variant: "outlined",
+          variant,
           inputProps: {
             ...rest.inputProps,
             maxLength,
@@ -4820,6 +4792,130 @@ function DraggablePaper({
     /* @__PURE__ */ React.createElement(Paper, { ref: nodeRef, ...props })
   );
 }
+
+// src/data-table/index.tsx
+import ClearIcon from "@mui/icons-material/Clear";
+import { Box as Box23, Button as Button14 } from "@mui/material";
+import {
+  MaterialReactTable,
+  useMaterialReactTable
+} from "material-react-table";
+import { MRT_Localization_FA } from "material-react-table/locales/fa";
+import { useMemo } from "react";
+var customLocalization = {
+  ...MRT_Localization_FA,
+  mrt_columns_showHide_resetOrder: "\u0628\u0627\u0632\u0646\u0634\u0627\u0646\u06CC \u062A\u0631\u062A\u06CC\u0628"
+};
+var DataTable = ({
+  data,
+  columns,
+  isLoading = false,
+  isRefetching = false,
+  pagination,
+  onPaginationChange,
+  totalRows,
+  manualPagination = true,
+  columnFilters = [],
+  onColumnFiltersChange,
+  manualFiltering = true,
+  onClearFilters,
+  showClearFiltersButton = true,
+  sorting = [],
+  onSortingChange,
+  manualSorting = false,
+  enableStickyHeader = true,
+  maxHeight = "calc(100vh - 200px)",
+  density = "compact",
+  enableColumnOrdering = true,
+  enableGlobalFilter = false,
+  enableColumnFilterModes = false,
+  enableRowSelection = false,
+  renderTopToolbarCustomActions,
+  renderBottomToolbarCustomActions,
+  tableOptions = {},
+  localization = customLocalization
+}) => {
+  const memoizedColumns = useMemo(() => columns, [columns]);
+  const memoizedData = useMemo(() => data, [data]);
+  const defaultRenderTopToolbarCustomActions = ({ table: table2 }) => {
+    const showFilters = table2.getState().showColumnFilters;
+    if (!showFilters || !showClearFiltersButton || !onClearFilters) return null;
+    return /* @__PURE__ */ React.createElement(Box23, { sx: { width: "100%" } }, /* @__PURE__ */ React.createElement(
+      Box23,
+      {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "flex-start"
+      },
+      /* @__PURE__ */ React.createElement(
+        Button14,
+        {
+          color: "secondary",
+          onClick: onClearFilters,
+          startIcon: /* @__PURE__ */ React.createElement(ClearIcon, null)
+        },
+        "\u0628\u0627\u0632\u0646\u0634\u0627\u0646\u06CC \u0641\u06CC\u0644\u062A\u0631\u0647\u0627"
+      )
+    ));
+  };
+  const table = useMaterialReactTable({
+    columns: memoizedColumns,
+    data: memoizedData,
+    localization,
+    // Pagination
+    manualPagination,
+    onPaginationChange,
+    pageCount: manualPagination ? Math.ceil(totalRows / pagination.pageSize) : void 0,
+    rowCount: totalRows ?? 0,
+    // Filtering
+    manualFiltering,
+    onColumnFiltersChange,
+    enableColumnFilterModes,
+    enableGlobalFilter,
+    // Sorting
+    manualSorting,
+    onSortingChange,
+    // Features
+    enableColumnOrdering,
+    enableRowSelection,
+    enableStickyHeader,
+    // State
+    state: {
+      pagination,
+      columnFilters,
+      sorting,
+      isLoading,
+      showProgressBars: isRefetching
+    },
+    // Styling
+    muiTablePaperProps: { sx: { direction: "ltr" } },
+    muiTableBodyCellProps: { sx: { textAlign: "center" } },
+    muiTableHeadCellProps: {
+      sx: {
+        "& .Mui-TableHeadCell-Content": {
+          flexDirection: "row-reverse",
+          justifyContent: "center"
+        }
+      }
+    },
+    muiTableContainerProps: {
+      sx: {
+        maxHeight
+      }
+    },
+    // Initial state
+    initialState: {
+      density
+    },
+    // Custom toolbars
+    renderTopToolbarCustomActions: renderTopToolbarCustomActions || defaultRenderTopToolbarCustomActions,
+    renderBottomToolbarCustomActions,
+    // Override with any additional options
+    ...tableOptions
+  });
+  return /* @__PURE__ */ React.createElement(MaterialReactTable, { table });
+};
+var data_table_default = DataTable;
 export {
   Page as Accordion,
   AdvancedSearchButton,
@@ -4827,6 +4923,7 @@ export {
   bascule_connection_button_default as ConnectToBasculeButton,
   CustomCheckbox,
   CustomTimePicker,
+  data_table_default as DataTable,
   DateFilter,
   DateFilterRange,
   date_month_default as DateMonthPicker,