flowcore-fn 2.8.9 → 2.9.5

package/dist/pkg-index.js

@@ -1,10 +1,27 @@
 "use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -30,8 +47,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/pkg-index.jsx
 var pkg_index_exports = {};
 __export(pkg_index_exports, {
-  AdminPanel: () => AdminPanel_default,
-  Sidebar: () => Home,
+  Layout: () => Layout_default,
+  Sidebar: () => Layout_default,
   WorkflowPage: () => WorkflowPage
 });
 module.exports = __toCommonJS(pkg_index_exports);
@@ -45,10 +62,15 @@ var import_jsx_runtime = require("react/jsx-runtime");
 function Footer() {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex justify-between items-center px-6 py-4 border-t border-gray-200 bg-white", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-sm text-slate-500", children: "Showing 1 to 5 of 5 entries" }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "px-3 py-1.5 border border-slate-200 rounded-lg bg-white text-slate-600 hover:bg-slate-50 shadow-sm", children: "\u2039" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "px-3.5 py-1.5 bg-blue-600 text-white rounded-lg font-bold shadow-md shadow-blue-500/20", children: "1" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "px-3 py-1.5 border border-slate-200 rounded-lg bg-white text-slate-600 hover:bg-slate-50 shadow-sm", children: "\u203A" })
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "px-3 py-1.5 border border-slate-200 rounded-lg bg-white text-slate-600 shadow-sm transition-all duration-200 hover:bg-blue-600 hover:text-white hover:border-blue-600", children: "First" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "px-3 py-1.5 border border-slate-200 rounded-lg bg-white text-slate-600 shadow-sm transition-all duration-200 hover:bg-blue-600 hover:text-white hover:border-blue-600", children: "\u2039 Prev" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "w-9 h-9 border border-slate-200 rounded-lg bg-white text-slate-600 shadow-sm transition-all duration-200 hover:bg-blue-600 hover:text-white hover:border-blue-600", children: "1" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "w-9 h-9 border border-slate-200 rounded-lg bg-white text-slate-600 shadow-sm transition-all duration-200 hover:bg-blue-600 hover:text-white hover:border-blue-600", children: "2" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "w-9 h-9 border border-slate-200 rounded-lg bg-white text-slate-600 shadow-sm transition-all duration-200 hover:bg-blue-600 hover:text-white hover:border-blue-600", children: "3" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "w-9 h-9 border border-slate-200 rounded-lg bg-white text-slate-600 shadow-sm transition-all duration-200 hover:bg-blue-600 hover:text-white hover:border-blue-600", children: "4" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "px-3 py-1.5 border border-slate-200 rounded-lg bg-white text-slate-600 shadow-sm transition-all duration-200 hover:bg-blue-600 hover:text-white hover:border-blue-600", children: "Next \u203A" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "px-3 py-1.5 border border-slate-200 rounded-lg bg-white text-slate-600 shadow-sm transition-all duration-200 hover:bg-blue-600 hover:text-white hover:border-blue-600", children: "Last" })
     ] })
   ] });
 }
@@ -56,7 +78,7 @@ function Footer() {
 // src/components/WorkflowStep/main.js
 var import_link = __toESM(require("next/link"));
 
-// src/components/AddWorkflowStepModal.js
+// src/components/WorkflowStep/AddWorkflowStepModal.js
 var import_react2 = __toESM(require("react"));
 var import_jsx_runtime2 = require("react/jsx-runtime");
 function AddWorkflowStepModal({ onClose }) {
@@ -350,6 +372,21 @@ var workflowSteps = [
 ];
 function WorkflowStep() {
   const [showModal, setShowModal] = (0, import_react3.useState)(false);
+  const [pageSize, setPageSize] = (0, import_react3.useState)(5);
+  const [sortConfig, setSortConfig] = (0, import_react3.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_runtime3.jsx)("div", { className: "p-6 bg-[#f5f7fb] min-h-screen font-sans text-slate-700", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "bg-white rounded-2xl shadow-md overflow-hidden", children: [
     /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "px-6 py-5 border-b border-gray-200", children: [
       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("h1", { className: "m-0 text-[30px] leading-tight font-semibold text-[#1E293B] tracking-tight", children: "Workflow Step" }),
@@ -372,38 +409,59 @@ function WorkflowStep() {
           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_runtime3.jsxs)("div", { className: "px-4 py-3 border-b border-slate-200 text-[13px] text-slate-500 font-bold", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: "Show" }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.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_runtime3.jsx)("option", { value: 5, children: "5" }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: 10, children: "10" }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: 25, children: "25" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: "entries" })
+      ] }),
       /* @__PURE__ */ (0, import_jsx_runtime3.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 Type"
+          children: "+ Add Workflow Step"
         }
       )
     ] }) }),
     /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "overflow-x-auto", children: [
       /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("table", { className: "w-full border-collapse", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("tr", { className: "bg-slate-50/70 border-b border-slate-200 text-[11px] font-bold uppercase tracking-wider text-slate-500", children: [
-          "WorkflowStepId",
-          "WorkflowId",
-          "StepCode",
-          "StepName",
-          "SequenceNo",
-          "SLA Type",
-          "SLA Value",
-          "Reminder Before",
-          "Escalation After",
-          "Working Hours Only",
-          "Exclude Holidays"
-        ].map((heading) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("tr", { className: "bg-slate-50/70 border-b border-slate-200 text-xs font-bold uppercase tracking-wider text-slate-500", children: [
+          { label: "WorkflowStepId", key: "workflowStepId" },
+          { label: "WorkflowId", key: "workflowId" },
+          { label: "StepCode", key: "stepCode" },
+          { label: "StepName", key: "stepName" },
+          { label: "SequenceNo", key: "sequenceNo" },
+          { label: "SLA Type", key: "slaType" },
+          { label: "SLA Value", key: "slaValue" },
+          { label: "Reminder Before", key: "reminderBefore" },
+          { label: "Escalation After", key: "escalationAfter" },
+          { label: "Working Hours Only", key: "workingHoursOnly" },
+          { label: "Exclude Holidays", key: "excludeHolidays" }
+        ].map((column) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
           "th",
           {
+            onClick: () => handleSort(column.key),
             className: "px-4 py-3 text-left border-b border-gray-200 text-[11px] font-bold uppercase tracking-wider text-slate-500",
-            children: heading
+            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: column.label }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-gray-400 text-xs", children: sortConfig.key === column.key ? sortConfig.direction === "asc" ? "\u25B2" : "\u25BC" : "\u2195" })
+            ] })
           },
-          heading
+          column.key
         )) }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("tbody", { children: workflowSteps.map((item) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("tbody", { children: workflowSteps.slice(0, pageSize).map((item) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
           "tr",
           {
             className: "hover:bg-slate-50 transition-colors",
@@ -437,189 +495,1642 @@ function WorkflowPage() {
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(WorkflowStep, {});
 }
 
-// src/pages/Sidebar.js
-var import_react6 = require("react");
+// src/components/Layout.jsx
+var import_react16 = require("react");
 
 // src/components/Sidebar.jsx
-var import_react4 = require("react");
-var import_react5 = require("@remixicon/react");
+var import_react14 = require("react");
+var import_react15 = require("@remixicon/react");
 var import_router = require("next/router");
+
+// src/components/workflowMaster/workFlowMasterMain.js
+var import_react5 = require("react");
+
+// src/components/workflowMaster/workflowTable.jsx
+var import_react4 = require("react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
-var workflowItems = [
-  { name: "Workflow Type", path: "/WorkflowType", icon: import_react5.RiGitMergeLine },
-  { name: "Workflow", path: "/workflow", icon: import_react5.RiNodeTree },
-  { name: "Workflow Step", path: "/workflowMaster", icon: import_react5.RiGitBranchLine },
-  { name: "Workflow Transition", path: "/TaskPermissionPage", icon: import_react5.RiCornerDownRightLine }
-];
-var permissionItems = [
-  { name: "Task Permission", path: "/WorkflowType", icon: import_react5.RiUserSettingsLine },
-  { name: "Assignment Rule", path: "/WorkflowType", icon: import_react5.RiFileShieldLine }
-];
-var hierarchyItems = [
-  { name: "Hierarchy Node", path: "/WorkflowType", icon: import_react5.RiNodeTree },
-  { name: "User Hierarchy Mapping", path: "/WorkflowType", icon: import_react5.RiUserSharedLine },
-  { name: "Workflow Settings", path: "/WorkflowType", icon: import_react5.RiSettings4Line }
-];
-var documentItems = [
-  { name: "Document Configuration", path: "/WorkflowType", icon: import_react5.RiFileSettingsLine }
-];
-var fileItems = [
-  { name: "File Instance", path: "/WorkflowType", icon: import_react5.RiFileList3Line },
-  { name: "File Pool", path: "/WorkflowType", icon: import_react5.RiDatabase2Line },
-  { name: "Uploaded Document", path: "/WorkflowType", icon: import_react5.RiFileUploadLine }
-];
-var communicationItems = [
-  { name: "Notification", path: "/WorkflowType", icon: import_react5.RiNotification4Line },
-  { name: "Comment", path: "/WorkflowType", icon: import_react5.RiChat3Line }
-];
-var taskItems = [
-  { name: "Task Instance", path: "/WorkflowType", icon: import_react5.RiCheckboxMultipleLine }
-];
-var trackingItems = [
-  { name: "Audit Log", path: "/WorkflowType", icon: import_react5.RiShieldCheckLine },
-  { name: "Movement History", path: "/WorkflowType", icon: import_react5.RiHistoryLine }
-];
-function Sidebar({ isOpen, onToggle }) {
-  const router = (0, import_router.useRouter)();
-  const [workflowOpen, setWorkflowOpen] = (0, import_react4.useState)(false);
-  const [permissionOpen, setPermissionOpen] = (0, import_react4.useState)(false);
-  const [hierarchyOpen, setHierarchyOpen] = (0, import_react4.useState)(false);
-  const [documentOpen, setDocumentOpen] = (0, import_react4.useState)(false);
-  const [filesOpen, setFilesOpen] = (0, import_react4.useState)(false);
-  const [tasksOpen, setTasksOpen] = (0, import_react4.useState)(false);
-  const [trackingOpen, setTrackingOpen] = (0, import_react4.useState)(false);
-  const [communicationOpen, setCommunicationOpen] = (0, import_react4.useState)(false);
-  const renderMenuItem = (item) => {
-    const Icon = item.icon;
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
-      "button",
-      {
-        type: "button",
-        className: `
-        flex h-[56px] w-full items-center gap-[17px]
-        rounded-[9px] px-[17px]
-        text-left transition-colors duration-150
-        ${router.pathname === item.path ? "bg-blue-50 text-blue-600" : "text-[#344261] hover:bg-[#F6F8FC]"}
-      `,
-        onClick: () => router.push(item.path),
-        children: [
+function WorkflowTable({
+  search = "",
+  workflows = [],
+  workflowtoggle,
+  entriesPerPage,
+  setEntriesPerPage
+}) {
+  const [sortField, setSortField] = (0, import_react4.useState)("");
+  const [sortDirection, setSortDirection] = (0, import_react4.useState)("asc");
+  const [currentPage, setCurrentPage] = (0, import_react4.useState)(100);
+  (0, import_react4.useEffect)(() => {
+    setCurrentPage(100);
+  }, [search]);
+  const handleSort = (field) => {
+    if (sortField === field) {
+      setSortDirection(sortDirection === "asc" ? "desc" : "asc");
+    } else {
+      setSortField(field);
+      setSortDirection("asc");
+    }
+  };
+  const filteredworkflows = workflows.filter(
+    (workflow) => {
+      var _a, _b;
+      return ((_a = workflow == null ? void 0 : workflow.name) == null ? void 0 : _a.toLowerCase().includes(search.toLowerCase())) || ((_b = workflow == null ? void 0 : workflow.workflowcode) == null ? void 0 : _b.toLowerCase().includes(search.toLowerCase()));
+    }
+  );
+  const sortedWorkflows = [...filteredworkflows].sort((a, b) => {
+    if (!sortField) return 0;
+    let valA = a[sortField] !== void 0 && a[sortField] !== null ? a[sortField].toString().toLowerCase() : "";
+    let valB = b[sortField] !== void 0 && b[sortField] !== null ? b[sortField].toString().toLowerCase() : "";
+    if (sortField === "version") {
+      valA = Number(a[sortField]) || 0;
+      valB = Number(b[sortField]) || 0;
+    }
+    if (valA < valB) return sortDirection === "asc" ? -1 : 1;
+    if (valA > valB) return sortDirection === "asc" ? 1 : -1;
+    return 0;
+  });
+  const totalEntries = sortedWorkflows.length;
+  const totalPages = Math.ceil(totalEntries / (entriesPerPage || 10)) || 1;
+  const activePage = currentPage > totalPages ? 1 : currentPage;
+  const indexOfLastEntry = activePage * (entriesPerPage || 10);
+  const indexOfFirstEntry = indexOfLastEntry - (entriesPerPage || 10);
+  const currentDisplayedWorkflows = sortedWorkflows.slice(indexOfFirstEntry, indexOfLastEntry);
+  const renderSortIcon = (field) => {
+    if (sortField !== field) {
+      return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { className: "w-3.5 h-3.5 text-slate-300", fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 3.25a.75.75 0 01.53.22l3.25 3.25a.75.75 0 11-1.06 1.06L12.75 5.81v12.38l1.97-1.97a.75.75 0 111.06 1.06l-3.25 3.25a.75.75 0 01-1.06 0l-3.25-3.25a.75.75 0 111.06-1.06l1.97 1.97V5.81L9.28 7.78a.75.75 0 01-1.06-1.06l3.25-3.25a.75.75 0 01.53-.22z" }) });
+    }
+    return sortDirection === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { className: "w-3.5 h-3.5 text-blue-600", fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12.53 3.47a.75.75 0 00-1.06 0l-4 4a.75.75 0 001.06 1.06L11 5.81V19a.75.75 0 001.5 0V5.81l2.47 2.47a.75.75 0 001.06-1.06l-4-4z" }) }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { className: "w-3.5 h-3.5 text-blue-600", fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M11.47 20.53a.75.75 0 001.06 0l4-4a.75.75 0 00-1.06-1.06L13 18.19V5a.75.75 0 00-1.5 0v13.19l-2.47-2.47a.75.75 0 00-1.06 1.06l4 4z" }) });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "border border-slate-100 rounded-2xl overflow-hidden bg-white shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("table", { className: "w-full border-collapse", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("thead", { className: "bg-[#f8fafc]", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("tr", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("th", { className: "px-6 py-4 text-left text-xs font-bold text-slate-500 uppercase tracking-wider w-20", children: "S.No" }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          "th",
+          {
+            onClick: () => handleSort("name"),
+            className: "px-6 py-4 text-left text-xs font-bold text-slate-500 uppercase tracking-wider cursor-pointer select-none hover:bg-slate-100 transition-colors",
+            children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-center gap-1.5", children: [
+              "Workflow Name ",
+              renderSortIcon("name")
+            ] })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          "th",
+          {
+            onClick: () => handleSort("workflowcode"),
+            className: "px-6 py-4 text-left text-xs font-bold text-slate-500 uppercase tracking-wider cursor-pointer select-none hover:bg-slate-100 transition-colors",
+            children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-center gap-1.5", children: [
+              "Workflow Code ",
+              renderSortIcon("workflowcode")
+            ] })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          "th",
+          {
+            onClick: () => handleSort("workflowtype"),
+            className: "px-6 py-4 text-left text-xs font-bold text-slate-500 uppercase tracking-wider cursor-pointer select-none hover:bg-slate-100 transition-colors",
+            children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-center gap-1.5", children: [
+              "Workflow Type ",
+              renderSortIcon("workflowtype")
+            ] })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          "th",
+          {
+            onClick: () => handleSort("version"),
+            className: "px-6 py-4 text-left text-xs font-bold text-slate-500 uppercase tracking-wider cursor-pointer select-none hover:bg-slate-100 transition-colors w-24",
+            children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-center gap-1.5", children: [
+              "Version ",
+              renderSortIcon("version")
+            ] })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("th", { className: "px-6 py-4 text-center text-xs font-bold text-slate-500 uppercase tracking-wider w-32", children: "Published" }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("th", { className: "px-6 py-4 text-center text-xs font-bold text-slate-500 uppercase tracking-wider w-32", children: "Status" })
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("tbody", { className: "divide-y divide-slate-100", children: currentDisplayedWorkflows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { colSpan: 7, className: "px-6 py-12 text-center text-sm font-medium text-slate-400 bg-white", children: "No workflows found matching your criteria." }) }) : currentDisplayedWorkflows.map((workflow, index) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("tr", { className: "hover:bg-slate-50/50 transition", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { className: "px-6 py-4 text-sm text-slate-400 font-medium", children: indexOfFirstEntry + index + 1 }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { className: "px-6 py-4 text-sm font-semibold text-slate-800", children: workflow.name }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { className: "px-6 py-4 text-sm text-slate-500 font-medium", children: workflow.workflowcode }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { className: "px-6 py-4 text-sm text-slate-500 font-medium", children: workflow.workflowtype }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { className: "px-6 py-4 text-sm text-slate-800 font-bold", children: workflow.version }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { className: "px-6 py-4 text-center", children: (() => {
+          var _a;
+          const isPublished = ((_a = workflow == null ? void 0 : workflow.published) == null ? void 0 : _a.toString().toLowerCase()) === "yes" || (workflow == null ? void 0 : workflow.published) === true;
+          return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: `inline-flex items-center gap-1 px-2.5 py-1 rounded-md text-xs font-semibold ${isPublished ? "bg-emerald-50 text-emerald-600 border border-emerald-200/50" : "bg-rose-50 text-rose-600 border border-rose-200/50"}`, children: isPublished ? "\u2713 Yes" : "\u2715 No" });
+        })() }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { className: "px-6 py-4 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex justify-center items-center", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("label", { className: "relative inline-flex items-center cursor-pointer group", children: [
           /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-            "span",
+            "input",
             {
-              className: "\r\n            flex h-[20px] w-[20px] shrink-0\r\n            items-center justify-center\r\n            rounded-[6px] text-[#405170]\r\n          ",
-              children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon, { size: 17 })
+              type: "checkbox",
+              checked: workflow.status || false,
+              onChange: () => workflowtoggle && workflowtoggle(workflow.id),
+              className: "sr-only peer"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "whitespace-nowrap text-[14px] font-medium leading-[22px]", children: item.name })
-        ]
-      },
-      item.name
-    );
-  };
-  const renderDropdown = (title, open, setOpen, items) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "mb-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "w-10 h-6 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-[4px] after:start-[4px] after:bg-white after:border-slate-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-blue-600 group-hover:scale-105 transition-transform" })
+        ] }) }) })
+      ] }, workflow.id)) })
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "bg-[#fcfdfe] border border-slate-100 rounded-2xl px-6 py-4 flex items-center justify-end gap-6 shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
         "button",
         {
-          type: "button",
-          onClick: () => setOpen(!open),
-          className: "\r\n          flex h-[50px] w-full items-center justify-between\r\n          rounded-[9px] px-[17px]\r\n          text-left text-[#344261]\r\n          transition-colors duration-150\r\n          hover:bg-[#F6F8FC]\r\n        ",
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "text-[16px] font-semibold", children: title }),
-            open ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react5.RiArrowDownSLine, { size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react5.RiArrowRightSLine, { size: 18 })
-          ]
+          onClick: () => setCurrentPage(1),
+          disabled: activePage === 1,
+          className: `px-3 py-1.5 text-xs font-semibold rounded-lg transition ${activePage === 1 ? "text-slate-300 cursor-not-allowed" : "text-slate-500 hover:bg-slate-50 cursor-pointer"}`,
+          children: "First"
         }
       ),
-      open && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "ml-[8px] border-l border-[#E5E9F1] pl-[4px]", children: items.map(renderMenuItem) })
-    ] });
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        "button",
+        {
+          onClick: () => setCurrentPage((prev) => Math.max(prev - 1, 1)),
+          disabled: activePage === 1,
+          className: `px-3 py-1.5 text-xs font-semibold rounded-lg transition flex items-center gap-1 ${activePage === 1 ? "text-slate-300 cursor-not-allowed" : "text-slate-500 hover:bg-slate-50 cursor-pointer"}`,
+          children: "\u2039 Prev"
+        }
+      ),
+      Array.from({ length: totalPages }, (_, index) => {
+        const pageNum = index + 1;
+        return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          "button",
+          {
+            onClick: () => setCurrentPage(pageNum),
+            className: `w-8 h-8 text-xs font-bold rounded-lg transition ${activePage === pageNum ? "bg-[#1e60ff] text-white shadow-sm shadow-blue-500/20" : "text-slate-500 hover:bg-slate-50 cursor-pointer"}`,
+            children: pageNum
+          },
+          pageNum
+        );
+      }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        "button",
+        {
+          onClick: () => setCurrentPage((prev) => Math.min(prev + 1, totalPages)),
+          disabled: activePage === totalPages,
+          className: `px-3 py-1.5 text-xs font-semibold rounded-lg transition flex items-center gap-1 ${activePage === totalPages ? "text-slate-300 cursor-not-allowed" : "text-slate-500 hover:bg-slate-50 cursor-pointer"}`,
+          children: "Next \u203A"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        "button",
+        {
+          onClick: () => setCurrentPage(totalPages),
+          disabled: activePage === totalPages,
+          className: `px-3 py-1.5 text-xs font-semibold rounded-lg transition ${activePage === totalPages ? "text-slate-300 cursor-not-allowed" : "text-slate-500 hover:bg-slate-50 cursor-pointer"}`,
+          children: "Last"
+        }
+      )
+    ] }) })
+  ] });
+}
+
+// src/components/workflowMaster/workFlowMasterMain.js
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function WorkflowMasterMain() {
+  const [search, setSearch] = (0, import_react5.useState)("");
+  const [entriesPerPage, setEntriesPerPage] = (0, import_react5.useState)(10);
+  const [isModalOpen, setIsModalOpen] = (0, import_react5.useState)(false);
+  const [newWorkflow, setNewWorkflow] = (0, import_react5.useState)({
+    name: "",
+    workflowcode: "",
+    workflowtype: "",
+    version: "1",
+    published: "No",
+    description: ""
+  });
+  const [workflows, setWorkflows] = (0, import_react5.useState)([
+    {
+      id: 1,
+      name: "Trade License Workflow",
+      workflowcode: "TRD-001",
+      workflowtype: "Trade License",
+      version: "1",
+      published: "Yes",
+      status: true
+    },
+    {
+      id: 2,
+      name: "Citizen Petition Workflow",
+      workflowcode: "PET-001",
+      workflowtype: "Petition",
+      version: "1",
+      published: "Yes",
+      status: true
+    },
+    {
+      id: 3,
+      name: "Leave Application Workflow",
+      workflowcode: "LEV-001",
+      workflowtype: "Leave",
+      version: "1",
+      published: "No",
+      status: true
+    },
+    {
+      id: 4,
+      name: "Grievance Redressal Workflow",
+      workflowcode: "GRV-001",
+      workflowtype: "Grievance",
+      version: "2",
+      published: "Yes",
+      status: true
+    },
+    {
+      id: 5,
+      name: "Document Verification",
+      workflowcode: "DOC-001",
+      workflowtype: "Verification",
+      version: "1",
+      published: "Yes",
+      status: true
+    },
+    {
+      id: 6,
+      name: "Building Permission Workflow",
+      workflowcode: "BLD-001",
+      workflowtype: "Building Permission",
+      version: "1",
+      published: "Yes",
+      status: true
+    },
+    {
+      id: 7,
+      name: "Property Tax Assessment",
+      workflowcode: "PTX-001",
+      workflowtype: "Property Tax",
+      version: 1,
+      published: true,
+      status: true
+    },
+    {
+      id: 8,
+      name: "Water Connection Request",
+      workflowcode: "WTR-001",
+      workflowtype: "Utility Services",
+      version: 1,
+      published: true,
+      status: true
+    },
+    {
+      id: 9,
+      name: "Vendor Registration",
+      workflowcode: "VND-001",
+      workflowtype: "Procurement",
+      version: 2,
+      published: true,
+      status: false
+    },
+    {
+      id: 10,
+      name: "No Objection Certificate",
+      workflowcode: "NOC-001",
+      workflowtype: "Certification",
+      version: 1,
+      published: false,
+      status: true
+    },
+    {
+      id: 11,
+      name: "Birth Certificate Application",
+      workflowcode: "BRT-001",
+      workflowtype: "Registry",
+      version: 1,
+      published: true,
+      isActive: true
+    }
+  ]);
+  const handleToggle = (id) => {
+    setWorkflows((prev) => prev.map((w) => w.id === id ? __spreadProps(__spreadValues({}, w), { status: !w.status }) : w));
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
-      "aside",
-      {
-        className: `
-          flex h-screen flex-col overflow-hidden
-          border-r border-[#E5E9F1] bg-white
-          font-sans text-[#273657]
-          transition-all duration-300 ease-in-out
-          ${isOpen ? "w-[245px] min-w-[245px] translate-x-0 opacity-100" : "w-0 min-w-0 -translate-x-full opacity-0"}
-        `,
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
-            "header",
+  const handleAddWorkflow = (e) => {
+    e.preventDefault();
+    if (!newWorkflow.name || !newWorkflow.workflowcode || !newWorkflow.workflowtype) {
+      alert("Please fill out all fields.");
+      return;
+    }
+    const newId = workflows.length > 0 ? Math.max(...workflows.map((w) => w.id)) + 1 : 1;
+    const addedItem = {
+      id: newId,
+      name: newWorkflow.name,
+      workflowcode: newWorkflow.workflowcode,
+      workflowtype: newWorkflow.workflowtype,
+      version: newWorkflow.version || "1",
+      published: newWorkflow.published,
+      status: true
+    };
+    setWorkflows([addedItem, ...workflows]);
+    setNewWorkflow({ name: "", workflowcode: "", workflowtype: "", version: "1", published: "No", description: "" });
+    setIsModalOpen(false);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "min-h-screen bg-[#f3f4f6] p-6 font-sans relative", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "max-w-full mx-auto space-y-5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "bg-white rounded-2xl border border-gray-100 shadow-sm p-6 flex justify-between items-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h1", { className: "text-2xl font-bold text-slate-800", children: "Workflow Master" }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("nav", { className: "text-xs text-slate-400 mt-1", children: [
+            "Dashboard > Types > ",
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-blue-600 font-semibold", children: "Workflow" })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+          "button",
+          {
+            onClick: () => setIsModalOpen(true),
+            className: "bg-[#1e60ff] hover:bg-blue-700 text-white font-semibold text-sm px-5 py-2.5 rounded-xl transition duration-200 flex items-center gap-1.5 shadow-sm cursor-pointer",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-base font-bold", children: "+" }),
+              " Add New Workflow"
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "bg-white rounded-2xl border border-gray-100 shadow-sm p-6 space-y-5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "relative w-80", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "absolute inset-y-0 left-0 flex items-center pl-3.5 pointer-events-none text-slate-400", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime6.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_runtime6.jsx)(
+              "input",
+              {
+                type: "text",
+                placeholder: "Search workflow name or code...",
+                value: search,
+                onChange: (e) => setSearch(e.target.value),
+                className: "w-full pl-10 pr-4 py-2 text-sm bg-[#fcfdfe] border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 text-slate-700 transition"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+            "select",
             {
-              className: "\r\n    flex h-[84px] items-center justify-between\r\n    border-b border-[#EDF0F5]\r\n    px-[14px]\r\n  ",
+              value: entriesPerPage,
+              onChange: (e) => setEntriesPerPage(Number(e.target.value)),
+              className: "px-4 py-2 text-sm bg-white border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 text-slate-700 cursor-pointer font-medium shadow-sm min-w-[110px]",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-center gap-2", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
-                    "svg",
-                    {
-                      width: "36",
-                      height: "42",
-                      viewBox: "0 0 48 56",
-                      fill: "none",
-                      children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-                          "path",
-                          {
-                            d: "M24 2L45 12.5L24 23L3 12.5L24 2Z",
-                            fill: "#356AF3"
-                          }
-                        ),
-                        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-                          "path",
-                          {
-                            d: "M24 8L34 13L24 18L14 13L24 8Z",
-                            fill: "white"
-                          }
-                        ),
-                        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-                          "path",
-                          {
-                            d: "M3 20L24 30.5L45 20V27L24 37.5L3 27V20Z",
-                            fill: "#356AF3"
-                          }
-                        ),
-                        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-                          "path",
-                          {
-                            d: "M3 33L24 43.5L45 33V40L24 50.5L3 40V33Z",
-                            fill: "#356AF3"
-                          }
-                        )
-                      ]
-                    }
-                  ),
-                  /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("h1", { className: "text-[18px] font-extrabold text-[#101318]", children: "FLOWCORE" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-[12px] text-[#344261]", children: "Workflow Engine" })
-                  ] })
-                ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: onToggle,
-                    className: "\r\n      flex h-8 w-8\r\n      items-center justify-center\r\n      rounded-lg\r\n      hover:bg-gray-100\r\n    ",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react5.RiMenuLine, { size: 18 })
-                  }
-                )
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: 5, children: "5 Rows" }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: 10, children: "10 Rows" }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: 20, children: "20 Rows" }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: 50, children: "50 Rows" })
               ]
             }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
-            "div",
+          ) })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          WorkflowTable,
+          {
+            search,
+            workflows,
+            workflowtoggle: handleToggle,
+            entriesPerPage,
+            setEntriesPerPage
+          }
+        )
+      ] })
+    ] }),
+    isModalOpen && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "fixed inset-0 bg-slate-900/40 backdrop-blur-sm flex justify-center items-center z-50 p-4", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "bg-white rounded-[24px] w-full max-w-4xl shadow-2xl border border-slate-100 flex flex-col max-h-[90vh] overflow-hidden animate-in fade-in zoom-in-95 duration-150", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "px-8 py-5 border-b border-slate-100 flex justify-between items-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "w-11 h-11 bg-indigo-50 border border-indigo-100 rounded-xl flex items-center justify-center text-indigo-600", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("svg", { className: "w-6 h-6 text-[#5c59eb]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", 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_runtime6.jsxs)("div", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h2", { className: "text-xl font-extrabold text-slate-800", children: "Add Workflow" }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-[11px] text-slate-400 font-medium tracking-wide", children: "Create a new workflow and configure its details" })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          "button",
+          {
+            onClick: () => setIsModalOpen(false),
+            className: "text-slate-300 hover:text-slate-500 transition cursor-pointer",
+            children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("svg", { className: "w-6 h-6", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M6 18L18 6M6 6l12 12" }) })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("form", { onSubmit: handleAddWorkflow, className: "flex-1 overflow-y-auto p-8 space-y-6", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "border border-slate-100 rounded-2xl p-6 bg-white space-y-5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-2 pb-1 border-b border-slate-50", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-sm", children: "\u{1F4CB}" }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h3", { className: "text-xs font-bold text-[#5c59eb] uppercase tracking-wider", children: "Workflow Information" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+                "Workflow Type ",
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-rose-500", children: "*" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+                "select",
+                {
+                  required: true,
+                  value: newWorkflow.workflowtype,
+                  onChange: (e) => setNewWorkflow(__spreadProps(__spreadValues({}, newWorkflow), { workflowtype: e.target.value })),
+                  className: "w-full px-4 py-2.5 border border-slate-200 rounded-xl text-sm bg-white text-slate-600 focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 focus:outline-none transition appearance-none cursor-pointer",
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: "", children: "Select workflow type" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: "Trade License", children: "Trade License" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: "Petition", children: "Petition" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: "Leave", children: "Leave" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: "Grievance", children: "Grievance" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: "Verification", children: "Verification" })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[10px] text-slate-400 mt-1 block", children: "Choose the category this workflow belongs to" })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+                "Workflow Code ",
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-rose-500", children: "*" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "input",
+                {
+                  type: "text",
+                  required: true,
+                  placeholder: "Enter workflow code",
+                  value: newWorkflow.workflowcode,
+                  onChange: (e) => setNewWorkflow(__spreadProps(__spreadValues({}, newWorkflow), { workflowcode: e.target.value })),
+                  className: "w-full px-4 py-2.5 border border-slate-200 rounded-xl text-sm placeholder-slate-300 focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 focus:outline-none transition"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[10px] text-slate-400 mt-1 block", children: "Unique code for this workflow (e.g., PET-001)" })
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+              "Workflow Name ",
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-rose-500", children: "*" })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+              "input",
+              {
+                type: "text",
+                required: true,
+                placeholder: "Enter workflow name",
+                value: newWorkflow.name,
+                onChange: (e) => setNewWorkflow(__spreadProps(__spreadValues({}, newWorkflow), { name: e.target.value })),
+                className: "w-full px-4 py-2.5 border border-slate-200 rounded-xl text-sm placeholder-slate-300 focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 focus:outline-none transition"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[10px] text-slate-400 mt-1 block", children: "Enter a descriptive name for this workflow" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+                "Version ",
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-rose-500", children: "*" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                "input",
+                {
+                  type: "number",
+                  required: true,
+                  placeholder: "1",
+                  value: newWorkflow.version,
+                  onChange: (e) => setNewWorkflow(__spreadProps(__spreadValues({}, newWorkflow), { version: e.target.value })),
+                  className: "w-full px-4 py-2.5 border border-slate-200 rounded-xl text-sm placeholder-slate-300 focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 focus:outline-none transition"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[10px] text-slate-400 mt-1 block", children: "Workflow version number" })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: [
+                "Published ",
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-rose-500", children: "*" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+                "select",
+                {
+                  required: true,
+                  value: newWorkflow.published,
+                  onChange: (e) => setNewWorkflow(__spreadProps(__spreadValues({}, newWorkflow), { published: e.target.value })),
+                  className: "w-full px-4 py-2.5 border border-slate-200 rounded-xl text-sm bg-white text-slate-600 focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 focus:outline-none transition appearance-none cursor-pointer",
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: "No", children: "No" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("option", { value: "Yes", children: "Yes" })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[10px] text-slate-400 mt-1 block", children: "Make workflow active for use" })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "border border-slate-100 rounded-2xl p-6 bg-white space-y-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex justify-between items-center", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h3", { className: "text-xs font-bold text-slate-700", children: "Description" }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "text-[10px] text-slate-400", children: [
+              newWorkflow.description.length,
+              " / 500"
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            "textarea",
             {
-              className: "\r\n    min-h-0 flex-1\r\n    overflow-y-auto overflow-x-hidden\r\n    px-[27px] pb-[30px] pt-[31px]\r\n  ",
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-                  "p",
+              rows: "3",
+              maxLength: "500",
+              placeholder: "Enter description here...",
+              value: newWorkflow.description,
+              onChange: (e) => setNewWorkflow(__spreadProps(__spreadValues({}, newWorkflow), { description: e.target.value })),
+              className: "w-full px-4 py-2.5 border border-slate-200 rounded-xl text-sm placeholder-slate-300 focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 focus:outline-none transition resize-none"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex gap-3 justify-end pt-4 border-t border-slate-50", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+            "button",
+            {
+              type: "button",
+              onClick: () => setIsModalOpen(false),
+              className: "px-6 py-2.5 text-xs font-bold text-slate-500 hover:bg-slate-50 border border-slate-200 rounded-xl transition flex items-center gap-1.5 cursor-pointer",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { children: "\u2715" }),
+                " Cancel"
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+            "button",
+            {
+              type: "submit",
+              className: "px-6 py-2.5 text-xs font-bold text-white bg-[#5c59eb] hover:bg-indigo-700 rounded-xl transition flex items-center gap-1.5 shadow-sm cursor-pointer",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { children: "\u{1F4BE}" }),
+                " Save Workflow"
+              ]
+            }
+          )
+        ] })
+      ] })
+    ] }) })
+  ] });
+}
+
+// src/components/WorkFlowTransition/Transitiontable.js
+var import_react8 = __toESM(require("react"));
+var import_link3 = __toESM(require("next/link"));
+
+// src/components/WorkFlowTransition/AddWorkFlowTransitionModal.js
+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: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.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_runtime7.jsx)(
+          "button",
+          {
+            onClick: onClose,
+            className: "text-slate-400 hover:text-slate-600 hover:bg-slate-100 p-2 rounded-full transition-all text-sm font-semibold",
+            children: "\u2715"
+          }
+        )
+      ] }),
+      /* @__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_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_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_runtime7.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: [
+                "Workflow Code ",
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-red-500", children: "*" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                "input",
+                {
+                  type: "text",
+                  placeholder: "Enter workflow code",
+                  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_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 Name ",
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-red-500", children: "*" })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+              "input",
+              {
+                type: "text",
+                placeholder: "Enter workflow name",
+                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_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: [
+                "Version ",
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-red-500", children: "*" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                "input",
+                {
+                  type: "text",
+                  defaultValue: "1",
+                  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_runtime7.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime7.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_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_runtime7.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_runtime7.jsx)(
+            "textarea",
+            {
+              rows: 3,
+              placeholder: "Enter workflow description (optional)",
+              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_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_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: [
+                "Status ",
+                /* @__PURE__ */ (0, import_jsx_runtime7.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_runtime7.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_runtime7.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_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_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_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_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_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_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_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)(
+          "button",
+          {
+            onClick: onClose,
+            className: "px-6 py-2.5 border border-slate-200 text-slate-600 text-xs font-bold rounded-xl hover:bg-slate-50 transition-all flex items-center gap-1.5",
+            children: "\u2715 Cancel"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          "button",
+          {
+            type: "button",
+            className: "px-6 py-2.5 bg-indigo-600 hover:bg-indigo-700 text-white text-xs font-bold rounded-xl shadow-md shadow-indigo-500/10 transition-all flex items-center gap-1.5",
+            children: "\u{1F4BE} Save Workflow"
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+
+// 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/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"));
+
+// 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
+var import_react11 = __toESM(require("react"));
+var import_jsx_runtime12 = require("react/jsx-runtime");
+function AddWorkflowTypeModal({ isOpen, onClose }) {
+  if (!isOpen) return null;
+  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",
+      {
+        className: "fixed inset-0 bg-slate-900/50 backdrop-blur-sm transition-opacity duration-200",
+        onClick: onClose
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsxs)("div", { className: "flex justify-between items-center px-8 py-6 border-b border-slate-100", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex items-center gap-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsx)("svg", { className: "w-6 h-6", fill: "none", stroke: "currentColor", strokeWidth: "2", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsxs)("div", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("h2", { className: "text-xl font-extrabold text-slate-800", children: "Add Workflow" }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-xs text-slate-400 mt-0.5", children: "Create a new workflow and configure its details" })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          "button",
+          {
+            onClick: onClose,
+            className: "text-slate-400 hover:text-slate-600 hover:bg-slate-100 p-2 rounded-full transition-all text-sm font-semibold",
+            children: "\u2715"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsx)("span", { children: "\u{1F4CB}" }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { children: "Workflow Information" })
+          ] }),
+          /* @__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 ",
+                /* @__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: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "", children: "Select workflow type" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "petition", children: "Petition" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "building", children: "Building Permission" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "leave", children: "Leave" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Choose the category this workflow belongs to" })
+            ] }),
+            /* @__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 Code ",
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-red-500", children: "*" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                "input",
+                {
+                  type: "text",
+                  placeholder: "Enter workflow code",
+                  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_runtime12.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Unique code for this workflow (e.g., PET-001)" })
+            ] })
+          ] }),
+          /* @__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 Name ",
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-red-500", children: "*" })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+              "input",
+              {
+                type: "text",
+                placeholder: "Enter workflow name",
+                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_runtime12.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Enter a descriptive name for this workflow" })
+          ] }),
+          /* @__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: [
+                "Version ",
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-red-500", children: "*" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                "input",
+                {
+                  type: "text",
+                  defaultValue: "1",
+                  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_runtime12.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Workflow version number" })
+            ] }),
+            /* @__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: [
+                "Published ",
+                /* @__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: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "false", children: "No" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "true", children: "Yes" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Make workflow active for use" })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex justify-between items-center", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("label", { className: "block text-xs font-bold text-slate-700", children: "Description" }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-[10px] text-slate-400", children: "0 / 500" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+            "textarea",
+            {
+              rows: 3,
+              placeholder: "Enter workflow description (optional)",
+              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_runtime12.jsx)("p", { className: "text-[10px] text-slate-400", children: "Provide additional information about this workflow" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsx)("span", { children: "\u2699\uFE0F" }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { children: "Status & Settings" })
+          ] }),
+          /* @__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: [
+                "Status ",
+                /* @__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: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "active", children: "Active" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "inactive", children: "Inactive" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Set the initial status of this workflow" })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("label", { className: "block text-xs font-bold text-slate-700 mb-1.5", children: "Default Priority" }),
+              /* @__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: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "medium", children: "Medium" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "high", children: "High" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "low", children: "Low" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-[10px] text-slate-400 mt-1", children: "Default priority for tasks in this workflow" })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "bg-white p-6 rounded-2xl border border-slate-100/80 shadow-sm space-y-5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsx)("span", { children: "\u{1F6E0}\uFE0F" }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { children: "Additional Settings" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsxs)("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-xs font-bold text-slate-700", children: "Enable SLA" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-[9px] text-slate-400", children: "Enable SLA for workflow" })
+                ] })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("label", { className: "relative inline-flex items-center cursor-pointer", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("input", { type: "checkbox", defaultChecked: true, className: "sr-only peer" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.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_runtime12.jsxs)("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-xs font-bold text-slate-700", children: "Allow Rework" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-[9px] text-slate-400", children: "Allow files to be sent back" })
+                ] })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("label", { className: "relative inline-flex items-center cursor-pointer", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("input", { type: "checkbox", defaultChecked: true, className: "sr-only peer" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.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_runtime12.jsxs)("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsxs)("div", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-xs font-bold text-slate-700", children: "Allow File Delegation" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-[9px] text-slate-400", children: "Allow users to delegate tasks" })
+                ] })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("label", { className: "relative inline-flex items-center cursor-pointer", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("input", { type: "checkbox", className: "sr-only peer" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.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_runtime12.jsx)(
+          "button",
+          {
+            onClick: onClose,
+            className: "px-6 py-2.5 border border-slate-200 text-slate-600 text-xs font-bold rounded-xl hover:bg-slate-50 transition-all flex items-center gap-1.5",
+            children: "\u2715 Cancel"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          "button",
+          {
+            type: "button",
+            className: "px-6 py-2.5 bg-indigo-600 hover:bg-indigo-700 text-white text-xs font-bold rounded-xl shadow-md shadow-indigo-500/10 transition-all flex items-center gap-1.5",
+            children: "\u{1F4BE} Save Workflow"
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+
+// src/components/WorkflowType/AddButton.jsx
+var import_react12 = __toESM(require("react"));
+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"
+      ]
+    }
+  );
+}
+
+// src/components/WorkflowType/WorkFlowTypeMain.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) })
+      ] }),
+      /* @__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)
+      }
+    )
+  ] });
+}
+
+// src/components/Sidebar.jsx
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var workflowItems = [
+  { name: "Workflow Type", component: "workflowType", icon: import_react15.RiGitMergeLine },
+  { name: "Workflow", component: "workflow", icon: import_react15.RiNodeTree },
+  { name: "Workflow Step", component: "workflowStep", icon: import_react15.RiGitBranchLine },
+  { name: "Workflow Transition", component: "workflowTransition", icon: import_react15.RiCornerDownRightLine }
+];
+var permissionItems = [
+  { name: "Task Permission", path: "/TaskPermissionPage", icon: import_react15.RiUserSettingsLine },
+  { name: "Assignment Rule", path: "/AssignmentRulePage", icon: import_react15.RiFileShieldLine }
+];
+var hierarchyItems = [
+  { name: "Hierarchy Node", path: "/WorkflowType", icon: import_react15.RiNodeTree },
+  { name: "User Hierarchy Mapping", path: "/WorkflowType", icon: import_react15.RiUserSharedLine },
+  { name: "Workflow Settings", path: "/WorkflowType", icon: import_react15.RiSettings4Line }
+];
+var documentItems = [
+  { name: "Document Configuration", path: "/WorkflowType", icon: import_react15.RiFileSettingsLine }
+];
+var fileItems = [
+  { name: "File Instance", path: "/WorkflowType", icon: import_react15.RiFileList3Line },
+  { name: "File Pool", path: "/WorkflowType", icon: import_react15.RiDatabase2Line },
+  { name: "Uploaded Document", path: "/WorkflowType", icon: import_react15.RiFileUploadLine }
+];
+var communicationItems = [
+  { name: "Notification", path: "/WorkflowType", icon: import_react15.RiNotification4Line },
+  { name: "Comment", path: "/WorkflowType", icon: import_react15.RiChat3Line }
+];
+var taskItems = [
+  { name: "Task Instance", path: "/WorkflowType", icon: import_react15.RiCheckboxMultipleLine }
+];
+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 }) {
+  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 renderMenuItemold = (item) => {
+    const Icon = item.icon;
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+      "button",
+      {
+        type: "button",
+        className: `
+        flex h-[56px] w-full items-center gap-[17px]
+        rounded-[9px] px-[17px]
+        text-left transition-colors duration-150
+        ${router.pathname === item.path ? "bg-blue-50 text-blue-600" : "text-[#344261] hover:bg-[#F6F8FC]"}
+      `,
+        onClick: () => router.push(item.path),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            "span",
+            {
+              className: "\r\n            flex h-[20px] w-[20px] shrink-0\r\n            items-center justify-center\r\n            rounded-[6px] text-[#405170]\r\n          ",
+              children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { size: 17 })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "whitespace-nowrap text-[14px] font-medium leading-[22px]", children: item.name })
+        ]
+      },
+      item.name
+    );
+  };
+  const renderMenuItem = (item) => {
+    const Icon = item.icon;
+    const handleClick = async () => {
+      if (item.component) {
+        await router.push("/", void 0, { shallow: true });
+        setActiveComponent(item.component);
+      } else {
+        setActiveComponent(null);
+        router.push(item.path);
+      }
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+      "button",
+      {
+        onClick: handleClick,
+        className: `
+        flex h-[56px] w-full items-center gap-[17px]
+        rounded-[9px] px-[17px]
+        ${item.component ? activeComponent === item.component ? "bg-blue-50 text-blue-600" : "text-[#344261] hover:bg-[#F6F8FC]" : router.pathname === item.path ? "bg-blue-50 text-blue-600" : "text-[#344261] hover:bg-[#F6F8FC]"}
+      `,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { size: 17 }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { children: item.name })
+        ]
+      },
+      item.name
+    );
+  };
+  const renderDropdown = (title, open, setOpen, items) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "mb-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+        "button",
+        {
+          type: "button",
+          onClick: () => setOpen(!open),
+          className: "\r\n          flex h-[50px] w-full items-center justify-between\r\n          rounded-[9px] px-[17px]\r\n          text-left text-[#344261]\r\n          transition-colors duration-150\r\n          hover:bg-[#F6F8FC]\r\n        ",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "text-[16px] font-semibold", children: title }),
+            open ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react15.RiArrowDownSLine, { size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react15.RiArrowRightSLine, { size: 18 })
+          ]
+        }
+      ),
+      open && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "ml-[8px] border-l border-[#E5E9F1] pl-[4px]", children: items.map(renderMenuItem) })
+    ] });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+      "aside",
+      {
+        className: `
+          flex h-screen flex-col overflow-hidden
+          border-r border-[#E5E9F1] bg-white
+          font-sans text-[#273657]
+          transition-all duration-300 ease-in-out
+          ${isOpen ? "w-[245px] min-w-[245px] translate-x-0 opacity-100" : "w-0 min-w-0 -translate-x-full opacity-0"}
+        `,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+            "header",
+            {
+              className: "\r\n    flex h-[84px] items-center justify-between\r\n    border-b border-[#EDF0F5]\r\n    px-[14px]\r\n  ",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+                    "svg",
+                    {
+                      width: "36",
+                      height: "42",
+                      viewBox: "0 0 48 56",
+                      fill: "none",
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                          "path",
+                          {
+                            d: "M24 2L45 12.5L24 23L3 12.5L24 2Z",
+                            fill: "#356AF3"
+                          }
+                        ),
+                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                          "path",
+                          {
+                            d: "M24 8L34 13L24 18L14 13L24 8Z",
+                            fill: "white"
+                          }
+                        ),
+                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                          "path",
+                          {
+                            d: "M3 20L24 30.5L45 20V27L24 37.5L3 27V20Z",
+                            fill: "#356AF3"
+                          }
+                        ),
+                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                          "path",
+                          {
+                            d: "M3 33L24 43.5L45 33V40L24 50.5L3 40V33Z",
+                            fill: "#356AF3"
+                          }
+                        )
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("h1", { className: "text-[18px] font-extrabold text-[#101318]", children: "FLOWCORE" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "text-[12px] text-[#344261]", children: "Workflow Engine" })
+                  ] })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: onToggle,
+                    className: "\r\n      flex h-8 w-8\r\n      items-center justify-center\r\n      rounded-lg\r\n      hover:bg-gray-100\r\n    ",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react15.RiMenuLine, { size: 18 })
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+            "div",
+            {
+              className: "\r\n    min-h-0 flex-1\r\n    overflow-y-auto overflow-x-hidden\r\n    px-[27px] pb-[30px] pt-[31px]\r\n  ",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                  "p",
                   {
                     className: "\r\n      mb-[19px] ml-[15px]\r\n      text-[14px] font-bold uppercase\r\n      leading-[20px] tracking-[0.2px]\r\n      text-[#3C4D74]\r\n    ",
                     children: "Configuration Masters"
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex flex-col gap-[3px]", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex flex-col gap-[3px]", children: [
                   renderDropdown(
                     "Workflow",
                     workflowOpen,
@@ -645,14 +2156,14 @@ function Sidebar({ isOpen, onToggle }) {
                     hierarchyItems
                   )
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                   "p",
                   {
                     className: "\r\n      mb-[19px] ml-[15px] mt-[39px]\r\n      text-[14px] font-bold uppercase\r\n      leading-[20px] tracking-[0.2px]\r\n      text-[#3C4D74]\r\n    ",
                     children: "Runtime"
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex flex-col gap-[3px]", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex flex-col gap-[3px]", children: [
                   renderDropdown(
                     "Files",
                     filesOpen,
@@ -681,18 +2192,18 @@ function Sidebar({ isOpen, onToggle }) {
               ]
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
             "div",
             {
               className: "\r\n    shrink-0\r\n    bg-white\r\n    px-[27px]\r\n    pb-[34px]\r\n    pt-[18px]\r\n  ",
-              children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
                 "button",
                 {
                   type: "button",
                   className: "\r\n      flex h-[66px] w-full\r\n      items-center gap-[18px]\r\n      rounded-[10px]\r\n      border border-[#E1E5ED]\r\n      bg-white\r\n      px-[23px]\r\n      text-left\r\n      text-[16px]\r\n      font-semibold\r\n      text-[#2D3A58]\r\n      shadow-sm\r\n      hover:bg-[#F7F8FC]\r\n      transition\r\n    ",
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react5.RiSettings4Line, { size: 20 }),
-                    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { children: "Settings" })
+                    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react15.RiSettings4Line, { size: 20 }),
+                    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { children: "Settings" })
                   ]
                 }
               )
@@ -701,60 +2212,37 @@ function Sidebar({ isOpen, onToggle }) {
         ]
       }
     ),
-    !isOpen && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex-1 overflow-auto bg-[#F5F7FB]", children: renderContent() }),
+    !isOpen && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       "button",
       {
         type: "button",
         onClick: onToggle,
         "aria-label": "Open sidebar",
         className: "\r\n            fixed left-[20px] top-[30px] z-[100]\r\n            flex h-[46px] w-[46px]\r\n            items-center justify-center\r\n            rounded-[9px]\r\n            border border-[#E1E5ED]\r\n            bg-white text-[#344261]\r\n            shadow-[0_2px_8px_rgba(0,0,0,0.08)]\r\n            transition-colors\r\n            hover:bg-[#F3F5F9]\r\n          ",
-        children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react5.RiMenuLine, { size: 18 })
+        children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react15.RiMenuLine, { size: 18 })
       }
     )
   ] });
 }
 
-// src/pages/Sidebar.js
-var import_jsx_runtime6 = require("react/jsx-runtime");
-function Home() {
-  const [isOpen, setIsOpen] = (0, import_react6.useState)(true);
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex h-screen", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+// src/components/Layout.jsx
+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)(
     Sidebar,
     {
       isOpen,
-      onToggle: () => setIsOpen(!isOpen)
+      onToggle: () => setIsOpen(!isOpen),
+      children
     }
   ) });
-}
-
-// src/components/Layout.jsx
-var import_react7 = require("react");
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var Layout = ({ children }) => {
-  const [isOpen, setIsOpen] = (0, import_react7.useState)(true);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex min-h-screen", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-      Sidebar,
-      {
-        isOpen,
-        onToggle: () => setIsOpen(!isOpen)
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("main", { className: "flex-1 p-6 bg-gray-100", children })
-  ] });
 };
 var Layout_default = Layout;
-
-// src/pages/AdminPanel.js
-var import_react8 = __toESM(require("react"));
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var AdminPanel = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_jsx_runtime8.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Layout_default, {}) });
-};
-var AdminPanel_default = AdminPanel;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  AdminPanel,
+  Layout,
   Sidebar,
   WorkflowPage
 });