flowcore-fn 2.9.5 → 3.0.0

package/dist/pkg-index.js

@@ -48,7 +48,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var pkg_index_exports = {};
 __export(pkg_index_exports, {
   Layout: () => Layout_default,
-  Sidebar: () => Layout_default,
+  Sidebar: () => Sidebar,
   WorkflowPage: () => WorkflowPage
 });
 module.exports = __toCommonJS(pkg_index_exports);
@@ -495,9 +495,6 @@ function WorkflowPage() {
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(WorkflowStep, {});
 }
 
-// src/components/Layout.jsx
-var import_react16 = require("react");
-
 // src/components/Sidebar.jsx
 var import_react14 = require("react");
 var import_react15 = require("@remixicon/react");
@@ -1068,32 +1065,172 @@ function WorkflowMasterMain() {
   ] });
 }
 
-// src/components/WorkFlowTransition/Transitiontable.js
-var import_react8 = __toESM(require("react"));
-var import_link3 = __toESM(require("next/link"));
+// src/components/WorkflowType/WorkflowTypeMains.js
+var import_react10 = __toESM(require("react"));
 
-// src/components/WorkFlowTransition/AddWorkFlowTransitionModal.js
+// src/components/WorkflowType/SearchBar.jsx
 var import_react6 = __toESM(require("react"));
 var import_jsx_runtime7 = require("react/jsx-runtime");
-function AddWorkTransitionStepModal({ onClose }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4", children: [
+function SearchBar() {
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "relative max-w-sm w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "absolute inset-y-0 left-0 flex items-center pl-3.5 pointer-events-none", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { className: "w-4.5 h-4.5 text-slate-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" }) }) }),
     /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      "input",
+      {
+        type: "text",
+        placeholder: "Search workflow name or code...",
+        className: "w-full pl-10 pr-4 py-2.5 border border-slate-200 rounded-xl text-sm bg-slate-50/50 focus:outline-none focus:ring-4 focus:ring-blue-500/10 focus:border-blue-500 text-slate-700 placeholder-slate-400 transition-all shadow-sm"
+      }
+    )
+  ] });
+}
+
+// src/components/WorkflowType/WorkflowTypeTable.jsx
+var import_react7 = __toESM(require("react"));
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function WorkflowTypeTable({ pageSize }) {
+  const initialData = [
+    { id: "1", name: "Citizen Petition Workflow", code: "PET-001", type: "Petition", version: "1", published: true, status: true },
+    { id: "2", name: "Building Permission Workflow", code: "BLD-001", type: "Building Permission", version: "1", published: true, status: true },
+    { id: "3", name: "Leave Application Workflow", code: "LEV-001", type: "Leave", version: "1", published: false, status: true },
+    { id: "4", name: "Grievance Redressal Workflow", code: "GRV-001", type: "Grievance", version: "2", published: true, status: true },
+    { id: "5", name: "Trade License Workflow", code: "TRD-001", type: "Trade License", version: "1", published: true, status: true },
+    { id: "6", name: "Document Verification", code: "DOC-001", type: "Verification", version: "1", published: true, status: true }
+  ];
+  const [data, setData] = (0, import_react7.useState)(initialData);
+  const [sortOrder, setSortOrder] = (0, import_react7.useState)("asc");
+  const [currentPage, setCurrentPage] = (0, import_react7.useState)(1);
+  const totalPages = Math.ceil(data.length / pageSize) || 1;
+  const startIndex = (currentPage - 1) * pageSize;
+  const visibleData = data.slice(startIndex, startIndex + pageSize);
+  const handleSort = (columnKey) => {
+    const isAsc = sortOrder === "asc";
+    setSortOrder(isAsc ? "desc" : "asc");
+    const sortedData = [...data].sort((a, b) => {
+      if (a[columnKey] < b[columnKey]) return isAsc ? -1 : 1;
+      if (a[columnKey] > b[columnKey]) return isAsc ? 1 : -1;
+      return 0;
+    });
+    setData(sortedData);
+  };
+  const toggleSwitch = (id) => {
+    const updatedData = data.map(
+      (item) => item.id === id ? __spreadProps(__spreadValues({}, item), { status: !item.status }) : item
+    );
+    setData(updatedData);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "w-full overflow-x-auto border border-slate-200 rounded-2xl shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("table", { className: "w-full text-left border-collapse bg-white", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("tr", { className: "bg-slate-50/70 border-b border-slate-200 text-xs font-bold uppercase tracking-wider text-slate-500", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("th", { className: "py-4.5 px-5 w-20 text-center", children: "S.No" }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("th", { onClick: () => handleSort("name"), className: "py-4.5 px-5 text-sm cursor-pointer select-none hover:text-slate-900", children: [
+          "Workflow Name ",
+          sortOrder === "asc" ? "\u25B2" : "\u25BC"
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("th", { onClick: () => handleSort("code"), className: "py-4.5 px-5 cursor-pointer select-none hover:text-slate-900", children: [
+          "Workflow Code ",
+          sortOrder === "asc" ? "\u25B2" : "\u25BC"
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("th", { onClick: () => handleSort("type"), className: "py-4.5 px-5 cursor-pointer select-none hover:text-slate-900", children: [
+          "Workflow Type ",
+          sortOrder === "asc" ? "\u25B2" : "\u25BC"
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("th", { className: "py-4.5 px-5 text-center", children: "Version" }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("th", { className: "py-4.5 px-5 text-center", children: "Published" }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("th", { className: "py-4.5 px-5 text-center", children: "Status" })
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("tbody", { className: "divide-y divide-slate-100 text-sm text-slate-600", children: visibleData.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("tr", { className: "hover:bg-slate-50/50 transition-colors", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("td", { className: "py-4 px-5 text-center font-medium text-slate-400", children: startIndex + index + 1 }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("td", { className: "py-4 px-5 font-bold text-slate-900 text-[14px]", children: item.name }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("td", { className: "py-4 px-5 text-slate-500", children: item.code }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("td", { className: "py-4 px-5 text-slate-500", children: item.type }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("td", { className: "py-4 px-5 text-center font-semibold text-slate-700", children: item.version }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("td", { className: "py-4 px-5 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: `px-2.5 py-1 rounded-md text-xs font-medium ${item.published ? "bg-green-50 text-green-700 border border-green-200" : "bg-red-50 text-red-700 border border-red-200"}`, children: item.published ? "\u2713 Yes" : "\u2715 No" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("td", { className: "py-4 px-5 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "flex justify-center items-center", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => toggleSwitch(item.id),
+            className: `relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out outline-none ${item.status ? "bg-blue-600" : "bg-slate-200"}`,
+            children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              "span",
+              {
+                className: `pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out ${item.status ? "translate-x-5" : "translate-x-0"}`
+              }
+            )
+          }
+        ) }) })
+      ] }, item.id)) })
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex items-center justify-end gap-1 text-[13px] text-slate-700 font-normal mt-4 bg-slate-50/50 p-3 rounded-xl border border-slate-100", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        "button",
+        {
+          onClick: () => setCurrentPage(1),
+          className: "px-2.5 py-1 text-slate-500 hover:text-slate-900 transition-colors",
+          children: "First"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        "button",
+        {
+          onClick: () => setCurrentPage((prev) => Math.max(prev - 1, 1)),
+          className: "px-2.5 py-1 text-slate-500 hover:text-slate-900 transition-colors mr-2",
+          children: "\u2039 Prev"
+        }
+      ),
+      [1, 2, 3, 4].map((pageNumber) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        "button",
+        {
+          onClick: () => setCurrentPage(pageNumber),
+          className: `px-3 py-1 text-center rounded transition-all min-w-[28px] ${currentPage === pageNumber ? "bg-blue-600 text-white font-medium shadow-sm" : "text-slate-600 hover:bg-slate-100"}`,
+          children: pageNumber
+        },
+        pageNumber
+      )),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        "button",
+        {
+          onClick: () => setCurrentPage((prev) => Math.min(prev + 1, 7)),
+          className: "px-2.5 py-1 text-slate-500 hover:text-slate-900 transition-colors ml-2",
+          children: "Next \u203A"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        "button",
+        {
+          onClick: () => setCurrentPage(7),
+          className: "px-2.5 py-1 text-slate-500 hover:text-slate-900 transition-colors",
+          children: "Last"
+        }
+      )
+    ] })
+  ] });
+}
+
+// src/components/WorkflowType/AddWorkflowTypeModal.jsx
+var import_react8 = __toESM(require("react"));
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function AddWorkflowTypeModal({ isOpen, onClose }) {
+  if (!isOpen) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       "div",
       {
         className: "fixed inset-0 bg-slate-900/50 backdrop-blur-sm transition-opacity duration-200",
         onClick: onClose
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "relative w-full max-w-4xl bg-white rounded-3xl shadow-2xl flex flex-col z-10 max-h-[92vh] overflow-hidden animate-in fade-in zoom-in-95 duration-200", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex justify-between items-center px-8 py-6 border-b border-slate-100", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "w-12 h-12 bg-indigo-50 text-indigo-600 rounded-xl flex items-center justify-center shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { className: "w-6 h-6", fill: "none", stroke: "currentColor", strokeWidth: "2", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10" }) }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h2", { className: "text-xl font-extrabold text-slate-800", children: "Add Workflow" }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-xs text-slate-400 mt-0.5", children: "Create a new workflow and configure its details" })
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "relative w-full max-w-4xl bg-white rounded-3xl shadow-2xl flex flex-col z-10 max-h-[92vh] overflow-hidden animate-in fade-in zoom-in-95 duration-200", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex justify-between items-center px-8 py-6 border-b border-slate-100", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "w-12 h-12 bg-indigo-50 text-indigo-600 rounded-xl flex items-center justify-center shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("svg", { className: "w-6 h-6", fill: "none", stroke: "currentColor", strokeWidth: "2", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10" }) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h2", { className: "text-xl font-extrabold text-slate-800", children: "Add Workflow" }),
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-xs text-slate-400 mt-0.5", children: "Create a new workflow and configure its details" })
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           "button",
           {
             onClick: onClose,
@@ -1102,32 +1239,32 @@ function AddWorkTransitionStepModal({ onClose }) {
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "p-8 space-y-8 overflow-y-auto max-h-[calc(92vh-170px)] bg-slate-50/30", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-2 text-indigo-600 text-sm font-bold border-b border-slate-50 pb-3", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "\u{1F4CB}" }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Workflow Information" })
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "p-8 space-y-8 overflow-y-auto max-h-[calc(92vh-170px)] bg-slate-50/30", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-2 text-indigo-600 text-sm font-bold border-b border-slate-50 pb-3", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "\u{1F4CB}" }),
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "Workflow Information" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
-                "Workflow Transition",
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-red-500", children: "*" })
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+                "Workflow Type ",
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-red-500", children: "*" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("select", { className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs bg-white text-slate-700 focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "", children: "Select workflow type" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "petition", children: "Petition" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "building", children: "Building Permission" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "leave", children: "Leave" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("select", { className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs bg-white text-slate-700 focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "", children: "Select workflow type" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "petition", children: "Petition" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "building", children: "Building Permission" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "leave", children: "Leave" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Choose the category this workflow belongs to" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Choose the category this workflow belongs to" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
                 "Workflow Code ",
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-red-500", children: "*" })
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-red-500", children: "*" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                 "input",
                 {
                   type: "text",
@@ -1135,15 +1272,15 @@ function AddWorkTransitionStepModal({ onClose }) {
                   className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Unique code for this workflow (e.g., PET-001)" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Unique code for this workflow (e.g., PET-001)" })
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
               "Workflow Name ",
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-red-500", children: "*" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-red-500", children: "*" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
               "input",
               {
                 type: "text",
@@ -1151,15 +1288,15 @@ function AddWorkTransitionStepModal({ onClose }) {
                 className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Enter a descriptive name for this workflow" })
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Enter a descriptive name for this workflow" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
                 "Version ",
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-red-500", children: "*" })
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-red-500", children: "*" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                 "input",
                 {
                   type: "text",
@@ -1167,27 +1304,27 @@ function AddWorkTransitionStepModal({ onClose }) {
                   className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Workflow version number" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Workflow version number" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
                 "Published ",
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-red-500", children: "*" })
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-red-500", children: "*" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("select", { className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs bg-white text-slate-700 focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "false", children: "No" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "true", children: "Yes" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("select", { className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs bg-white text-slate-700 focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "false", children: "No" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "true", children: "Yes" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Make workflow active for use" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Make workflow active for use" })
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex justify-between items-center", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("label", { className: "block text-xs font-bold text-slate-700", children: "Description" }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-[10px] text-slate-400", children: "0 / 500" })
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex justify-between items-center", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("label", { className: "block text-xs font-bold text-slate-700", children: "Description" }),
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-[10px] text-slate-400", children: "0 / 500" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
             "textarea",
             {
               rows: 3,
@@ -1195,86 +1332,86 @@ function AddWorkTransitionStepModal({ onClose }) {
               className: "w-full p-3 border border-slate-200 rounded-xl text-xs resize-none focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[10px] text-slate-400", children: "Provide additional information about this workflow" })
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[10px] text-slate-400", children: "Provide additional information about this workflow" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-2 text-indigo-600 text-sm font-bold border-b border-slate-50 pb-3", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "\u2699\uFE0F" }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Status & Settings" })
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-2 text-indigo-600 text-sm font-bold border-b border-slate-50 pb-3", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "\u2699\uFE0F" }),
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "Status & Settings" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
                 "Status ",
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-red-500", children: "*" })
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-red-500", children: "*" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("select", { className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs bg-white text-slate-700 focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "active", children: "Active" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "inactive", children: "Inactive" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("select", { className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs bg-white text-slate-700 focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "active", children: "Active" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "inactive", children: "Inactive" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Set the initial status of this workflow" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Set the initial status of this workflow" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: "Default Priority" }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("select", { className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs bg-white text-slate-700 focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "medium", children: "Medium" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "high", children: "High" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("option", { value: "low", children: "Low" })
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: "Default Priority" }),
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("select", { className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs bg-white text-slate-700 focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "medium", children: "Medium" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "high", children: "High" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: "low", children: "Low" })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Default priority for tasks in this workflow" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Default priority for tasks in this workflow" })
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-2 text-indigo-600 text-sm font-bold border-b border-slate-50 pb-3", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "\u{1F6E0}\uFE0F" }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: "Additional Settings" })
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-2 text-indigo-600 text-sm font-bold border-b border-slate-50 pb-3", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "\u{1F6E0}\uFE0F" }),
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "Additional Settings" })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center justify-between p-4 bg-slate-50/50 border border-slate-100 rounded-2xl", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-3", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "w-8 h-8 rounded-lg bg-indigo-50 text-indigo-600 flex items-center justify-center text-sm", children: "\u23F1\uFE0F" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-xs font-bold text-slate-700", children: "Enable SLA" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[9px] text-slate-400", children: "Enable SLA for workflow" })
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center justify-between p-4 bg-slate-50/50 border border-slate-100 rounded-2xl", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "w-8 h-8 rounded-lg bg-indigo-50 text-indigo-600 flex items-center justify-center text-sm", children: "\u23F1\uFE0F" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-xs font-bold text-slate-700", children: "Enable SLA" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[9px] text-slate-400", children: "Enable SLA for workflow" })
                 ] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: "relative inline-flex items-center cursor-pointer", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("input", { type: "checkbox", defaultChecked: true, className: "sr-only peer" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "w-8 h-4.5 bg-slate-200 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-slate-300 after:border after:rounded-full after:h-3.5 after:w-3.5 after:transition-all peer-checked:bg-indigo-600" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "relative inline-flex items-center cursor-pointer", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("input", { type: "checkbox", defaultChecked: true, className: "sr-only peer" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "w-8 h-4.5 bg-slate-200 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-slate-300 after:border after:rounded-full after:h-3.5 after:w-3.5 after:transition-all peer-checked:bg-indigo-600" })
               ] })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center justify-between p-4 bg-slate-50/50 border border-slate-100 rounded-2xl", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-3", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "w-8 h-8 rounded-lg bg-indigo-50 text-indigo-600 flex items-center justify-center text-sm", children: "\u{1F504}" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-xs font-bold text-slate-700", children: "Allow Rework" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[9px] text-slate-400", children: "Allow files to be sent back" })
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center justify-between p-4 bg-slate-50/50 border border-slate-100 rounded-2xl", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "w-8 h-8 rounded-lg bg-indigo-50 text-indigo-600 flex items-center justify-center text-sm", children: "\u{1F504}" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-xs font-bold text-slate-700", children: "Allow Rework" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[9px] text-slate-400", children: "Allow files to be sent back" })
                 ] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: "relative inline-flex items-center cursor-pointer", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("input", { type: "checkbox", defaultChecked: true, className: "sr-only peer" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "w-8 h-4.5 bg-slate-200 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-slate-300 after:border after:rounded-full after:h-3.5 after:w-3.5 after:transition-all peer-checked:bg-indigo-600" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "relative inline-flex items-center cursor-pointer", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("input", { type: "checkbox", defaultChecked: true, className: "sr-only peer" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "w-8 h-4.5 bg-slate-200 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-slate-300 after:border after:rounded-full after:h-3.5 after:w-3.5 after:transition-all peer-checked:bg-indigo-600" })
               ] })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center justify-between p-4 bg-slate-50/50 border border-slate-100 rounded-2xl", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-3", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "w-8 h-8 rounded-lg bg-indigo-50 text-indigo-600 flex items-center justify-center text-sm", children: "\u{1F465}" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-xs font-bold text-slate-700", children: "Allow File Delegation" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[9px] text-slate-400", children: "Allow users to delegate tasks" })
+            /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center justify-between p-4 bg-slate-50/50 border border-slate-100 rounded-2xl", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "w-8 h-8 rounded-lg bg-indigo-50 text-indigo-600 flex items-center justify-center text-sm", children: "\u{1F465}" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-xs font-bold text-slate-700", children: "Allow File Delegation" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-[9px] text-slate-400", children: "Allow users to delegate tasks" })
                 ] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: "relative inline-flex items-center cursor-pointer", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("input", { type: "checkbox", className: "sr-only peer" }),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "w-8 h-4.5 bg-slate-200 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-slate-300 after:border after:rounded-full after:h-3.5 after:w-3.5 after:transition-all peer-checked:bg-indigo-600" })
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "relative inline-flex items-center cursor-pointer", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("input", { type: "checkbox", className: "sr-only peer" }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "w-8 h-4.5 bg-slate-200 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-slate-300 after:border after:rounded-full after:h-3.5 after:w-3.5 after:transition-all peer-checked:bg-indigo-600" })
               ] })
             ] })
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "p-5 bg-white border-t border-slate-100 flex items-center justify-end gap-3 px-8", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "p-5 bg-white border-t border-slate-100 flex items-center justify-end gap-3 px-8", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           "button",
           {
             onClick: onClose,
@@ -1282,7 +1419,7 @@ function AddWorkTransitionStepModal({ onClose }) {
             children: "\u2715 Cancel"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           "button",
           {
             type: "button",
@@ -1295,329 +1432,79 @@ function AddWorkTransitionStepModal({ onClose }) {
   ] });
 }
 
-// src/components/WorkFlowTransition/Transitionheader.js
-var import_react7 = __toESM(require("react"));
-var import_link2 = __toESM(require("next/link"));
-var import_jsx_runtime8 = require("react/jsx-runtime");
-function Header() {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "px-6 py-5 border-b border-gray-200", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h1", { className: "m-0 text-[30px] leading-tight font-semibold text-[#1E293B] tracking-tight", children: "Workflow" }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "mt-2 text-[13px] font-medium", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("a", { href: "/dashboard", className: "text-blue-600 hover:underline", children: "Dashboard" }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "mx-2 text-slate-400", children: ">" }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("a", { href: "/masters", className: "text-blue-600 hover:underline", children: "Masters" }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "mx-2 text-slate-400", children: ">" }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("a", { href: "/workflowTransition", className: "text-blue-600 hover:underline", children: "Workflow Transition" }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "mx-2 text-slate-400", children: ">" }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "text-slate-500", children: "Workflow Step" })
-    ] })
+// src/components/WorkflowType/AddButton.jsx
+var import_react9 = __toESM(require("react"));
+var import_jsx_runtime10 = require("react/jsx-runtime");
+function AddButton({ onOpen }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    "button",
+    {
+      onClick: onOpen,
+      className: "bg-blue-600 hover:bg-blue-700 text-white px-5 py-2.5 rounded-xl font-bold text-sm shadow-md shadow-blue-500/20 hover:shadow-lg hover:shadow-blue-500/30 transition-all active:scale-95 flex items-center gap-2",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("svg", { className: "w-4 h-4 stroke-[2.5]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 4.5v15m7.5-7.5h-15" }) }),
+        "Add Workflow Type"
+      ]
+    }
+  );
+}
+
+// src/components/WorkflowType/WorkflowTypeMains.js
+var import_jsx_runtime11 = require("react/jsx-runtime");
+function WorkflowTypeMains() {
+  const [modalOpen, setModalOpen] = (0, import_react10.useState)(false);
+  const [pageSize, setPageSize] = (0, import_react10.useState)(10);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "min-h-screen bg-slate-50 p-4 md:p-6", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "w-full space-y-5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col sm:flex-row sm:items-center sm:justify-between bg-white p-6 rounded-2xl border border-slate-200/80 shadow-sm gap-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("h1", { className: "text-2xl font-extrabold text-slate-900 tracking-tight", children: "Workflow Type" }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("p", { className: "text-xs text-slate-400 mt-1", children: [
+            "Dashboard > Types > ",
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-blue-600 font-semibold", children: "Workflow Type" })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(AddButton, { onOpen: () => setModalOpen(true) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-200/80 shadow-sm space-y-5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex justify-between items-center w-full", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "w-full max-w-xs", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SearchBar, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+            "select",
+            {
+              value: pageSize,
+              onChange: (e) => setPageSize(Number(e.target.value)),
+              className: "border border-slate-200 rounded-lg px-3 py-2 text-sm bg-white cursor-pointer outline-none shadow-sm text-slate-700",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("option", { value: 2, children: "2 Rows (Testing)" }),
+                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("option", { value: 10, children: "10 Rows" }),
+                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("option", { value: 20, children: "20 Rows" }),
+                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("option", { value: 50, children: "50 Rows" })
+              ]
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(WorkflowTypeTable, { pageSize })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      AddWorkflowTypeModal,
+      {
+        isOpen: modalOpen,
+        onClose: () => setModalOpen(false)
+      }
+    )
   ] });
 }
 
 // src/components/WorkFlowTransition/Transitiontable.js
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var WorkflowTransition = [
-  {
-    TransitionId: 1,
-    workflowId: 1,
-    FromStepId: 2,
-    ToStepId: 1,
-    ActionCode: "APPROVE",
-    ActionName: "APPROVE"
-  },
-  {
-    TransitionId: 1,
-    workflowId: 1,
-    FromStepId: 2,
-    ToStepId: 1,
-    ActionCode: "APPROVE",
-    ActionName: "APPROVE"
-  },
-  {
-    TransitionId: 1,
-    workflowId: 1,
-    FromStepId: 2,
-    ToStepId: 1,
-    ActionCode: "APPROVE",
-    ActionName: "APPROVE"
-  },
-  {
-    TransitionId: 1,
-    workflowId: 1,
-    FromStepId: 2,
-    ToStepId: 1,
-    ActionCode: "RETURN",
-    ActionName: "APPROVE"
-  },
-  {
-    TransitionId: 1,
-    workflowId: 1,
-    FromStepId: 2,
-    ToStepId: 1,
-    ActionCode: "APPROVE",
-    ActionName: "RETURN"
-  }
-];
-function WorkFlowTransition() {
-  const [showModal, setShowModal] = (0, import_react8.useState)(false);
-  const [pageSize, setPageSize] = (0, import_react8.useState)(5);
-  const [sortConfig, setSortConfig] = (0, import_react8.useState)({
-    key: "",
-    direction: "asc"
-  });
-  const handleSort = (key) => {
-    let direction = "asc";
-    if (sortConfig.key === key && sortConfig.direction === "asc") {
-      direction = "desc";
-    }
-    setSortConfig({
-      key,
-      direction
-    });
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "p-6 bg-[#f5f7fb] min-h-screen font-sans text-slate-700", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "bg-white rounded-2xl shadow-md overflow-hidden", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Header, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "px-6 py-5 border-b border-gray-200 ", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex justify-between items-center flex-wrap gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-        "input",
-        {
-          type: "text",
-          placeholder: "Search workflow Transition...",
-          className: "w-[300px] px-4 py-2.5 border border-slate-200/80 rounded-lg text-[13px] text-slate-600 focus:outline-none bg-slate-50"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "px-4 py-3 border-b border-slate-200 text-[13px] text-slate-500 font-bold", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "Show" }),
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-          "select",
-          {
-            value: pageSize,
-            onChange: (e) => setPageSize(Number(e.target.value)),
-            className: "inline-flex item-center px-3 py-1 rounded-md bg-[#f1f5f9] text-[#334155] text-xs font-semibold border border-[#e2e8f0]",
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: 5, children: "5" }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: 10, children: "10" }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("option", { value: 25, children: "25" })
-            ]
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "entries" })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-        "button",
-        {
-          onClick: () => setShowModal(true),
-          className: "px-5 py-2.5 bg-blue-600 text-white rounded-lg text-[13px] font-semibold hover:bg-blue-700 transition-colors",
-          children: "+ Add Workflow Transition"
-        }
-      )
-    ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "overflow-x-auto", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("table", { className: "w-full border-collapse", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("tr", { className: "bg-slate-50/70 border-b border-slate-200 text-xs font-bold uppercase tracking-wider text-slate-500", children: [
-          { label: "TransitionId", key: "TransitionId" },
-          { label: "WorkflowId", key: "workflowId" },
-          { label: "FromStepId", key: "FromStepId" },
-          { label: "ToStepId", key: "ToStepId" },
-          { label: "ActionCode", key: "ActionCode" },
-          { label: "ActionName", key: "ActionName" }
-        ].map((column) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-          "th",
-          {
-            onClick: () => handleSort(column.key),
-            className: "px-6 py-4 text-left border-b border-gray-200 text-[11px] font-bold uppercase tracking-wider text-slate-500",
-            children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: column.label }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-gray-400 text-xs", children: sortConfig.key === column.key ? sortConfig.direction === "asc" ? "\u25B2" : "\u25BC" : "\u2195" })
-            ] })
-          },
-          column.key
-        )) }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("tbody", { children: WorkflowTransition.slice(0, pageSize).map((item) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-          "tr",
-          {
-            className: "hover:bg-slate-50 transition-colors",
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("td", { className: "px-6 p-4 border-b border-slate-200 text-[13px] text-slate-500 font-bold", children: item.TransitionId }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("td", { className: "px-6 py-4 border-b border-slate-200 text-[13px] text-slate-500 font-bold", children: item.workflowId }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("td", { className: "px-6 py-4 border-b border-slate-200  text-[13px] text-slate-500 font-bold", children: item.FromStepId }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("td", { className: "px-6 py-4  border-b border-slate-200 text-align center text-[13px] text-slate-500 font-bold", children: item.ToStepId }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("td", { className: "px-6 py-4 border-b border-slate-200", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                "span",
-                {
-                  className: `inline-flex items-center rounded-full px-3 py-1 text-xs font-semibold
-      ${item.ActionCode === "APPROVE" ? "bg-green-100 text-green-700" : "bg-red-100 text-red-700"}`,
-                  children: item.ActionCode
-                }
-              ) }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("td", { className: "px-6 py-4 border-b border-slate-200", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                "span",
-                {
-                  className: `inline-flex items-center rounded-full px-3 py-1 text-xs font-semibold
-      ${item.ActionName === "APPROVE" ? "bg-green-100 text-green-700" : "bg-red-100 text-red-700"}`,
-                  children: item.ActionName
-                }
-              ) })
-            ]
-          },
-          item.TransitionId
-        )) })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "h-5" }),
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Footer, {}),
-      showModal && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(AddWorkTransitionStepModal, { onClose: () => setShowModal(false) })
-    ] })
-  ] }) });
-}
-
-// src/components/WorkflowType/WorkFlowTypeMain.js
 var import_react13 = __toESM(require("react"));
+var import_link3 = __toESM(require("next/link"));
 
-// src/components/WorkflowType/SearchBar.jsx
-var import_react9 = __toESM(require("react"));
-var import_jsx_runtime10 = require("react/jsx-runtime");
-function SearchBar() {
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "relative max-w-sm w-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "absolute inset-y-0 left-0 flex items-center pl-3.5 pointer-events-none", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("svg", { className: "w-4.5 h-4.5 text-slate-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-      "input",
-      {
-        type: "text",
-        placeholder: "Search workflow name or code...",
-        className: "w-full pl-10 pr-4 py-2.5 border border-slate-200 rounded-xl text-sm bg-slate-50/50 focus:outline-none focus:ring-4 focus:ring-blue-500/10 focus:border-blue-500 text-slate-700 placeholder-slate-400 transition-all shadow-sm"
-      }
-    )
-  ] });
-}
-
-// src/components/WorkflowType/WorkflowTypeTable.jsx
-var import_react10 = __toESM(require("react"));
-var import_jsx_runtime11 = require("react/jsx-runtime");
-function WorkflowTypeTable({ pageSize }) {
-  const initialData = [
-    { id: "1", name: "Citizen Petition Workflow", code: "PET-001", type: "Petition", version: "1", published: true, status: true },
-    { id: "2", name: "Building Permission Workflow", code: "BLD-001", type: "Building Permission", version: "1", published: true, status: true },
-    { id: "3", name: "Leave Application Workflow", code: "LEV-001", type: "Leave", version: "1", published: false, status: true },
-    { id: "4", name: "Grievance Redressal Workflow", code: "GRV-001", type: "Grievance", version: "2", published: true, status: true },
-    { id: "5", name: "Trade License Workflow", code: "TRD-001", type: "Trade License", version: "1", published: true, status: true },
-    { id: "6", name: "Document Verification", code: "DOC-001", type: "Verification", version: "1", published: true, status: true }
-  ];
-  const [data, setData] = (0, import_react10.useState)(initialData);
-  const [sortOrder, setSortOrder] = (0, import_react10.useState)("asc");
-  const [currentPage, setCurrentPage] = (0, import_react10.useState)(1);
-  const totalPages = Math.ceil(data.length / pageSize) || 1;
-  const startIndex = (currentPage - 1) * pageSize;
-  const visibleData = data.slice(startIndex, startIndex + pageSize);
-  const handleSort = (columnKey) => {
-    const isAsc = sortOrder === "asc";
-    setSortOrder(isAsc ? "desc" : "asc");
-    const sortedData = [...data].sort((a, b) => {
-      if (a[columnKey] < b[columnKey]) return isAsc ? -1 : 1;
-      if (a[columnKey] > b[columnKey]) return isAsc ? 1 : -1;
-      return 0;
-    });
-    setData(sortedData);
-  };
-  const toggleSwitch = (id) => {
-    const updatedData = data.map(
-      (item) => item.id === id ? __spreadProps(__spreadValues({}, item), { status: !item.status }) : item
-    );
-    setData(updatedData);
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "space-y-5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "w-full overflow-x-auto border border-slate-200 rounded-2xl shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("table", { className: "w-full text-left border-collapse bg-white", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("tr", { className: "bg-slate-50/70 border-b border-slate-200 text-xs font-bold uppercase tracking-wider text-slate-500", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("th", { className: "py-4.5 px-5 w-20 text-center", children: "S.No" }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("th", { onClick: () => handleSort("name"), className: "py-4.5 px-5 text-sm cursor-pointer select-none hover:text-slate-900", children: [
-          "Workflow Name ",
-          sortOrder === "asc" ? "\u25B2" : "\u25BC"
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("th", { onClick: () => handleSort("code"), className: "py-4.5 px-5 cursor-pointer select-none hover:text-slate-900", children: [
-          "Workflow Code ",
-          sortOrder === "asc" ? "\u25B2" : "\u25BC"
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("th", { onClick: () => handleSort("type"), className: "py-4.5 px-5 cursor-pointer select-none hover:text-slate-900", children: [
-          "Workflow Type ",
-          sortOrder === "asc" ? "\u25B2" : "\u25BC"
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("th", { className: "py-4.5 px-5 text-center", children: "Version" }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("th", { className: "py-4.5 px-5 text-center", children: "Published" }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("th", { className: "py-4.5 px-5 text-center", children: "Status" })
-      ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("tbody", { className: "divide-y divide-slate-100 text-sm text-slate-600", children: visibleData.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("tr", { className: "hover:bg-slate-50/50 transition-colors", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("td", { className: "py-4 px-5 text-center font-medium text-slate-400", children: startIndex + index + 1 }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("td", { className: "py-4 px-5 font-bold text-slate-900 text-[14px]", children: item.name }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("td", { className: "py-4 px-5 text-slate-500", children: item.code }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("td", { className: "py-4 px-5 text-slate-500", children: item.type }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("td", { className: "py-4 px-5 text-center font-semibold text-slate-700", children: item.version }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("td", { className: "py-4 px-5 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: `px-2.5 py-1 rounded-md text-xs font-medium ${item.published ? "bg-green-50 text-green-700 border border-green-200" : "bg-red-50 text-red-700 border border-red-200"}`, children: item.published ? "\u2713 Yes" : "\u2715 No" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("td", { className: "py-4 px-5 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "flex justify-center items-center", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-          "button",
-          {
-            type: "button",
-            onClick: () => toggleSwitch(item.id),
-            className: `relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out outline-none ${item.status ? "bg-blue-600" : "bg-slate-200"}`,
-            children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-              "span",
-              {
-                className: `pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out ${item.status ? "translate-x-5" : "translate-x-0"}`
-              }
-            )
-          }
-        ) }) })
-      ] }, item.id)) })
-    ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex items-center justify-end gap-1 text-[13px] text-slate-700 font-normal mt-4 bg-slate-50/50 p-3 rounded-xl border border-slate-100", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-        "button",
-        {
-          onClick: () => setCurrentPage(1),
-          className: "px-2.5 py-1 text-slate-500 hover:text-slate-900 transition-colors",
-          children: "First"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-        "button",
-        {
-          onClick: () => setCurrentPage((prev) => Math.max(prev - 1, 1)),
-          className: "px-2.5 py-1 text-slate-500 hover:text-slate-900 transition-colors mr-2",
-          children: "\u2039 Prev"
-        }
-      ),
-      [1, 2, 3, 4].map((pageNumber) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-        "button",
-        {
-          onClick: () => setCurrentPage(pageNumber),
-          className: `px-3 py-1 text-center rounded transition-all min-w-[28px] ${currentPage === pageNumber ? "bg-blue-600 text-white font-medium shadow-sm" : "text-slate-600 hover:bg-slate-100"}`,
-          children: pageNumber
-        },
-        pageNumber
-      )),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-        "button",
-        {
-          onClick: () => setCurrentPage((prev) => Math.min(prev + 1, 7)),
-          className: "px-2.5 py-1 text-slate-500 hover:text-slate-900 transition-colors ml-2",
-          children: "Next \u203A"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-        "button",
-        {
-          onClick: () => setCurrentPage(7),
-          className: "px-2.5 py-1 text-slate-500 hover:text-slate-900 transition-colors",
-          children: "Last"
-        }
-      )
-    ] })
-  ] });
-}
-
-// src/components/WorkflowType/AddWorkflowTypeModal.jsx
+// src/components/WorkFlowTransition/AddWorkFlowTransitionModal.js
 var import_react11 = __toESM(require("react"));
 var import_jsx_runtime12 = require("react/jsx-runtime");
-function AddWorkflowTypeModal({ isOpen, onClose }) {
-  if (!isOpen) return null;
+function AddWorkTransitionStepModal({ onClose }) {
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4", children: [
     /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       "div",
@@ -1653,7 +1540,7 @@ function AddWorkflowTypeModal({ isOpen, onClose }) {
           /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5", children: [
             /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { children: [
               /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
-                "Workflow Type ",
+                "Workflow Transition",
                 /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-red-500", children: "*" })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("select", { className: "w-full p-2.5 border border-slate-200 rounded-xl text-xs bg-white text-slate-700 focus:outline-none focus:ring-2 focus:ring-indigo-500/10 focus:border-indigo-500", children: [
@@ -1837,69 +1724,179 @@ function AddWorkflowTypeModal({ isOpen, onClose }) {
   ] });
 }
 
-// src/components/WorkflowType/AddButton.jsx
+// src/components/WorkFlowTransition/Transitionheader.js
 var import_react12 = __toESM(require("react"));
+var import_link2 = __toESM(require("next/link"));
 var import_jsx_runtime13 = require("react/jsx-runtime");
-function AddButton({ onOpen }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
-    "button",
-    {
-      onClick: onOpen,
-      className: "bg-blue-600 hover:bg-blue-700 text-white px-5 py-2.5 rounded-xl font-bold text-sm shadow-md shadow-blue-500/20 hover:shadow-lg hover:shadow-blue-500/30 transition-all active:scale-95 flex items-center gap-2",
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { className: "w-4 h-4 stroke-[2.5]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 4.5v15m7.5-7.5h-15" }) }),
-        "Add Workflow Type"
-      ]
-    }
-  );
+function Header() {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "px-6 py-5 border-b border-gray-200", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("h1", { className: "m-0 text-[30px] leading-tight font-semibold text-[#1E293B] tracking-tight", children: "Workflow" }),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "mt-2 text-[13px] font-medium", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("a", { href: "/dashboard", className: "text-blue-600 hover:underline", children: "Dashboard" }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "mx-2 text-slate-400", children: ">" }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("a", { href: "/masters", className: "text-blue-600 hover:underline", children: "Masters" }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "mx-2 text-slate-400", children: ">" }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("a", { href: "/workflowTransition", className: "text-blue-600 hover:underline", children: "Workflow Transition" }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "mx-2 text-slate-400", children: ">" }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-slate-500", children: "Workflow Step" })
+    ] })
+  ] });
 }
 
-// src/components/WorkflowType/WorkFlowTypeMain.js
+// src/components/WorkFlowTransition/Transitiontable.js
 var import_jsx_runtime14 = require("react/jsx-runtime");
-function WorkflowTypeMain() {
-  const [modalOpen, setModalOpen] = (0, import_react13.useState)(false);
-  const [pageSize, setPageSize] = (0, import_react13.useState)(10);
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "min-h-screen bg-slate-50 p-4 md:p-6", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "w-full space-y-5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex flex-col sm:flex-row sm:items-center sm:justify-between bg-white p-6 rounded-2xl border border-slate-200/80 shadow-sm gap-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("h1", { className: "text-2xl font-extrabold text-slate-900 tracking-tight", children: "Workflow Type" }),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("p", { className: "text-xs text-slate-400 mt-1", children: [
-            "Dashboard > Types > ",
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "text-blue-600 font-semibold", children: "Workflow Type" })
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(AddButton, { onOpen: () => setModalOpen(true) })
+var WorkflowTransition = [
+  {
+    TransitionId: 1,
+    workflowId: 1,
+    FromStepId: 2,
+    ToStepId: 1,
+    ActionCode: "APPROVE",
+    ActionName: "APPROVE"
+  },
+  {
+    TransitionId: 1,
+    workflowId: 1,
+    FromStepId: 2,
+    ToStepId: 1,
+    ActionCode: "APPROVE",
+    ActionName: "APPROVE"
+  },
+  {
+    TransitionId: 1,
+    workflowId: 1,
+    FromStepId: 2,
+    ToStepId: 1,
+    ActionCode: "APPROVE",
+    ActionName: "APPROVE"
+  },
+  {
+    TransitionId: 1,
+    workflowId: 1,
+    FromStepId: 2,
+    ToStepId: 1,
+    ActionCode: "RETURN",
+    ActionName: "APPROVE"
+  },
+  {
+    TransitionId: 1,
+    workflowId: 1,
+    FromStepId: 2,
+    ToStepId: 1,
+    ActionCode: "APPROVE",
+    ActionName: "RETURN"
+  }
+];
+function WorkFlowTransition() {
+  const [showModal, setShowModal] = (0, import_react13.useState)(false);
+  const [pageSize, setPageSize] = (0, import_react13.useState)(5);
+  const [sortConfig, setSortConfig] = (0, import_react13.useState)({
+    key: "",
+    direction: "asc"
+  });
+  const handleSort = (key) => {
+    let direction = "asc";
+    if (sortConfig.key === key && sortConfig.direction === "asc") {
+      direction = "desc";
+    }
+    setSortConfig({
+      key,
+      direction
+    });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "p-6 bg-[#f5f7fb] min-h-screen font-sans text-slate-700", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "bg-white rounded-2xl shadow-md overflow-hidden", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Header, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "px-6 py-5 border-b border-gray-200 ", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex justify-between items-center flex-wrap gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        "input",
+        {
+          type: "text",
+          placeholder: "Search workflow Transition...",
+          className: "w-[300px] px-4 py-2.5 border border-slate-200/80 rounded-lg text-[13px] text-slate-600 focus:outline-none bg-slate-50"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "px-4 py-3 border-b border-slate-200 text-[13px] text-slate-500 font-bold", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { children: "Show" }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+          "select",
+          {
+            value: pageSize,
+            onChange: (e) => setPageSize(Number(e.target.value)),
+            className: "inline-flex item-center px-3 py-1 rounded-md bg-[#f1f5f9] text-[#334155] text-xs font-semibold border border-[#e2e8f0]",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("option", { value: 5, children: "5" }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("option", { value: 10, children: "10" }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("option", { value: 25, children: "25" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { children: "entries" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-200/80 shadow-sm space-y-5", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex justify-between items-center w-full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "w-full max-w-xs", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SearchBar, {}) }),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
-            "select",
-            {
-              value: pageSize,
-              onChange: (e) => setPageSize(Number(e.target.value)),
-              className: "border border-slate-200 rounded-lg px-3 py-2 text-sm bg-white cursor-pointer outline-none shadow-sm text-slate-700",
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("option", { value: 2, children: "2 Rows (Testing)" }),
-                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("option", { value: 10, children: "10 Rows" }),
-                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("option", { value: 20, children: "20 Rows" }),
-                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("option", { value: 50, children: "50 Rows" })
-              ]
-            }
-          ) })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(WorkflowTypeTable, { pageSize })
-      ] })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-      AddWorkflowTypeModal,
-      {
-        isOpen: modalOpen,
-        onClose: () => setModalOpen(false)
-      }
-    )
-  ] });
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        "button",
+        {
+          onClick: () => setShowModal(true),
+          className: "px-5 py-2.5 bg-blue-600 text-white rounded-lg text-[13px] font-semibold hover:bg-blue-700 transition-colors",
+          children: "+ Add Workflow Transition"
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "overflow-x-auto", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("table", { className: "w-full border-collapse", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("tr", { className: "bg-slate-50/70 border-b border-slate-200 text-xs font-bold uppercase tracking-wider text-slate-500", children: [
+          { label: "TransitionId", key: "TransitionId" },
+          { label: "WorkflowId", key: "workflowId" },
+          { label: "FromStepId", key: "FromStepId" },
+          { label: "ToStepId", key: "ToStepId" },
+          { label: "ActionCode", key: "ActionCode" },
+          { label: "ActionName", key: "ActionName" }
+        ].map((column) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          "th",
+          {
+            onClick: () => handleSort(column.key),
+            className: "px-6 py-4 text-left border-b border-gray-200 text-[11px] font-bold uppercase tracking-wider text-slate-500",
+            children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { children: column.label }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "text-gray-400 text-xs", children: sortConfig.key === column.key ? sortConfig.direction === "asc" ? "\u25B2" : "\u25BC" : "\u2195" })
+            ] })
+          },
+          column.key
+        )) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("tbody", { children: WorkflowTransition.slice(0, pageSize).map((item) => /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+          "tr",
+          {
+            className: "hover:bg-slate-50 transition-colors",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("td", { className: "px-6 p-4 border-b border-slate-200 text-[13px] text-slate-500 font-bold", children: item.TransitionId }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("td", { className: "px-6 py-4 border-b border-slate-200 text-[13px] text-slate-500 font-bold", children: item.workflowId }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("td", { className: "px-6 py-4 border-b border-slate-200  text-[13px] text-slate-500 font-bold", children: item.FromStepId }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("td", { className: "px-6 py-4  border-b border-slate-200 text-align center text-[13px] text-slate-500 font-bold", children: item.ToStepId }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("td", { className: "px-6 py-4 border-b border-slate-200", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                "span",
+                {
+                  className: `inline-flex items-center rounded-full px-3 py-1 text-xs font-semibold
+      ${item.ActionCode === "APPROVE" ? "bg-green-100 text-green-700" : "bg-red-100 text-red-700"}`,
+                  children: item.ActionCode
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("td", { className: "px-6 py-4 border-b border-slate-200", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                "span",
+                {
+                  className: `inline-flex items-center rounded-full px-3 py-1 text-xs font-semibold
+      ${item.ActionName === "APPROVE" ? "bg-green-100 text-green-700" : "bg-red-100 text-red-700"}`,
+                  children: item.ActionName
+                }
+              ) })
+            ]
+          },
+          item.TransitionId
+        )) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "h-5" }),
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Footer, {}),
+      showModal && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(AddWorkTransitionStepModal, { onClose: () => setShowModal(false) })
+    ] })
+  ] }) });
 }
 
 // src/components/Sidebar.jsx
@@ -1938,40 +1935,17 @@ var trackingItems = [
   { name: "Audit Log", path: "/WorkflowType", icon: import_react15.RiShieldCheckLine },
   { name: "Movement History", path: "/WorkflowType", icon: import_react15.RiHistoryLine }
 ];
-function Sidebar({ isOpen, onToggle, children }) {
+function Sidebar({ isOpen, onToggle, childrens }) {
   const router = (0, import_router.useRouter)();
   const [workflowOpen, setWorkflowOpen] = (0, import_react14.useState)(false);
   const [permissionOpen, setPermissionOpen] = (0, import_react14.useState)(false);
   const [hierarchyOpen, setHierarchyOpen] = (0, import_react14.useState)(false);
   const [documentOpen, setDocumentOpen] = (0, import_react14.useState)(false);
-  const [activeComponent, setActiveComponent] = (0, import_react14.useState)(null);
   const [filesOpen, setFilesOpen] = (0, import_react14.useState)(false);
   const [tasksOpen, setTasksOpen] = (0, import_react14.useState)(false);
   const [trackingOpen, setTrackingOpen] = (0, import_react14.useState)(false);
   const [communicationOpen, setCommunicationOpen] = (0, import_react14.useState)(false);
-  (0, import_react14.useEffect)(() => {
-    const handleRouteChange = () => {
-      setActiveComponent(null);
-    };
-    router.events.on("routeChangeStart", handleRouteChange);
-    return () => {
-      router.events.off("routeChangeStart", handleRouteChange);
-    };
-  }, []);
-  const renderContent = () => {
-    switch (activeComponent) {
-      case "workflowType":
-        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(WorkflowTypeMain, {});
-      case "workflow":
-        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(WorkflowMasterMain, {});
-      case "workflowStep":
-        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(WorkflowStep, {});
-      case "workflowTransition":
-        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(WorkFlowTransition, {});
-      default:
-        return children;
-    }
-  };
+  const [activeComponent, setActiveComponent] = (0, import_react14.useState)("workflowType");
   const renderMenuItemold = (item) => {
     const Icon = item.icon;
     return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
@@ -2001,11 +1975,11 @@ function Sidebar({ isOpen, onToggle, children }) {
   };
   const renderMenuItem = (item) => {
     const Icon = item.icon;
-    const handleClick = async () => {
+    const handleClick = () => {
       if (item.component) {
-        await router.push("/", void 0, { shallow: true });
+        router.push("/", void 0, { shallow: true });
         setActiveComponent(item.component);
-      } else {
+      } else if (item.path) {
         setActiveComponent(null);
         router.push(item.path);
       }
@@ -2027,6 +2001,20 @@ function Sidebar({ isOpen, onToggle, children }) {
       item.name
     );
   };
+  const renderContent = () => {
+    switch (activeComponent) {
+      case "workflowType":
+        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(WorkflowTypeMains, {});
+      case "workflow":
+        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(WorkflowMasterMain, {});
+      case "workflowStep":
+        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(WorkflowStep, {});
+      case "workflowTransition":
+        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(WorkFlowTransition, {});
+      default:
+        return childrens;
+    }
+  };
   const renderDropdown = (title, open, setOpen, items) => {
     return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "mb-2", children: [
       /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
@@ -2227,15 +2215,16 @@ function Sidebar({ isOpen, onToggle, children }) {
 }
 
 // src/components/Layout.jsx
+var import_react16 = require("react");
 var import_jsx_runtime16 = require("react/jsx-runtime");
 var Layout = ({ children }) => {
   const [isOpen, setIsOpen] = (0, import_react16.useState)(true);
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex h-screen", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex min-h-screen", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     Sidebar,
     {
       isOpen,
       onToggle: () => setIsOpen(!isOpen),
-      children
+      childrens: children
     }
   ) });
 };