@digi-frontend/dgate-api-documentation 4.0.0-beta.0 → 4.0.0-beta.3

package/dist/index.cjs

@@ -1,4 +1,5 @@
-//#region rolldown:runtime
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+//#region \0rolldown/runtime.js
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -6,16 +7,12 @@ var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __copyProps = (to, from, except, desc) => {
-	if (from && typeof from === "object" || typeof from === "function") {
-		for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
-			key = keys[i];
-			if (!__hasOwnProp.call(to, key) && key !== except) {
-				__defProp(to, key, {
-					get: ((k) => from[k]).bind(null, key),
-					enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-				});
-			}
-		}
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
 	}
 	return to;
 };
@@ -23,29 +20,28 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 	value: mod,
 	enumerable: true
 }) : target, mod));
-
 //#endregion
 let zustand = require("zustand");
 let zustand_middleware = require("zustand/middleware");
 let zustand_middleware_immer = require("zustand/middleware/immer");
 let react = require("react");
+let react$1 = __toESM(react, 1);
 react = __toESM(react);
 let antd = require("antd");
-let __ant_design_icons = require("@ant-design/icons");
+let _ant_design_icons = require("@ant-design/icons");
 let react_jsx_runtime = require("react/jsx-runtime");
-let __ant_design_cssinjs = require("@ant-design/cssinjs");
+let _ant_design_cssinjs = require("@ant-design/cssinjs");
 let antd_es_typography_Text = require("antd/es/typography/Text");
-antd_es_typography_Text = __toESM(antd_es_typography_Text);
+antd_es_typography_Text = __toESM(antd_es_typography_Text, 1);
 let re_resizable = require("re-resizable");
 let antd_es_typography_Title = require("antd/es/typography/Title");
-antd_es_typography_Title = __toESM(antd_es_typography_Title);
+antd_es_typography_Title = __toESM(antd_es_typography_Title, 1);
 let nanoid = require("nanoid");
 let react_syntax_highlighter = require("react-syntax-highlighter");
-let react_syntax_highlighter_dist_esm_languages_hljs_json = require("react-syntax-highlighter/dist/esm/languages/hljs/json");
-react_syntax_highlighter_dist_esm_languages_hljs_json = __toESM(react_syntax_highlighter_dist_esm_languages_hljs_json);
-let react_syntax_highlighter_dist_esm_styles_hljs = require("react-syntax-highlighter/dist/esm/styles/hljs");
-react_syntax_highlighter_dist_esm_styles_hljs = __toESM(react_syntax_highlighter_dist_esm_styles_hljs);
-
+let react_syntax_highlighter_dist_esm_languages_hljs_json_js = require("react-syntax-highlighter/dist/esm/languages/hljs/json.js");
+react_syntax_highlighter_dist_esm_languages_hljs_json_js = __toESM(react_syntax_highlighter_dist_esm_languages_hljs_json_js, 1);
+let react_syntax_highlighter_dist_esm_styles_hljs_index_js = require("react-syntax-highlighter/dist/esm/styles/hljs/index.js");
+react_syntax_highlighter_dist_esm_styles_hljs_index_js = __toESM(react_syntax_highlighter_dist_esm_styles_hljs_index_js, 1);
 //#region src/store/slices/view.ts
 const createViewSlice = (set) => ({ view: {
 	selectedNodeKey: null,
@@ -101,32 +97,28 @@ const createViewSlice = (set) => ({ view: {
 		state.view.selectedStatusCode = code;
 	})
 } });
-
 //#endregion
 //#region src/store/index.ts
 const createStore = (set) => ({ ...createViewSlice(set) });
 const useStore = (0, zustand.create)()((0, zustand_middleware.devtools)((0, zustand_middleware_immer.immer)(createStore), { name: "dgate-docs-store" }));
-var store_default = useStore;
-
 //#endregion
 //#region src/hooks/useStyle.ts
 function useStyle(componentName, stylesFn) {
-	const { token: token$1, theme: theme$2, hashId } = antd.theme.useToken();
+	const { token, theme, hashId } = antd.theme.useToken();
 	const scope = (className) => `.${hashId}.${componentName}-${className}`;
 	const cx = (...classes) => classes.map((cls) => `${componentName}-${cls} ${hashId}`).join(" ");
 	return {
-		wrapSSR: (0, __ant_design_cssinjs.useStyleRegister)({
-			theme: theme$2,
-			token: token$1,
+		wrapSSR: (0, _ant_design_cssinjs.useStyleRegister)({
+			theme,
+			token,
 			path: [componentName]
-		}, () => stylesFn(token$1, scope)),
+		}, () => stylesFn(token, scope)),
 		cx,
 		scope,
-		token: token$1,
+		token,
 		hashId
 	};
 }
-
 //#endregion
 //#region src/theme/light.json
 var token = {
@@ -457,41 +449,40 @@ var token = {
 	"marginXXXL": 60,
 	"marginXXXXL": 72
 };
-
 //#endregion
 //#region src/view/helper/sidebar.utils.ts
 const methodColors = {
 	GET: {
-		bg: token.colorPrimaryBgHover,
+		bg: "transparent",
 		color: token.colorPrimary
 	},
 	POST: {
-		bg: token.colorSuccess,
-		color: "#FFFFFF"
+		bg: "transparent",
+		color: token.colorSuccess
 	},
 	DELETE: {
-		bg: token.colorErrorBg,
+		bg: "transparent",
 		color: token.colorError
 	},
 	PUT: {
-		bg: token.colorWarningBg,
+		bg: "transparent",
 		color: token.colorWarning
 	},
 	PATCH: {
-		bg: token["volcano.1"],
+		bg: "transparent",
 		color: token["volcano.5"]
 	},
 	OPTIONS: {
-		bg: token["geekblue.2"],
+		bg: "transparent",
 		color: token["geekblue.6"]
 	},
 	HEAD: {
-		bg: token["purple.1"],
+		bg: "transparent",
 		color: token["purple.5"]
 	},
 	TRACE: {
-		bg: token["cyan.1"],
-		color: token["cyan.5"]
+		bg: "transparent",
+		color: token["volcano.4"]
 	}
 };
 const darkerMethodColors = {
@@ -528,43 +519,91 @@ const darkerMethodColors = {
 		color: "#FFFFFF"
 	}
 };
+const sidebarMethodColors = {
+	GET: {
+		bg: token.colorPrimaryBgHover,
+		color: token.colorPrimary
+	},
+	POST: {
+		bg: token.colorSuccessBg,
+		color: token.colorSuccess
+	},
+	DELETE: {
+		bg: token.colorErrorBg,
+		color: token.colorError
+	},
+	PUT: {
+		bg: token.colorWarningBg,
+		color: token.colorWarning
+	},
+	PATCH: {
+		bg: token["volcano.1"],
+		color: token["volcano.5"]
+	},
+	OPTIONS: {
+		bg: token["geekblue.2"],
+		color: token["geekblue.6"]
+	},
+	HEAD: {
+		bg: token["purple.1"],
+		color: token["purple.5"]
+	},
+	TRACE: {
+		bg: token["volcano.1"],
+		color: token["volcano.4"]
+	}
+};
 const buildTreeDataStructure = (data) => {
 	if (!data) return [];
 	return data.map((api) => {
 		const tagEntries = Object.entries(api.tags);
+		const defaultTag = tagEntries.find(([tag]) => tag.toLowerCase() === "default");
+		const nonDefaultTags = tagEntries.filter(([tag]) => tag.toLowerCase() !== "default");
+		const defaultEndpoints = defaultTag ? defaultTag[1].map((endpoint) => ({
+			title: endpoint.summary,
+			key: endpoint.id,
+			isLeaf: true,
+			selectable: true,
+			method: endpoint.method,
+			data: {
+				endpoint,
+				api,
+				tagName: "default",
+				parentApiId: api.id
+			}
+		})) : [];
+		const tagNodes = nonDefaultTags.map(([tag, endpoints]) => {
+			const tagId = `tag-${api.id}-${tag.replace(/\s+/g, "-").toLowerCase()}`;
+			return {
+				title: tag,
+				key: tagId,
+				selectable: true,
+				data: {
+					tagName: tag,
+					apiData: api
+				},
+				children: endpoints.map((endpoint) => ({
+					title: endpoint.summary,
+					key: endpoint.id,
+					isLeaf: true,
+					selectable: true,
+					method: endpoint.method,
+					data: {
+						endpoint,
+						api,
+						tagName: tag,
+						parentApiId: api.id,
+						tagId
+					}
+				}))
+			};
+		});
 		return {
 			title: api.title,
 			key: api.id,
 			selectable: true,
 			data: api,
-			children: tagEntries.map(([tag, endpoints]) => {
-				const tagId = `tag-${api.id}-${tag.replace(/\s+/g, "-").toLowerCase()}`;
-				return {
-					title: tag,
-					key: tagId,
-					selectable: true,
-					data: {
-						tagName: tag,
-						apiData: api
-					},
-					children: endpoints.map((endpoint) => {
-						return {
-							title: endpoint.summary,
-							key: endpoint.id,
-							isLeaf: true,
-							selectable: true,
-							method: endpoint.method,
-							data: {
-								endpoint,
-								api,
-								tagName: tag,
-								parentApiId: api.id,
-								tagId
-							}
-						};
-					})
-				};
-			})
+			children: [...tagNodes, ...defaultEndpoints]
 		};
 	});
 };
@@ -622,18 +661,18 @@ const filterTreeData = (data, searchText) => {
 	};
 	return data.map((node) => filterNode(node)).filter((node) => node !== null);
 };
-const getSidebarStyles = (token$1, scope) => ({
+const getSidebarStyles = (token, scope) => ({
 	[scope("sider")]: {
-		backgroundColor: token$1.colorBgElevated,
+		backgroundColor: token.colorBgElevated,
 		overflowX: "clip",
-		borderRadius: token$1.borderRadius,
+		borderRadius: token.borderRadius,
 		height: "auto"
 	},
-	[scope("content")]: { padding: token$1.padding },
+	[scope("content")]: { padding: token.padding },
 	[scope("controls")]: {
 		display: "flex",
-		gap: token$1.marginXS,
-		marginBottom: token$1.marginSM
+		gap: token.marginXS,
+		marginBottom: token.marginSM
 	},
 	[scope("search-input")]: { flex: 1 },
 	[scope("tree")]: {
@@ -659,15 +698,17 @@ const getSidebarStyles = (token$1, scope) => ({
 			width: "100%",
 			padding: 0
 		},
-		"& .ant-tree-switcher": { backgroundColor: token$1.colorBgElevated }
+		"& .ant-tree-switcher": { backgroundColor: token.colorBgElevated }
 	},
 	[scope("endpoint-item")]: {
 		display: "flex",
 		alignItems: "center",
-		gap: token$1.marginXS,
+		gap: token.marginXS,
 		width: "100%",
 		maxWidth: "100%",
-		minWidth: "100%"
+		minWidth: "100%",
+		paddingLeft: token.marginXS,
+		paddingRight: token.marginXS
 	},
 	[scope("method-tag")]: {
 		width: 51,
@@ -690,26 +731,26 @@ const getSidebarStyles = (token$1, scope) => ({
 		display: "block"
 	},
 	[scope("tag-title")]: {
-		color: token$1.colorText,
+		color: token.colorText,
 		maxWidth: "100%",
 		display: "block",
 		flex: 1
 	},
 	[scope("api-title")]: {
 		flex: 1,
-		color: token$1.colorText,
+		color: token.colorText,
 		maxWidth: "100%",
 		display: "block",
-		padding: 0,
+		paddingLeft: "4px",
+		paddingRight: "4px",
 		margin: 0
 	}
 });
-
 //#endregion
 //#region src/view/helper/sidebar.components.tsx
 const { Text: Text$3 } = antd.Typography;
 const EndpointItem = ({ method, title, cx, isSelected = false }) => {
-	const methodStyle = (isSelected ? darkerMethodColors : methodColors)[method];
+	const methodStyle = (isSelected ? darkerMethodColors : sidebarMethodColors)[method];
 	const isPost = method?.toUpperCase() === "POST";
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: `${cx("endpoint-item")}${isSelected ? ` ${cx("endpoint-item-selected")}` : ""}`,
@@ -759,7 +800,6 @@ const convertToRenderableTreeData = (treeDataStructure, selectedEndpoint, cx) =>
 	};
 	return treeDataStructure.map(renderNode);
 };
-
 //#endregion
 //#region src/hooks/useNodeSelection.ts
 const useNodeSelection = () => {
@@ -865,32 +905,23 @@ const useNodeSelection = () => {
 		selectPreSelectedApi
 	};
 };
-
 //#endregion
-//#region src/assets/Minify.svg
-var _path$5;
-function _extends$5() {
-	return _extends$5 = Object.assign ? Object.assign.bind() : function(n) {
-		for (var e = 1; e < arguments.length; e++) {
-			var t = arguments[e];
-			for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
-		}
-		return n;
-	}, _extends$5.apply(null, arguments);
-}
-var SvgMinify = function SvgMinify$1(props) {
-	return /* @__PURE__ */ react.createElement("svg", _extends$5({
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 16,
-		height: 16,
-		fill: "none"
-	}, props), _path$5 || (_path$5 = /* @__PURE__ */ react.createElement("path", {
-		stroke: "currentcolor",
-		d: "m6 11.334 2-2 2 2M6 4.666l2 2 2-2"
-	})));
-};
-var Minify_default = SvgMinify;
-
+//#region src/assets/Minify.tsx
+const Minify = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+	width: "16",
+	height: "16",
+	viewBox: "0 0 16 16",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M6 11.334L8 9.33398L10 11.334",
+		stroke: "currentcolor"
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M6 4.66602L8 6.66602L10 4.66602",
+		stroke: "currentcolor"
+	})]
+});
 //#endregion
 //#region src/view/components/NoDataIcon.tsx
 const NoDataIcon = ({ width = 298, height = 237, fill = "#F1F5FD", stroke = "#E0E9F9", ...props }) => {
@@ -1058,8 +1089,6 @@ const NoDataIcon = ({ width = 298, height = 237, fill = "#F1F5FD", stroke = "#E0
 		]
 	});
 };
-var NoDataIcon_default = NoDataIcon;
-
 //#endregion
 //#region src/view/components/Sidebar.tsx
 const { useBreakpoint: useBreakpoint$4 } = antd.Grid;
@@ -1067,9 +1096,9 @@ const Sidebar = ({ searchValue, setSearchValue, onNodeSelect }) => {
 	const expandedKeys = useStore((state) => state.view.expandedKeys);
 	const { selectedNodeKey, selectedEndpoint, builtTreeData, setExpandedKeys, setSelectedNodeKey } = useStore(({ view }) => view);
 	const { selectNodeByKey, clearSelection } = useNodeSelection();
-	const [autoExpandParent, setAutoExpandParent] = (0, react.useState)(true);
+	const [autoExpandParent, setAutoExpandParent] = (0, react$1.useState)(true);
 	const isMobile = !useBreakpoint$4().md;
-	const { wrapSSR, cx, token: token$1 } = useStyle("Sidebar", getSidebarStyles);
+	const { wrapSSR, cx, token } = useStyle("Sidebar", getSidebarStyles);
 	const handleSearch = (value) => {
 		if (value && builtTreeData) {
 			setExpandedKeys(getAllTreeKeys(builtTreeData));
@@ -1081,7 +1110,7 @@ const Sidebar = ({ searchValue, setSearchValue, onNodeSelect }) => {
 			setAutoExpandParent(false);
 		}
 	};
-	const renderTreeData = (0, react.useMemo)(() => {
+	const renderTreeData = (0, react$1.useMemo)(() => {
 		if (!builtTreeData) return [];
 		return convertToRenderableTreeData(builtTreeData, selectedEndpoint, cx);
 	}, [
@@ -1089,7 +1118,7 @@ const Sidebar = ({ searchValue, setSearchValue, onNodeSelect }) => {
 		selectedEndpoint,
 		cx
 	]);
-	const filteredTreeData = (0, react.useMemo)(() => {
+	const filteredTreeData = (0, react$1.useMemo)(() => {
 		if (!searchValue) return renderTreeData;
 		if (!builtTreeData) return [];
 		return convertToRenderableTreeData(filterTreeData(builtTreeData, searchValue), selectedEndpoint, cx);
@@ -1126,7 +1155,7 @@ const Sidebar = ({ searchValue, setSearchValue, onNodeSelect }) => {
 					onChange: (e) => handleSearch(e.target.value),
 					allowClear: true,
 					className: cx("search-input"),
-					addonAfter: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.SearchOutlined, {})
+					addonAfter: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.SearchOutlined, {})
 				})
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Tooltip, {
 				title: "Collapse All",
@@ -1134,13 +1163,13 @@ const Sidebar = ({ searchValue, setSearchValue, onNodeSelect }) => {
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 					onClick: collapseAll,
 					title: "Collapse All",
-					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Minify_default, {})
+					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Minify, {})
 				})
 			})]
 		}), filteredTreeData?.length ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Tree, {
 			showLine: { showLeafIcon: false },
 			showIcon: false,
-			switcherIcon: (nodeProps) => nodeProps.isLeaf ? null : nodeProps.expanded ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.MinusSquareOutlined, { style: { fontSize: 12 } }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.PlusSquareOutlined, { style: { fontSize: 12 } }),
+			switcherIcon: (nodeProps) => nodeProps.isLeaf ? null : nodeProps.expanded ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.MinusSquareOutlined, { style: { fontSize: 12 } }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.PlusSquareOutlined, { style: { fontSize: 12 } }),
 			expandedKeys,
 			autoExpandParent,
 			selectedKeys: [selectedNodeKey || ""],
@@ -1159,30 +1188,30 @@ const Sidebar = ({ searchValue, setSearchValue, onNodeSelect }) => {
 		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(antd.Flex, {
 			justify: "center",
 			align: "center",
-			gap: token$1.marginSM,
+			gap: token.marginSM,
 			vertical: true,
-			style: { marginTop: token$1.paddingXL },
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(NoDataIcon_default, {
-				stroke: token$1.colorPrimaryHover,
-				fill: token$1.colorPrimaryBg,
+			style: { marginTop: token.paddingXL },
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(NoDataIcon, {
+				stroke: token.colorPrimaryHover,
+				fill: token.colorPrimaryBg,
 				width: "10.375rem",
 				height: "8.1875rem"
 			}), searchValue.length ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd_es_typography_Text.default, {
 				style: {
 					textAlign: "center",
-					fontFamily: token$1.fontFamily,
+					fontFamily: token.fontFamily,
 					fontWeight: 400,
-					fontSize: token$1.fontSizeLG,
-					color: token$1.colorTextTertiary
+					fontSize: token.fontSizeLG,
+					color: token.colorTextTertiary
 				},
 				children: "No results found"
 			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(antd_es_typography_Text.default, {
 				style: {
 					textAlign: "center",
-					fontFamily: token$1.fontFamily,
+					fontFamily: token.fontFamily,
 					fontWeight: 400,
-					fontSize: token$1.fontSizeLG,
-					color: token$1.colorTextTertiary
+					fontSize: token.fontSizeLG,
+					color: token.colorTextTertiary
 				},
 				children: [
 					"No API",
@@ -1222,52 +1251,40 @@ const Sidebar = ({ searchValue, setSearchValue, onNodeSelect }) => {
 		children: inner
 	}));
 };
-
 //#endregion
-//#region src/assets/link.svg
-var _path$4, _path2$3;
-function _extends$4() {
-	return _extends$4 = Object.assign ? Object.assign.bind() : function(n) {
-		for (var e = 1; e < arguments.length; e++) {
-			var t = arguments[e];
-			for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
-		}
-		return n;
-	}, _extends$4.apply(null, arguments);
-}
-var SvgLink = function SvgLink$1(props) {
-	return /* @__PURE__ */ react.createElement("svg", _extends$4({
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 12,
-		height: 12,
-		fill: "none"
-	}, props), _path$4 || (_path$4 = /* @__PURE__ */ react.createElement("path", {
-		fill: "#4D75D9",
-		d: "M3.875 9.25C2.085 9.25.625 7.79.625 6s1.46-3.25 3.25-3.25c.205 0 .375.17.375.375s-.17.375-.375.375a2.5 2.5 0 0 0 0 5 2.5 2.5 0 0 0 2.5-2.5c0-.205.17-.375.375-.375s.375.17.375.375c0 1.79-1.46 3.25-3.25 3.25"
-	})), _path2$3 || (_path2$3 = /* @__PURE__ */ react.createElement("path", {
-		fill: "#4D75D9",
-		d: "M8 9.375A.38.38 0 0 1 7.625 9c0-.205.17-.375.375-.375A2.63 2.63 0 0 0 10.625 6 2.63 2.63 0 0 0 8 3.375 2.63 2.63 0 0 0 5.375 6c0 .205-.17.375-.375.375A.38.38 0 0 1 4.625 6 3.38 3.38 0 0 1 8 2.625 3.38 3.38 0 0 1 11.375 6 3.38 3.38 0 0 1 8 9.375"
-	})));
-};
-var link_default = SvgLink;
-
+//#region src/assets/link.tsx
+const Link = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+	width: "12",
+	height: "12",
+	viewBox: "0 0 12 12",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M3.875 9.25C2.085 9.25 0.625 7.79 0.625 6C0.625 4.21 2.085 2.75 3.875 2.75C4.08 2.75 4.25 2.92 4.25 3.125C4.25 3.33 4.08 3.5 3.875 3.5C2.495 3.5 1.375 4.62 1.375 6C1.375 7.38 2.495 8.5 3.875 8.5C5.255 8.5 6.375 7.38 6.375 6C6.375 5.795 6.545 5.625 6.75 5.625C6.955 5.625 7.125 5.795 7.125 6C7.125 7.79 5.665 9.25 3.875 9.25Z",
+		fill: "#4D75D9"
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M8 9.375C7.795 9.375 7.625 9.205 7.625 9C7.625 8.795 7.795 8.625 8 8.625C9.445 8.625 10.625 7.445 10.625 6C10.625 4.555 9.445 3.375 8 3.375C6.555 3.375 5.375 4.555 5.375 6C5.375 6.205 5.205 6.375 5 6.375C4.795 6.375 4.625 6.205 4.625 6C4.625 4.14 6.14 2.625 8 2.625C9.86 2.625 11.375 4.14 11.375 6C11.375 7.86 9.86 9.375 8 9.375Z",
+		fill: "#4D75D9"
+	})]
+});
 //#endregion
 //#region src/view/components/ApiPage/components/ApiCard.tsx
 const ApiCard = ({ api, viewStyle }) => {
-	const { wrapSSR, cx, token: token$1 } = useStyle("DocumentationApiCard", (token$2, scope) => ({
+	const { wrapSSR, cx, token } = useStyle("DocumentationApiCard", (token, scope) => ({
 		[scope("method-chip")]: {
 			minWidth: "5.375rem",
 			width: "fit-content",
-			paddingLeft: token$2.marginXS,
-			paddingRight: token$2.marginXS,
+			paddingLeft: token.marginXS,
+			paddingRight: token.marginXS,
 			display: "flex",
 			justifyContent: "center",
 			alignItems: "center",
-			borderRadius: token$2.borderRadius
+			borderRadius: token.borderRadius
 		},
 		[scope("list-container")]: {
-			paddingTop: token$2.marginXS,
-			paddingBottom: token$2.marginXS
+			paddingTop: token.marginXS,
+			paddingBottom: token.marginXS
 		},
 		[scope("chip-title")]: {
 			alignSelf: "center",
@@ -1275,97 +1292,97 @@ const ApiCard = ({ api, viewStyle }) => {
 			padding: 0,
 			margin: 0,
 			lineHeight: "1.375rem",
-			fontSize: token$2.fontSize
+			fontSize: token.fontSize
 		},
 		[scope("list-see-details")]: {
 			width: "6.5625rem",
 			height: "2rem",
-			borderRadius: token$2.borderRadius,
-			border: `${token$2.lineWidth}px solid ${token$2.Button?.defaultBorderColor}`,
-			paddingRight: token$2.Button?.paddingInline,
-			paddingLeft: token$2.Button?.paddingInline,
-			background: token$2.Button?.defaultBg,
-			"&:hover": { background: token$2.Button?.defaultBg }
+			borderRadius: token.borderRadius,
+			border: `${token.lineWidth}px solid ${token.Button?.defaultBorderColor}`,
+			paddingRight: token.Button?.paddingInline,
+			paddingLeft: token.Button?.paddingInline,
+			background: token.Button?.defaultBg,
+			"&:hover": { background: token.Button?.defaultBg }
 		},
 		[scope("list-content")]: {
 			display: "flex",
-			paddingTop: token$2.paddingXXS,
-			paddingBottom: token$2.paddingXXS,
-			paddingRight: token$2.paddingXS,
-			paddingLeft: token$2.paddingXS,
+			paddingTop: token.paddingXXS,
+			paddingBottom: token.paddingXXS,
+			paddingRight: token.paddingXS,
+			paddingLeft: token.paddingXS,
 			alignItems: "center",
-			gap: token$2.marginXS,
+			gap: token.marginXS,
 			alignSelf: "stretch",
 			flexDirection: "row",
-			borderRadius: token$2.borderRadiusSM,
-			border: `1px solid ${token$2.colorBorderSecondary}`,
+			borderRadius: token.borderRadiusSM,
+			border: `1px solid ${token.colorBorderSecondary}`,
 			minWidth: "6.25rem",
 			maxWidth: "fit-content",
-			svg: { path: { fill: token$2.colorPrimary } }
+			svg: { path: { fill: token.colorPrimary } }
 		},
 		[scope("list-title")]: {
-			color: token$2.colorTextHeading,
-			fontSize: token$2.fontSizeHeading3,
-			fontWeight: token$2.fontWeightStrong,
-			lineHeight: token$2.lineHeightHeading3,
+			color: token.colorTextHeading,
+			fontSize: token.fontSizeHeading3,
+			fontWeight: token.fontWeightStrong,
+			lineHeight: token.lineHeightHeading3,
 			paddingBottom: 0,
 			marginBottom: 0,
-			fontFamily: token$2.fontFamily,
+			fontFamily: token.fontFamily,
 			cursor: "pointer",
 			transition: "color 0.2s ease-in",
 			"&:hover": {
-				color: `${token$2.colorPrimary} !important`,
+				color: `${token.colorPrimary} !important`,
 				textDecoration: "underline"
 			}
 		},
 		[scope("path-name")]: {
-			color: token$2.colorText,
-			fontSize: token$2.fontSizeSM,
+			color: token.colorText,
+			fontSize: token.fontSizeSM,
 			fontWeight: 400,
-			fontFamily: token$2.fontFamily
+			fontFamily: token.fontFamily
 		},
 		[scope("grid-card")]: {
 			width: "17.5rem",
 			height: "100%",
-			borderRadius: token$2.borderRadiusLG
+			borderRadius: token.borderRadiusLG
 		},
 		[scope("grid-title")]: {
-			color: token$2.colorTextHeading,
-			fontSize: token$2.fontSizeHeading3,
-			fontWeight: token$2.fontWeightStrong,
-			lineHeight: token$2.lineHeightHeading3,
+			color: token.colorTextHeading,
+			fontSize: token.fontSizeHeading3,
+			fontWeight: token.fontWeightStrong,
+			lineHeight: token.lineHeightHeading3,
 			paddingBottom: 0,
 			marginBottom: 0,
-			fontFamily: token$2.fontFamily
+			fontFamily: token.fontFamily
 		},
 		[scope("grid-content")]: {
 			display: "flex",
-			paddingTop: token$2.paddingXXS,
-			paddingBottom: token$2.paddingXXS,
-			paddingRight: token$2.paddingXS,
-			paddingLeft: token$2.paddingXS,
+			paddingTop: token.paddingXXS,
+			paddingBottom: token.paddingXXS,
+			paddingRight: token.paddingXS,
+			paddingLeft: token.paddingXS,
 			alignItems: "center",
-			gap: token$2.marginXS,
+			gap: token.marginXS,
 			alignSelf: "stretch",
 			flexDirection: "row",
-			borderRadius: token$2.borderRadiusSM,
-			border: `1px solid ${token$2.colorBorderSecondary}`,
-			svg: { path: { fill: token$2.colorPrimary } }
+			borderRadius: token.borderRadiusSM,
+			border: `1px solid ${token.colorBorderSecondary}`,
+			svg: { path: { fill: token.colorPrimary } }
 		},
 		[scope("grid-path-name")]: {
-			color: token$2.colorText,
-			fontSize: token$2.fontSizeSM,
+			color: token.colorText,
+			fontSize: token.fontSizeSM,
 			fontWeight: 400,
-			fontFamily: token$2.fontFamily
+			fontFamily: token.fontFamily
 		},
 		[scope("grid-see-details")]: {
 			paddingTop: 0,
 			paddingBottom: 0,
 			paddingLeft: "0.4375rem",
 			paddingRight: "0.4375rem",
-			borderRadius: token$2.borderRadiusSM,
-			border: `1px solid ${token$2.Button?.defaultBorderColor}`,
-			background: token$2.Button?.defaultBg,
+			borderRadius: token.borderRadiusSM,
+			border: `1px solid ${token.Button?.defaultBorderColor}`,
+			background: token.Button?.defaultBg,
 			boxShadow: `0 2px 0 0 rgba(0, 0, 0, 0.02)`,
 			width: "100%",
 			height: "1.5rem"
@@ -1409,7 +1426,7 @@ const ApiCard = ({ api, viewStyle }) => {
 				align: "center",
 				className: cx("list-container"),
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(antd.Flex, {
-					gap: token$1.marginSM,
+					gap: token.marginSM,
 					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MethodChip, { method: api.method }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd_es_typography_Title.default, {
 						className: cx("list-title"),
 						level: 4,
@@ -1424,7 +1441,7 @@ const ApiCard = ({ api, viewStyle }) => {
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: cx("list-content"),
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(link_default, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd_es_typography_Text.default, {
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Link, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd_es_typography_Text.default, {
 					className: cx("path-name"),
 					children: api?.path
 				})]
@@ -1439,7 +1456,7 @@ const ApiCard = ({ api, viewStyle }) => {
 		className: cx("grid-card"),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(antd.Flex, {
 			vertical: true,
-			gap: token$1.marginSM,
+			gap: token.marginSM,
 			children: [
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MethodChip, { method: api?.method }),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd_es_typography_Title.default, {
@@ -1449,7 +1466,7 @@ const ApiCard = ({ api, viewStyle }) => {
 				}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: cx("grid-content"),
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(link_default, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd_es_typography_Text.default, {
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Link, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd_es_typography_Text.default, {
 						className: cx("grid-path-name"),
 						children: api?.path
 					})]
@@ -1463,8 +1480,6 @@ const ApiCard = ({ api, viewStyle }) => {
 		})
 	}));
 };
-var ApiCard_default = ApiCard;
-
 //#endregion
 //#region src/view/components/ApiPage/components/ViewModeApiHeader.tsx
 function formatAuthType(authType) {
@@ -1478,11 +1493,11 @@ function formatAuthType(authType) {
 	}
 }
 const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
-	const { wrapSSR, cx, token: token$1 } = useStyle("ViewModeApiHeader", (token$2, scope) => ({
+	const { wrapSSR, cx } = useStyle("ViewModeApiHeader", (token, scope) => ({
 		[scope("root")]: {
 			display: "flex",
 			flexDirection: "column",
-			gap: token$2.marginMD
+			gap: token.marginMD
 		},
 		[scope("meta-bar")]: {
 			display: "flex",
@@ -1498,20 +1513,20 @@ const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
 			display: "flex",
 			alignItems: "center",
 			paddingRight: 12,
-			borderRight: `1px solid ${token$2.colorBorderSecondary}`,
+			borderRight: `1px solid ${token.colorBorderSecondary}`,
 			marginRight: 12
 		},
 		[scope("jws-tag")]: {
 			display: "flex",
 			alignItems: "center",
 			height: 32,
-			background: token$2.colorPrimaryBg,
-			border: `1px solid ${token$2.colorPrimaryBorder}`,
+			background: token.colorPrimaryBg,
+			border: `1px solid ${token.colorPrimaryBorder}`,
 			borderRadius: 6,
 			padding: "0 8px",
 			fontSize: 12,
 			lineHeight: "20px",
-			color: token$2.colorPrimary,
+			color: token.colorPrimary,
 			fontWeight: 400,
 			margin: 0
 		},
@@ -1519,14 +1534,14 @@ const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
 			display: "inline-flex",
 			alignItems: "center",
 			gap: 4,
-			background: token$2.colorBgContainer,
-			border: `1px solid ${token$2.colorBorder}`,
+			background: token.colorBgContainer,
+			border: `1px solid ${token.colorBorder}`,
 			borderRadius: 4,
 			padding: "0 8px",
 			height: 32,
 			fontSize: 12,
 			lineHeight: "20px",
-			color: token$2.colorText,
+			color: token.colorText,
 			margin: 0,
 			boxSizing: "border-box"
 		},
@@ -1539,8 +1554,8 @@ const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
 			display: "inline-flex",
 			alignItems: "center",
 			gap: 8,
-			background: token$2.colorFillTertiary,
-			border: `1px solid ${token$2.colorBorder}`,
+			background: token.colorFillTertiary,
+			border: `1px solid ${token.colorBorder}`,
 			borderRadius: 6,
 			padding: "0 15px",
 			height: 32,
@@ -1549,13 +1564,13 @@ const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
 		},
 		[scope("version-icon")]: {
 			fontSize: 16,
-			color: token$2.colorTextDisabled,
+			color: token.colorTextDisabled,
 			display: "flex",
 			alignItems: "center"
 		},
 		[scope("version-text")]: {
 			fontSize: 14,
-			color: token$2.colorTextDisabled,
+			color: token.colorTextDisabled,
 			fontWeight: 400,
 			lineHeight: 1
 		},
@@ -1569,16 +1584,16 @@ const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
 			justifyContent: "center"
 		},
 		[scope("toggle-btn-active")]: {
-			border: `1px solid ${token$2.colorPrimary} !important`,
-			color: `${token$2.colorPrimary} !important`,
-			backgroundColor: `${token$2.colorBgContainer} !important`,
+			border: `1px solid ${token.colorPrimary} !important`,
+			color: `${token.colorPrimary} !important`,
+			backgroundColor: `${token.colorBgContainer} !important`,
 			zIndex: 1
 		},
 		[scope("description")]: {
-			fontSize: token$2.fontSizeLG,
-			color: token$2.colorTextTertiary
+			fontSize: token.fontSizeLG,
+			color: token.colorTextTertiary
 		},
-		[scope("title")]: { fontFamily: token$2.fontFamily }
+		[scope("title")]: { fontFamily: token.fontFamily }
 	}));
 	const version = api.relatedVersions?.find((v) => v.apiId === api.currentVersion)?.version || api.version;
 	return wrapSSR(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -1613,7 +1628,7 @@ const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
 								className: cx("auth-tag"),
 								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: cx("auth-icon"),
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.SafetyOutlined, {})
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.SafetyOutlined, {})
 								}), formatAuthType(api.authType)]
 							})
 						}),
@@ -1624,7 +1639,7 @@ const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
 								children: [
 									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 										className: cx("version-icon"),
-										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.InfoCircleOutlined, {})
+										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.InfoCircleOutlined, {})
 									}),
 									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 										className: cx("version-text"),
@@ -1632,7 +1647,7 @@ const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
 									}),
 									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 										className: cx("version-icon"),
-										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.DownOutlined, {})
+										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.DownOutlined, {})
 									})
 								]
 							})
@@ -1642,12 +1657,12 @@ const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
 					className: cx("view-toggle"),
 					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 						className: cx("toggle-btn", viewLayout === "grid" ? "toggle-btn-active" : ""),
-						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.AppstoreOutlined, {}),
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.AppstoreOutlined, {}),
 						onClick: () => onViewLayoutChange("grid"),
 						style: { borderRadius: "4px 0 0 4px" }
 					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 						className: cx("toggle-btn", viewLayout === "list" ? "toggle-btn-active" : ""),
-						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.BarsOutlined, {}),
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.BarsOutlined, {}),
 						onClick: () => onViewLayoutChange("list"),
 						style: {
 							borderRadius: "0 4px 4px 0",
@@ -1663,20 +1678,18 @@ const ViewModeApiHeader = ({ api, viewLayout, onViewLayoutChange }) => {
 		]
 	}));
 };
-
 //#endregion
 //#region src/view/components/ApiPage/index.tsx
 const APIPage = () => {
-	const [selectedUrl, setSelectedUrl] = (0, react.useState)("");
-	const { view: { selectedApi, transformedData, setSelectedApi, setFocusedContent, setSelectedNodeKey, focusedTag, setFocusedTag } } = store_default();
-	const [viewStyle, setViewStyle] = (0, react.useState)("grid");
-	const { wrapSSR, cx, token: token$1 } = useStyle("DocumentationApiPage", () => ({}));
-	selectedApi?.relatedVersions?.find((v) => v.apiId === selectedApi?.currentVersion);
-	const urlsOptions = (0, react.useMemo)(() => selectedApi?.servers?.map((server) => ({
+	const [selectedUrl, setSelectedUrl] = (0, react$1.useState)("");
+	const { view: { selectedApi, focusedTag, setFocusedTag } } = useStore();
+	const [viewStyle, setViewStyle] = (0, react$1.useState)("grid");
+	const { wrapSSR, token } = useStyle("DocumentationApiPage", () => ({}));
+	const urlsOptions = (0, react$1.useMemo)(() => selectedApi?.servers?.map((server) => ({
 		label: server?.url,
 		value: server?.url
 	})), [selectedApi?.servers]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (focusedTag && document.getElementById(focusedTag)) {
 			const element = document.getElementById(focusedTag);
 			if (element) element.scrollIntoView({ behavior: "smooth" });
@@ -1687,10 +1700,10 @@ const APIPage = () => {
 		setFocusedTag,
 		selectedApi
 	]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (!!urlsOptions?.length) setSelectedUrl(urlsOptions[0]?.value);
 	}, [selectedApi, urlsOptions]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (selectedApi?.servers && !selectedUrl) setSelectedUrl(selectedApi?.servers?.[0].url);
 	}, [selectedApi?.servers]);
 	const getEndpointsForSelectedUrl = () => {
@@ -1711,7 +1724,7 @@ const APIPage = () => {
 	};
 	return wrapSSR(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(antd.Flex, {
 		vertical: true,
-		gap: token$1.margin,
+		gap: token.margin,
 		children: [selectedApi && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ViewModeApiHeader, {
 			api: selectedApi,
 			viewLayout: viewStyle,
@@ -1728,14 +1741,14 @@ const APIPage = () => {
 				haveUnderLine: index < arr.length - 1,
 				contextPath: selectedApi?.contextPath,
 				viewStyle,
-				token: token$1
+				token
 			}, `${selectedApi?.id}_${key}`);
 		})]
 	}));
 };
-const APIsRenderer = ({ apis, withTitle, tagName, haveUnderLine, contextPath, viewStyle, token: token$1 }) => {
+const APIsRenderer = ({ apis, withTitle, tagName, haveUnderLine, contextPath, viewStyle, token }) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(antd.Flex, {
-		gap: viewStyle === "grid" ? token$1.marginXS : 0,
+		gap: viewStyle === "grid" ? token.marginXS : 0,
 		style: {
 			marginBottom: 0,
 			paddingBottom: 0
@@ -1752,19 +1765,18 @@ const APIsRenderer = ({ apis, withTitle, tagName, haveUnderLine, contextPath, vi
 				wrap: "wrap",
 				gap: viewStyle === "grid" ? "1.5rem" : 0,
 				vertical: viewStyle === "list",
-				children: apis.map((item) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ApiCard_default, {
+				children: apis.map((item) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ApiCard, {
 					api: item,
 					viewStyle
 				}, `${tagName}_renderer_${item.id}_${item.method}_${item.path}`))
 			}),
 			haveUnderLine && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Divider, { style: {
-				marginTop: token$1.marginSM,
-				marginBottom: token$1.marginSM
+				marginTop: token.marginSM,
+				marginBottom: token.marginSM
 			} })
 		]
 	}, `${tagName}_renderer_${contextPath}`);
 };
-
 //#endregion
 //#region src/utils/index.ts
 const handleStatusColor = (code) => {
@@ -1775,7 +1787,6 @@ const handleStatusColor = (code) => {
 	else if (code >= 300 && code < 400) return "orange";
 	else return "gray";
 };
-
 //#endregion
 //#region src/view/components/EndpointPage/EndpointPage.tsx
 const { Title: Title$5, Paragraph } = antd.Typography;
@@ -1797,7 +1808,7 @@ const requestColumns = [
 	}
 ];
 const responseColumns = [...requestColumns];
-const buildRequestData = (params, token$1) => [...params].sort((a, b) => a.required === b.required ? 0 : a.required ? -1 : 1).map((p, index) => {
+const buildRequestData = (params, token) => [...params].sort((a, b) => a.required === b.required ? 0 : a.required ? -1 : 1).map((p, index) => {
 	let typeLabel = p.schema?.type;
 	if (p.schema?.type === "array" && p.schema?.items?.type) typeLabel = `${p.schema.type}_${p.schema.items.type}`;
 	return {
@@ -1806,17 +1817,17 @@ const buildRequestData = (params, token$1) => [...params].sort((a, b) => a.requi
 			p.name,
 			typeLabel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				style: {
-					color: token$1.colorTextTertiary,
+					color: token.colorTextTertiary,
 					marginLeft: "0.25rem",
 					marginRight: "0.25rem"
 				},
 				children: typeLabel
 			}),
 			p.required ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				style: { color: token$1.colorError },
+				style: { color: token.colorError },
 				children: "*"
 			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				style: { color: token$1.colorSuccess },
+				style: { color: token.colorSuccess },
 				children: "Optional"
 			})
 		] }),
@@ -1824,7 +1835,7 @@ const buildRequestData = (params, token$1) => [...params].sort((a, b) => a.requi
 		enum: p.schema?.enum ? p.schema.enum.map((e) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Tag, { children: e }, e)) : "--"
 	};
 });
-const buildHeaderData = (headers, token$1) => {
+const buildHeaderData = (headers, token) => {
 	if (!headers) return [];
 	return Object.entries(headers).sort(([, a], [, b]) => a.required === b.required ? 0 : a.required ? -1 : 1).map(([name, header], idx) => {
 		let typeLabel = header.schema?.type;
@@ -1835,17 +1846,17 @@ const buildHeaderData = (headers, token$1) => {
 				name,
 				typeLabel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 					style: {
-						color: token$1.colorTextTertiary,
+						color: token.colorTextTertiary,
 						marginLeft: "0.25rem",
 						marginRight: "0.25rem"
 					},
 					children: typeLabel
 				}),
 				header.required ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					style: { color: token$1.colorError },
+					style: { color: token.colorError },
 					children: "*"
 				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					style: { color: token$1.colorSuccess },
+					style: { color: token.colorSuccess },
 					children: "Optional"
 				})
 			] }, idx),
@@ -1854,7 +1865,7 @@ const buildHeaderData = (headers, token$1) => {
 		};
 	});
 };
-const buildRequestBodyData = (requestBody, token$1) => {
+const buildRequestBodyData = (requestBody, token) => {
 	if (!requestBody?.content) return [];
 	const contentType = Object.keys(requestBody.content)[0];
 	const schema = requestBody.content[contentType]?.schema;
@@ -1867,17 +1878,17 @@ const buildRequestBodyData = (requestBody, token$1) => {
 			name,
 			prop.type && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				style: {
-					color: token$1.colorTextTertiary,
+					color: token.colorTextTertiary,
 					marginLeft: "0.25rem",
 					marginRight: "0.25rem"
 				},
 				children: prop.type
 			}),
 			required.includes(name) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				style: { color: token$1.colorError },
+				style: { color: token.colorError },
 				children: "*"
 			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				style: { color: token$1.colorSuccess },
+				style: { color: token.colorSuccess },
 				children: "Optional"
 			})
 		] }),
@@ -1886,14 +1897,14 @@ const buildRequestBodyData = (requestBody, token$1) => {
 	}));
 };
 const EndpointPage = () => {
-	const { selectedEndpoint, selectedApi, selectedStatusCode, setSelectedNodeKey, setFocusedContent, setFocusedTag, setActiveRequestTab } = store_default(({ view }) => view);
-	const [activeTabKey, setActiveTabKey] = (0, react.useState)("header");
-	const { token: token$1 } = antd.theme.useToken();
-	const { cx } = useStyle("EndpointPage", (token$2, scope) => ({
+	const { selectedEndpoint, selectedApi, selectedStatusCode, setSelectedNodeKey, setFocusedContent, setFocusedTag, setActiveRequestTab } = useStore(({ view }) => view);
+	const [activeTabKey, setActiveTabKey] = (0, react$1.useState)("header");
+	const { token } = antd.theme.useToken();
+	const { cx } = useStyle("EndpointPage", (token, scope) => ({
 		[scope("docs-endpoint-container")]: {
 			display: "flex",
 			flexDirection: "column",
-			gap: token$2.marginLG,
+			gap: token.marginLG,
 			height: "100%"
 		},
 		[scope("content")]: {
@@ -1902,43 +1913,43 @@ const EndpointPage = () => {
 		},
 		[scope("code")]: {
 			background: "unset",
-			borderRadius: token$2.borderRadius,
-			padding: token$2.paddingSM,
+			borderRadius: token.borderRadius,
+			padding: token.paddingSM,
 			fontFamily: "monospace",
 			whiteSpace: "pre-wrap"
 		},
 		[scope("breadcrumb")]: {
 			display: "flex",
-			gap: token$2.marginLG,
+			gap: token.marginLG,
 			alignItems: "center",
-			marginBottom: token$2.marginLG
+			marginBottom: token.marginLG
 		},
 		[scope("request-card")]: {
-			borderRadius: token$2.borderRadius,
-			backgroundColor: token$2.colorBgBase,
+			borderRadius: token.borderRadius,
+			backgroundColor: token.colorBgBase,
 			".ant-card-head": {
 				minHeight: "unset",
 				borderBottom: "unset",
 				padding: "0.75rem",
-				backgroundColor: token$2.colorBgBase
+				backgroundColor: token.colorBgBase
 			},
 			".ant-card-body": {
 				padding: "0px 0.75rem 0.75rem 0.75rem",
-				backgroundColor: token$2.colorBgBase,
+				backgroundColor: token.colorBgBase,
 				".ant-tabs-tab": { paddingTop: "0" }
 			},
-			"& .ant-table": { backgroundColor: `${token$2.colorBgBase} !important` },
-			"& .ant-table-thead > tr > th": { backgroundColor: `${token$2.colorBgBase} !important` },
-			"& .ant-table-tbody > tr > td": { backgroundColor: `${token$2.colorBgBase} !important` }
+			"& .ant-table": { backgroundColor: `${token.colorBgBase} !important` },
+			"& .ant-table-thead > tr > th": { backgroundColor: `${token.colorBgBase} !important` },
+			"& .ant-table-tbody > tr > td": { backgroundColor: `${token.colorBgBase} !important` }
 		},
-		[scope("row-odd")]: { "& > td": { background: `${token$2.colorBgElevated} !important` } },
-		[scope("row-even")]: { "& > td": { background: `${token$2.colorBgLayout} !important` } }
+		[scope("row-odd")]: { "& > td": { background: `${token.colorBgElevated} !important` } },
+		[scope("row-even")]: { "& > td": { background: `${token.colorBgLayout} !important` } }
 	}));
-	const methodStyle = methodColors[selectedEndpoint?.method];
-	const headerParams = buildRequestData(selectedEndpoint?.parameters?.filter((p) => p.in === "header") || [], token$1);
-	const pathParams = buildRequestData(selectedEndpoint?.parameters?.filter((p) => p.in === "path") || [], token$1);
-	const queryParams = buildRequestData(selectedEndpoint?.parameters?.filter((p) => p.in === "query") || [], token$1);
-	const requestBodyData = buildRequestBodyData(selectedEndpoint?.requestBody, token$1);
+	const methodStyle = sidebarMethodColors[selectedEndpoint?.method];
+	const headerParams = buildRequestData(selectedEndpoint?.parameters?.filter((p) => p.in === "header") || [], token);
+	const pathParams = buildRequestData(selectedEndpoint?.parameters?.filter((p) => p.in === "path") || [], token);
+	const queryParams = buildRequestData(selectedEndpoint?.parameters?.filter((p) => p.in === "query") || [], token);
+	const requestBodyData = buildRequestBodyData(selectedEndpoint?.requestBody, token);
 	const requestTabs = [
 		{
 			key: "header",
@@ -1989,13 +2000,13 @@ const EndpointPage = () => {
 			})
 		}] : []
 	].filter((t) => t !== null);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		const firstKey = requestTabs[0]?.key ?? "header";
 		setActiveTabKey(firstKey);
 		setActiveRequestTab(firstKey);
 	}, [selectedEndpoint?.id]);
 	const responseHeaders = (selectedEndpoint?.responses?.[selectedStatusCode || 200])?.headers;
-	const responseHeaderData = buildHeaderData(responseHeaders, token$1);
+	const responseHeaderData = buildHeaderData(responseHeaders, token);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: cx("docs-endpoint-container"),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -2006,7 +2017,7 @@ const EndpointPage = () => {
 					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 						color: "default",
 						variant: "outlined",
-						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.LeftOutlined, {}),
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.LeftOutlined, {}),
 						onClick: (e) => {
 							e.preventDefault();
 							setSelectedNodeKey(selectedApi?.id);
@@ -2035,18 +2046,24 @@ const EndpointPage = () => {
 									display: "flex",
 									flexDirection: "row",
 									alignItems: "center",
-									color: token$1.colorTextTertiary,
+									color: token.colorTextTertiary,
 									gap: "0.25rem"
 								},
 								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: selectedEndpoint?.tagName || "default" })
 							})
 						},
-						{ title: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							style: {
-								display: "flex",
-								gap: "1rem"
-							},
-							children: selectedEndpoint?.summary || "Endpoint Name"
+						{ title: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Tooltip, {
+							title: selectedEndpoint?.summary || "Endpoint Name",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								style: {
+									overflow: "hidden",
+									textOverflow: "ellipsis",
+									whiteSpace: "nowrap",
+									display: "block",
+									maxWidth: "300px"
+								},
+								children: selectedEndpoint?.summary || "Endpoint Name"
+							})
 						}) }
 					] })]
 				}),
@@ -2069,11 +2086,21 @@ const EndpointPage = () => {
 							flexShrink: 0
 						},
 						children: selectedEndpoint?.method
-					}), selectedEndpoint?.summary?.replace(selectedEndpoint?.method, "") ?? "--"]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Tooltip, {
+						title: selectedEndpoint?.summary ?? "--",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							style: {
+								overflow: "hidden",
+								textOverflow: "ellipsis",
+								whiteSpace: "nowrap"
+							},
+							children: selectedEndpoint?.summary?.replace(selectedEndpoint?.method, "") ?? "--"
+						})
+					})]
 				}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Paragraph, {
 					style: {
-						color: token$1.colorTextTertiary,
+						color: token.colorTextTertiary,
 						marginBottom: "1.5rem"
 					},
 					children: selectedEndpoint?.description ?? "--"
@@ -2083,9 +2110,9 @@ const EndpointPage = () => {
 					className: cx("request-card"),
 					style: {
 						marginBottom: "1.5rem",
-						backgroundColor: token$1.colorBgBase
+						backgroundColor: token.colorBgBase
 					},
-					styles: { body: { backgroundColor: token$1.colorBgBase } },
+					styles: { body: { backgroundColor: token.colorBgBase } },
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Tabs, {
 						activeKey: activeTabKey,
 						onChange: (key) => {
@@ -2119,51 +2146,41 @@ const EndpointPage = () => {
 		})
 	});
 };
-
 //#endregion
-//#region src/assets/mouseSquare.svg
-var _path$3, _path2$2;
-function _extends$3() {
-	return _extends$3 = Object.assign ? Object.assign.bind() : function(n) {
-		for (var e = 1; e < arguments.length; e++) {
-			var t = arguments[e];
-			for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
-		}
-		return n;
-	}, _extends$3.apply(null, arguments);
-}
-var SvgMouseSquare = function SvgMouseSquare$1(props) {
-	return /* @__PURE__ */ react.createElement("svg", _extends$3({
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 18,
-		height: 18,
-		fill: "none"
-	}, props), _path$3 || (_path$3 = /* @__PURE__ */ react.createElement("path", {
-		stroke: "#fff",
+//#region src/assets/mouseSquare.tsx
+const MouseSquare = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+	width: "18",
+	height: "18",
+	viewBox: "0 0 18 18",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M16.5 9V6.75C16.5 3 15 1.5 11.25 1.5H6.75C3 1.5 1.5 3 1.5 6.75V11.25C1.5 15 3 16.5 6.75 16.5H9",
+		stroke: "white",
+		strokeWidth: "1.5",
 		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		strokeWidth: 1.5,
-		d: "M16.5 9V6.75C16.5 3 15 1.5 11.25 1.5h-4.5C3 1.5 1.5 3 1.5 6.75v4.5C1.5 15 3 16.5 6.75 16.5H9"
-	})), _path2$2 || (_path2$2 = /* @__PURE__ */ react.createElement("path", {
-		stroke: "#fff",
+		strokeLinejoin: "round"
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M15.7202 13.3808L14.4978 13.7934C14.1603 13.9059 13.8902 14.1684 13.7777 14.5134L13.3652 15.7359C13.0127 16.7934 11.5277 16.7709 11.1977 15.7134L9.81025 11.2508C9.54025 10.3658 10.3577 9.54085 11.2352 9.81835L15.7053 11.2059C16.7553 11.5359 16.7702 13.0283 15.7202 13.3808Z",
+		stroke: "white",
+		strokeWidth: "1.5",
 		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		strokeWidth: 1.5,
-		d: "m15.72 13.38-1.222.413a1.13 1.13 0 0 0-.72.72l-.413 1.223c-.352 1.057-1.837 1.035-2.167-.023L9.81 11.251c-.27-.885.548-1.71 1.425-1.433l4.47 1.388c1.05.33 1.065 1.822.015 2.175"
-	})));
-};
-var mouseSquare_default = SvgMouseSquare;
-
+		strokeLinejoin: "round"
+	})]
+});
 //#endregion
 //#region src/view/components/MainContent.tsx
 const MainContent = ({ searchEnabled, handleResetSearch, handleVisitLandingPage }) => {
-	const { focusedContent, transformedData } = store_default(({ view }) => view);
-	const { wrapSSR, cx, token: token$1 } = useStyle("MainContent", (token$2, scope) => ({
+	const { focusedContent, transformedData } = useStore(({ view }) => view);
+	const { wrapSSR, cx, token } = useStyle("MainContent", (token, scope) => ({
 		[scope("inner-doc-container")]: {
 			width: "100%",
 			height: "auto",
-			borderRadius: token$2.borderRadius,
-			padding: token$2.paddingXL
+			borderRadius: token.borderRadius,
+			padding: token.paddingXL,
+			overflow: "hidden",
+			minWidth: 0
 		},
 		[scope("centered")]: {
 			display: "flex",
@@ -2174,31 +2191,31 @@ const MainContent = ({ searchEnabled, handleResetSearch, handleVisitLandingPage
 			padding: 0
 		},
 		[scope("title")]: {
-			fontFamily: token$2.fontFamily,
+			fontFamily: token.fontFamily,
 			fontWeight: 600,
-			fontSize: token$2.fontSizeHeading4,
-			color: token$2.colorText
+			fontSize: token.fontSizeHeading4,
+			color: token.colorText
 		},
 		[scope("text")]: {
-			color: token$2.colorText,
-			fontFamily: token$2.fontFamily
+			color: token.colorText,
+			fontFamily: token.fontFamily
 		},
 		[scope("visit-landing-button")]: {
 			width: "12.25rem",
 			height: "2.5rem",
-			borderRadius: token$2.borderRadiusLG
+			borderRadius: token.borderRadiusLG
 		},
 		[scope("reset-button")]: {
 			width: "8.125rem",
 			height: "2.5rem",
-			borderRadius: token$2.borderRadiusLG,
-			backgroundColor: token$2?.Button?.primaryColor,
-			fontSize: token$2.Button?.contentFontSizeLG
+			borderRadius: token.borderRadiusLG,
+			backgroundColor: token?.Button?.primaryColor,
+			fontSize: token.Button?.contentFontSizeLG
 		}
 	}));
 	return wrapSSR(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: cx("inner-doc-container", !transformedData?.length ? "centered" : ""),
-		style: { backgroundColor: focusedContent === "ENDPOINT" ? token$1.colorBgBase : token$1.colorBgElevated },
+		style: { backgroundColor: focusedContent === "ENDPOINT" ? token.colorBgBase : token.colorBgElevated },
 		children: !transformedData?.length ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(antd.Flex, {
 			justify: "center",
 			align: "center",
@@ -2206,9 +2223,9 @@ const MainContent = ({ searchEnabled, handleResetSearch, handleVisitLandingPage
 			vertical: true,
 			flex: 1,
 			children: [
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(NoDataIcon_default, {
-					stroke: token$1.colorPrimaryHover,
-					fill: token$1.colorPrimaryBg,
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(NoDataIcon, {
+					stroke: token.colorPrimaryHover,
+					fill: token.colorPrimaryBg,
 					width: "18.625rem",
 					height: "14.75rem"
 				}),
@@ -2229,7 +2246,7 @@ const MainContent = ({ searchEnabled, handleResetSearch, handleVisitLandingPage
 				!searchEnabled ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 					type: "primary",
 					onClick: handleVisitLandingPage,
-					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(mouseSquare_default, {}),
+					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MouseSquare, {}),
 					iconPosition: "start",
 					className: cx("visit-landing-button"),
 					children: "Visit Landing Page"
@@ -2243,27 +2260,26 @@ const MainContent = ({ searchEnabled, handleResetSearch, handleVisitLandingPage
 		}) : focusedContent === "ENDPOINT" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EndpointPage, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(APIPage, {})
 	}));
 };
-
 //#endregion
 //#region src/view/components/ApiPage/components/ApiDocumentationBar.tsx
 const { useBreakpoint: useBreakpoint$3 } = antd.Grid;
 const { Title: Title$3 } = antd.Typography;
 const ApiDocumentationBar = ({ apiName, mode, onModeChange, onReset, onSave, hasChanges = false, switcherNode }) => {
 	const isMobile = !useBreakpoint$3().md;
-	const { wrapSSR, cx, token: token$1 } = useStyle("ApiDocumentationBar", (token$2, scope) => ({
+	const { wrapSSR, cx, token } = useStyle("ApiDocumentationBar", (token, scope) => ({
 		[scope("root")]: {
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "space-between",
-			padding: `${token$2.marginSM + 4}px ${token$2.paddingLG}px`,
-			background: token$2.colorBgContainer,
-			borderRadius: token$2.borderRadius,
+			padding: `${token.marginSM + 4}px ${token.paddingLG}px`,
+			background: token.colorBgContainer,
+			borderRadius: token.borderRadius,
 			width: "100%",
-			["@media (max-width: 640px)"]: { padding: `${token$2.marginSM}px ${token$2.marginMD}px` }
+			["@media (max-width: 640px)"]: { padding: `${token.marginSM}px ${token.marginMD}px` }
 		},
 		[scope("mobileWrapper")]: {
 			flexDirection: "column",
-			gap: token$2.marginMD
+			gap: token.marginMD
 		},
 		[scope("mobileTopRow")]: {
 			width: "100%",
@@ -2286,7 +2302,9 @@ const ApiDocumentationBar = ({ apiName, mode, onModeChange, onReset, onSave, has
 			flex: 1,
 			display: "flex",
 			alignItems: "center",
-			gap: token$2.marginSM
+			gap: token.marginSM,
+			minWidth: 0,
+			overflow: "hidden"
 		},
 		[scope("arrow-icon")]: {
 			width: 24,
@@ -2294,14 +2312,14 @@ const ApiDocumentationBar = ({ apiName, mode, onModeChange, onReset, onSave, has
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "center",
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("switcher")]: {
 			display: "flex",
 			alignItems: "center",
-			background: token$2.colorBgLayout,
-			padding: "4px 48px",
-			borderRadius: token$2.borderRadius,
+			background: token.colorBgLayout,
+			padding: "4px 4px",
+			borderRadius: token.borderRadius,
 			gap: 8
 		},
 		[scope("switcher-item")]: {
@@ -2312,17 +2330,17 @@ const ApiDocumentationBar = ({ apiName, mode, onModeChange, onReset, onSave, has
 			background: "transparent",
 			border: "none",
 			cursor: "pointer",
-			fontSize: token$2.fontSizeLG,
+			fontSize: token.fontSizeLG,
 			fontWeight: 400,
-			color: token$2.colorText,
-			fontFamily: token$2.fontFamily,
+			color: token.colorText,
+			fontFamily: token.fontFamily,
 			transition: "all 0.2s ease"
 		},
 		[scope("switcher-item-active")]: {
-			background: token$2.colorBgContainer,
-			borderRadius: token$2.borderRadius,
+			background: token.colorBgContainer,
+			borderRadius: token.borderRadius,
 			boxShadow: "0px 2px 4px -2px rgba(17,12,34,0.12)",
-			fontSize: token$2.fontSize,
+			fontSize: token.fontSize,
 			fontWeight: 700
 		},
 		[scope("switcher-icon")]: {
@@ -2336,14 +2354,14 @@ const ApiDocumentationBar = ({ apiName, mode, onModeChange, onReset, onSave, has
 		[scope("actions")]: {
 			display: "flex",
 			alignItems: "center",
-			gap: token$2.marginMD,
+			gap: token.marginMD,
 			flex: 1,
 			justifyContent: "flex-end"
 		},
 		[scope("mobileActions")]: {
 			display: "flex",
 			alignItems: "center",
-			gap: token$2.marginSM,
+			gap: token.marginSM,
 			justifyContent: "flex-end"
 		}
 	}));
@@ -2364,13 +2382,13 @@ const ApiDocumentationBar = ({ apiName, mode, onModeChange, onReset, onSave, has
 						style: {
 							margin: 0,
 							fontWeight: 600,
-							color: token$1.colorTextHeading
+							color: token.colorTextHeading
 						},
 						children: apiName
 					})
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 					className: cx("arrow-icon"),
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.RightOutlined, { style: { fontSize: 24 } })
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.RightOutlined, { style: { fontSize: 24 } })
 				})]
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: cx("mobileActions"),
@@ -2394,15 +2412,22 @@ const ApiDocumentationBar = ({ apiName, mode, onModeChange, onReset, onSave, has
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 				className: cx("title-section"),
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Title$3, {
-					level: 3,
-					style: {
-						margin: 0,
-						fontWeight: 600,
-						whiteSpace: "nowrap",
-						color: token$1.colorTextHeading
-					},
-					children: [apiName, " API Documentation"]
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Tooltip, {
+					title: `${apiName} API Documentation`,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Title$3, {
+						level: 3,
+						style: {
+							margin: 0,
+							fontWeight: 600,
+							whiteSpace: "nowrap",
+							overflow: "hidden",
+							textOverflow: "ellipsis",
+							color: token.colorTextHeading,
+							minWidth: 0,
+							flex: 1
+						},
+						children: [apiName, " API Documentation"]
+					})
 				})
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -2412,14 +2437,14 @@ const ApiDocumentationBar = ({ apiName, mode, onModeChange, onReset, onSave, has
 					onClick: () => onModeChange("edit"),
 					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 						className: cx("switcher-icon"),
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.EditOutlined, {})
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.EditOutlined, {})
 					}), "Edit"]
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 					className: cx("switcher-item", mode === "view" ? "switcher-item-active" : ""),
 					onClick: () => onModeChange("view"),
 					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 						className: cx("switcher-icon"),
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.EyeOutlined, {})
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.EyeOutlined, {})
 					}), "View"]
 				})]
 			}),
@@ -2441,17 +2466,16 @@ const ApiDocumentationBar = ({ apiName, mode, onModeChange, onReset, onSave, has
 		]
 	}));
 };
-
 //#endregion
 //#region src/view/components/ApiPage/components/GeneralSection.tsx
 const { useBreakpoint: useBreakpoint$2 } = antd.Grid;
 const GeneralSection = ({ apiName, authType, version, description, onApiNameChange, onDescriptionChange, collapsed = false, onToggleCollapse, onChangeDetected }) => {
 	const isMobile = !useBreakpoint$2().md;
-	const { wrapSSR, cx, token: token$1 } = useStyle("GeneralSection", (token$2, scope) => ({
+	const { wrapSSR, cx, token } = useStyle("GeneralSection", (token, scope) => ({
 		[scope("root")]: {
 			display: "flex",
 			flexDirection: "column",
-			borderRadius: token$2.borderRadius,
+			borderRadius: token.borderRadius,
 			overflow: "hidden",
 			width: "100%"
 		},
@@ -2459,22 +2483,22 @@ const GeneralSection = ({ apiName, authType, version, description, onApiNameChan
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "space-between",
-			padding: `${token$2.paddingXS}px ${token$2.paddingLG}px`,
-			background: token$2.colorPrimaryBg,
-			borderRadius: `${token$2.borderRadius}px ${token$2.borderRadius}px 0 0`
+			padding: `${token.paddingXS}px ${token.paddingLG}px`,
+			background: token.colorPrimaryBg,
+			borderRadius: `${token.borderRadius}px ${token.borderRadius}px 0 0`
 		},
 		[scope("body")]: {
 			display: "flex",
 			flexDirection: "column",
-			gap: token$2.paddingLG,
-			padding: token$2.paddingLG,
-			paddingBottom: token$2.paddingXXL ?? 48,
-			background: token$2.colorBgElevated,
-			borderRadius: `0 0 ${token$2.borderRadius}px ${token$2.borderRadius}px`
+			gap: token.paddingLG,
+			padding: token.paddingLG,
+			paddingBottom: token.paddingXXL ?? 48,
+			background: token.colorBgElevated,
+			borderRadius: `0 0 ${token.borderRadius}px ${token.borderRadius}px`
 		},
 		[scope("row")]: {
 			display: "flex",
-			gap: token$2.paddingLG,
+			gap: token.paddingLG,
 			width: "100%"
 		},
 		[scope("field")]: {
@@ -2486,22 +2510,22 @@ const GeneralSection = ({ apiName, authType, version, description, onApiNameChan
 		[scope("label")]: {
 			display: "flex",
 			alignItems: "center",
-			gap: token$2.marginXXS,
-			fontSize: token$2.fontSize,
+			gap: token.marginXXS,
+			fontSize: token.fontSize,
 			fontWeight: 400,
-			color: token$2.colorText,
-			paddingBottom: token$2.paddingXS,
+			color: token.colorText,
+			paddingBottom: token.paddingXS,
 			lineHeight: "22px"
 		},
 		[scope("label-required")]: {
-			color: token$2.colorError,
-			fontSize: token$2.fontSize
+			color: token.colorError,
+			fontSize: token.fontSize
 		},
 		[scope("count")]: {
 			alignSelf: "flex-end",
-			fontSize: token$2.fontSize,
-			color: token$2.colorTextDescription,
-			marginTop: token$2.marginXXS
+			fontSize: token.fontSize,
+			color: token.colorTextDescription,
+			marginTop: token.marginXXS
 		}
 	}));
 	return wrapSSR(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -2512,13 +2536,13 @@ const GeneralSection = ({ apiName, authType, version, description, onApiNameChan
 				level: 4,
 				style: {
 					margin: 0,
-					color: token$1.colorTextHeading
+					color: token.colorTextHeading
 				},
 				children: "General"
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 				type: "text",
 				size: "large",
-				icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.UpCircleOutlined, { style: { fontSize: 18 } }),
+				icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.UpCircleOutlined, { style: { fontSize: 18 } }),
 				onClick: onToggleCollapse,
 				style: {
 					transform: collapsed ? "rotate(180deg)" : "rotate(0deg)",
@@ -2528,8 +2552,8 @@ const GeneralSection = ({ apiName, authType, version, description, onApiNameChan
 		}), !collapsed && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: cx("body"),
 			style: isMobile ? {
-				padding: token$1.paddingMD,
-				paddingBottom: token$1.paddingXXL ?? 48
+				padding: token.paddingMD,
+				paddingBottom: token.paddingXXL ?? 48
 			} : void 0,
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: cx("row"),
@@ -2610,73 +2634,101 @@ const GeneralSection = ({ apiName, authType, version, description, onApiNameChan
 		})]
 	}));
 };
-
 //#endregion
-//#region src/assets/trash.svg
-var _mask, _path$2, _path2$1, _path3;
-function _extends$2() {
-	return _extends$2 = Object.assign ? Object.assign.bind() : function(n) {
-		for (var e = 1; e < arguments.length; e++) {
-			var t = arguments[e];
-			for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
-		}
-		return n;
-	}, _extends$2.apply(null, arguments);
-}
-var SvgTrash = function SvgTrash$1(props) {
-	return /* @__PURE__ */ react.createElement("svg", _extends$2({
-		xmlns: "http://www.w3.org/2000/svg",
-		fill: "none",
-		viewBox: "0 0 40 40"
-	}, props), _mask || (_mask = /* @__PURE__ */ react.createElement("mask", {
-		id: "trash_svg__a",
-		fill: "#fff"
-	}, /* @__PURE__ */ react.createElement("path", { d: "M0 8a8 8 0 0 1 8-8h24a8 8 0 0 1 8 8v24a8 8 0 0 1-8 8H8a8 8 0 0 1-8-8z" }))), _path$2 || (_path$2 = /* @__PURE__ */ react.createElement("path", {
-		fill: "#FF4D4F",
-		d: "M8 0v1h24v-2H8zm32 8h-1v24h2V8zm-8 32v-1H8v2h24zM0 32h1V8h-2v24zm8 8v-1a7 7 0 0 1-7-7h-2a9 9 0 0 0 9 9zm32-8h-1a7 7 0 0 1-7 7v2a9 9 0 0 0 9-9zM32 0v1a7 7 0 0 1 7 7h2a9 9 0 0 0-9-9zM8 0v-1a9 9 0 0 0-9 9h2a7 7 0 0 1 7-7z",
-		mask: "url(#trash_svg__a)"
-	})), _path2$1 || (_path2$1 = /* @__PURE__ */ react.createElement("path", {
-		fill: "#FF4D4F",
-		d: "M26.75 15.484a76 76 0 0 0-7.515-.375q-2.227 0-4.455.225l-1.53.15"
-	})), _path3 || (_path3 = /* @__PURE__ */ react.createElement("path", {
-		stroke: "#FF4D4F",
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		strokeWidth: 1.5,
-		d: "M26.75 15.484a76 76 0 0 0-7.515-.375q-2.227 0-4.455.225l-1.53.15M17.375 14.728l.165-.983c.12-.712.21-1.245 1.477-1.245h1.966c1.267 0 1.364.563 1.477 1.252l.165.975M25.137 17.856l-.487 7.552c-.083 1.177-.15 2.092-2.243 2.092h-4.815c-2.092 0-2.16-.915-2.242-2.092l-.488-7.553M18.748 23.375h2.497M18.125 20.375h3.75"
-	})));
-};
-var trash_default = SvgTrash;
-
+//#region src/assets/trash.tsx
+const Trash = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+	viewBox: "0 0 40 40",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("mask", {
+			id: "path-1-inside-1_17984_239034",
+			fill: "white",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M0 8C0 3.58172 3.58172 0 8 0H32C36.4183 0 40 3.58172 40 8V32C40 36.4183 36.4183 40 32 40H8C3.58172 40 0 36.4183 0 32V8Z" })
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M8 0V1H32V0V-1H8V0ZM40 8H39V32H40H41V8H40ZM32 40V39H8V40V41H32V40ZM0 32H1V8H0H-1V32H0ZM8 40V39C4.13401 39 1 35.866 1 32H0H-1C-1 36.9706 3.02944 41 8 41V40ZM40 32H39C39 35.866 35.866 39 32 39V40V41C36.9706 41 41 36.9706 41 32H40ZM32 0V1C35.866 1 39 4.13401 39 8H40H41C41 3.02944 36.9706 -1 32 -1V0ZM8 0V-1C3.02944 -1 -1 3.02944 -1 8H0H1C1 4.13401 4.13401 1 8 1V0Z",
+			fill: "#FF4D4F",
+			mask: "url(#path-1-inside-1_17984_239034)"
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M26.75 15.4844C24.2525 15.2369 21.74 15.1094 19.235 15.1094C17.75 15.1094 16.265 15.1844 14.78 15.3344L13.25 15.4844",
+			fill: "#FF4D4F"
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M26.75 15.4844C24.2525 15.2369 21.74 15.1094 19.235 15.1094C17.75 15.1094 16.265 15.1844 14.78 15.3344L13.25 15.4844",
+			stroke: "#FF4D4F",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M17.375 14.7275L17.54 13.745C17.66 13.0325 17.75 12.5 19.0175 12.5H20.9825C22.25 12.5 22.3475 13.0625 22.46 13.7525L22.625 14.7275",
+			stroke: "#FF4D4F",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M25.1373 17.8555L24.6498 25.408C24.5673 26.5855 24.4998 27.5005 22.4073 27.5005H17.5923C15.4998 27.5005 15.4323 26.5855 15.3498 25.408L14.8623 17.8555",
+			stroke: "#FF4D4F",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M18.7476 23.375H21.2451",
+			stroke: "#FF4D4F",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M18.125 20.375H21.875",
+			stroke: "#FF4D4F",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	]
+});
 //#endregion
-//#region src/assets/info-circle.svg
-var _path$1;
-function _extends$1() {
-	return _extends$1 = Object.assign ? Object.assign.bind() : function(n) {
-		for (var e = 1; e < arguments.length; e++) {
-			var t = arguments[e];
-			for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
-		}
-		return n;
-	}, _extends$1.apply(null, arguments);
-}
-var SvgInfoCircle = function SvgInfoCircle$1(props) {
-	return /* @__PURE__ */ react.createElement("svg", _extends$1({
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 24,
-		height: 24,
-		fill: "none"
-	}, props), _path$1 || (_path$1 = /* @__PURE__ */ react.createElement("path", {
-		stroke: "#000",
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		strokeOpacity: .45,
-		strokeWidth: 1.5,
-		d: "M12 22c5.5 0 10-4.5 10-10S17.5 2 12 2 2 6.5 2 12s4.5 10 10 10M12 8v5M11.995 16h.009"
-	})));
-};
-var info_circle_default = SvgInfoCircle;
-
+//#region src/assets/info-circle.tsx
+const InfoCircle = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+	width: "24",
+	height: "24",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M12 22C17.5 22 22 17.5 22 12C22 6.5 17.5 2 12 2C6.5 2 2 6.5 2 12C2 17.5 6.5 22 12 22Z",
+			stroke: "black",
+			strokeOpacity: "0.45",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M12 8V13",
+			stroke: "black",
+			strokeOpacity: "0.45",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			d: "M11.9946 16H12.0036",
+			stroke: "black",
+			strokeOpacity: "0.45",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	]
+});
 //#endregion
 //#region src/hooks/useDebounce.ts
 function useDebounce(value, delay = 500) {
@@ -2691,7 +2743,6 @@ function useDebounce(value, delay = 500) {
 	}, [value, delay]);
 	return debouncedValue;
 }
-
 //#endregion
 //#region src/view/components/ApiPage/components/AddParameterDrawer.tsx
 const PARAM_IN_OPTIONS = [
@@ -2737,16 +2788,16 @@ const PARAM_TYPE_OPTIONS = [
 const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initialValues }) => {
 	const [form] = antd.Form.useForm();
 	const [messageApi, contextHolder] = antd.message.useMessage();
-	const [confirmModalOpen, setConfirmModalOpen] = (0, react.useState)(false);
-	const [paramName, setParamName] = (0, react.useState)("");
-	const [enumInput, setEnumInput] = (0, react.useState)("");
-	const [enumValues, setEnumValues] = (0, react.useState)([]);
+	const [confirmModalOpen, setConfirmModalOpen] = (0, react$1.useState)(false);
+	const [paramName, setParamName] = (0, react$1.useState)("");
+	const [enumInput, setEnumInput] = (0, react$1.useState)("");
+	const [enumValues, setEnumValues] = (0, react$1.useState)([]);
 	const nameValue = antd.Form.useWatch("name", form);
 	const inValue = antd.Form.useWatch("in", form);
 	const typeValue = antd.Form.useWatch("type", form);
 	const requiredValue = antd.Form.useWatch("required", form);
-	const [hasChanges, setHasChanges] = (0, react.useState)(false);
-	(0, react.useEffect)(() => {
+	const [hasChanges, setHasChanges] = (0, react$1.useState)(false);
+	(0, react$1.useEffect)(() => {
 		if (open) {
 			if (mode === "edit" && initialValues) {
 				form.setFieldsValue({
@@ -2765,11 +2816,11 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 			setHasChanges(false);
 		}
 	}, [open]);
-	const { wrapSSR, cx, token: token$1 } = useStyle("AddParameterDrawer", (token$2, scope) => ({
+	const { wrapSSR, cx, token } = useStyle("AddParameterDrawer", (token, scope) => ({
 		[scope("title")]: {
 			fontSize: 16,
 			fontWeight: 600,
-			color: token$2.colorTextBase,
+			color: token.colorTextBase,
 			lineHeight: "24px",
 			fontFamily: "Cairo SemiBold, Cairo, sans-serif"
 		},
@@ -2780,21 +2831,21 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 			"& .ant-form-item": { marginBottom: 0 }
 		},
 		[scope("label")]: {
-			fontSize: token$2.fontSize,
-			color: token$2.colorText
+			fontSize: token.fontSize,
+			color: token.colorText
 		},
 		[scope("asterisk")]: {
-			color: token$2.colorError,
+			color: token.colorError,
 			marginLeft: 2
 		},
 		[scope("label-optional")]: {
-			color: token$2.colorTextTertiary,
+			color: token.colorTextTertiary,
 			marginLeft: 4,
-			fontSize: token$2.fontSize
+			fontSize: token.fontSize
 		},
 		[scope("label-secondary")]: {
-			fontSize: token$2.fontSize,
-			color: token$2.colorTextSecondary
+			fontSize: token.fontSize,
+			color: token.colorTextSecondary
 		},
 		[scope("switch-row")]: {
 			display: "flex",
@@ -2802,8 +2853,8 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 			gap: 8
 		},
 		[scope("switch-label")]: {
-			fontSize: token$2.fontSize,
-			color: token$2.colorText
+			fontSize: token.fontSize,
+			color: token.colorText
 		},
 		[scope("enum-input-row")]: {
 			display: "flex",
@@ -2818,27 +2869,27 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 			width: 32,
 			height: 32,
 			flexShrink: 0,
-			borderColor: token$2.colorPrimary,
-			color: token$2.colorPrimary,
+			borderColor: token.colorPrimary,
+			color: token.colorPrimary,
 			padding: 0,
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "center",
 			"&:hover": {
-				borderColor: `${token$2.colorPrimary} !important`,
-				color: `${token$2.colorPrimary} !important`
+				borderColor: `${token.colorPrimary} !important`,
+				color: `${token.colorPrimary} !important`
 			}
 		},
 		[scope("enum-list")]: {
 			display: "flex",
 			flexDirection: "column",
-			gap: token$2.marginXS,
-			marginTop: token$2.marginXS
+			gap: token.marginXS,
+			marginTop: token.marginXS
 		},
 		[scope("enum-value-row")]: {
 			display: "flex",
 			alignItems: "center",
-			gap: token$2.marginXS
+			gap: token.marginXS
 		},
 		[scope("enum-value-input-wrap")]: {
 			flex: 1,
@@ -2847,10 +2898,10 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 		[scope("enum-value-input")]: {
 			height: 32,
 			fontSize: 14,
-			color: token$2.colorText,
-			background: token$2.colorBgBase,
-			border: `1px solid ${token$2.colorBorder}`,
-			borderRadius: token$2.borderRadius,
+			color: token.colorText,
+			background: token.colorBgBase,
+			border: `1px solid ${token.colorBorder}`,
+			borderRadius: token.borderRadius,
 			cursor: "default",
 			width: "100%"
 		},
@@ -2862,7 +2913,7 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "center",
-			borderRadius: token$2.borderRadius
+			borderRadius: token.borderRadius
 		},
 		[scope("footer")]: {
 			display: "flex",
@@ -2899,7 +2950,7 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 			fontSize: 16,
 			fontWeight: 400,
 			lineHeight: "24px",
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("modalCloseBtn")]: {
 			position: "absolute",
@@ -2915,12 +2966,12 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 			border: "none",
 			background: "transparent",
 			padding: 0,
-			color: token$2.colorTextTertiary,
+			color: token.colorTextTertiary,
 			fontSize: 16,
 			lineHeight: 1,
 			"&:hover": {
-				color: token$2.colorText,
-				backgroundColor: token$2.colorFillSecondary
+				color: token.colorText,
+				backgroundColor: token.colorFillSecondary
 			}
 		},
 		[scope("modalContent")]: {
@@ -2937,7 +2988,7 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 			fontSize: 14,
 			fontWeight: 400,
 			lineHeight: "22px",
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("modalFooter")]: {
 			display: "flex",
@@ -3022,14 +3073,14 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 			styles: {
 				header: {
 					padding: "16px 24px",
-					borderBottom: `1px solid ${token$1.colorFillSecondary}`,
-					background: token$1.colorBgBase
+					borderBottom: `1px solid ${token.colorFillSecondary}`,
+					background: token.colorBgBase
 				},
 				body: { padding: "24px" },
 				footer: {
 					padding: "24px",
-					background: token$1.colorPrimaryBg,
-					borderTop: `1px solid ${token$1.colorFillSecondary}`
+					background: token.colorPrimaryBg,
+					borderTop: `1px solid ${token.colorFillSecondary}`
 				}
 			},
 			footer: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -3042,7 +3093,7 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 					size: "large",
 					type: "primary",
-					icon: mode === "edit" ? void 0 : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.PlusOutlined, {}),
+					icon: mode === "edit" ? void 0 : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.PlusOutlined, {}),
 					className: cx("footer-btn"),
 					disabled: !isAddEnabled,
 					onClick: handleAddClick,
@@ -3133,7 +3184,7 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Switch, {
 								checked: requiredValue ?? true,
 								onChange: (checked) => form.setFieldValue("required", checked),
-								style: { backgroundColor: requiredValue ?? true ? token$1.colorPrimary : void 0 }
+								style: { backgroundColor: requiredValue ?? true ? token.colorPrimary : void 0 }
 							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 								className: cx("switch-label"),
 								children: "Required?"
@@ -3182,7 +3233,7 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 								})
 							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 								ghost: true,
-								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.PlusOutlined, {}),
+								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.PlusOutlined, {}),
 								className: cx("enum-add-btn"),
 								onClick: handleAddEnumValue,
 								disabled: !enumInput.trim()
@@ -3201,7 +3252,7 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 									danger: true,
 									type: "text",
-									icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(trash_default, {
+									icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Trash, {
 										width: 32,
 										height: 32
 									}),
@@ -3274,9 +3325,9 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 							borderRadius: 8,
 							height: 32,
 							paddingInline: 16,
-							backgroundColor: token$1.colorPrimary,
-							borderColor: token$1.colorPrimary,
-							boxShadow: `0px 2px 0px ${token$1.colorPrimaryBg}`
+							backgroundColor: token.colorPrimary,
+							borderColor: token.colorPrimary,
+							boxShadow: `0px 2px 0px ${token.colorPrimaryBg}`
 						},
 						children: mode === "edit" ? "Yes, Edit" : "Yes, Add"
 					})]
@@ -3285,20 +3336,19 @@ const AddParameterDrawer = ({ open, onClose, onAdd, onEdit, mode = "add", initia
 		})
 	] }));
 };
-
 //#endregion
 //#region src/view/components/ApiPage/components/EndpointsSection.tsx
 const { useBreakpoint: useBreakpoint$1 } = antd.Grid;
 const PAGE_SIZE = 5;
-const getStatusCodeColor = (code, token$1) => {
+const getStatusCodeColor = (code, token) => {
 	const n = parseInt(code, 10);
 	if (n >= 400 && n < 500) return {
-		dot: token$1.colorError,
-		text: token$1.colorError
+		dot: token.colorError,
+		text: token.colorError
 	};
 	return {
-		dot: token$1.colorSuccess,
-		text: token$1.colorText
+		dot: token.colorSuccess,
+		text: token.colorText
 	};
 };
 const buildViewParamRows = (params) => params.map((p, idx) => ({
@@ -3310,28 +3360,28 @@ const buildViewParamRows = (params) => params.map((p, idx) => ({
 	enum: p.enum ?? []
 }));
 const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse, endpointNames, endpointDescs, endpointTags, availableTags, onEndpointNameChange, onEndpointDescChange, onEndpointTagsChange, endpointParams, onAddParameter, onEditParameter, onDeleteParameter, endpointResponseParams, onAddResponseParameter, onEditResponseParameter, onDeleteResponseParameter, mode = "edit" }) => {
-	const [expandedId, setExpandedId] = (0, react.useState)(null);
-	const [paramDrawerOpen, setParamDrawerOpen] = (0, react.useState)(false);
-	const [paramDrawerEndpointId, setParamDrawerEndpointId] = (0, react.useState)(null);
-	const [paramDrawerMode, setParamDrawerMode] = (0, react.useState)("add");
-	const [editParamIdx, setEditParamIdx] = (0, react.useState)(null);
-	const [deleteParamModal, setDeleteParamModal] = (0, react.useState)({
+	const [expandedId, setExpandedId] = (0, react$1.useState)(null);
+	const [paramDrawerOpen, setParamDrawerOpen] = (0, react$1.useState)(false);
+	const [paramDrawerEndpointId, setParamDrawerEndpointId] = (0, react$1.useState)(null);
+	const [paramDrawerMode, setParamDrawerMode] = (0, react$1.useState)("add");
+	const [editParamIdx, setEditParamIdx] = (0, react$1.useState)(null);
+	const [deleteParamModal, setDeleteParamModal] = (0, react$1.useState)({
 		open: false,
 		endpointId: "",
 		idx: -1,
 		name: "",
 		source: "request"
 	});
-	const [openRequestPanels, setOpenRequestPanels] = (0, react.useState)(/* @__PURE__ */ new Set());
-	const [openResponsePanels, setOpenResponsePanels] = (0, react.useState)(/* @__PURE__ */ new Set());
-	const [selectedStatusCodes, setSelectedStatusCodes] = (0, react.useState)({});
-	const [drawerSource, setDrawerSource] = (0, react.useState)("request");
-	const [requestPages, setRequestPages] = (0, react.useState)(/* @__PURE__ */ new Map());
-	const [responsePages, setResponsePages] = (0, react.useState)(/* @__PURE__ */ new Map());
-	const [requestSearches, setRequestSearches] = (0, react.useState)({});
-	const [responseSearches, setResponseSearches] = (0, react.useState)({});
-	const [showRequestSearch, setShowRequestSearch] = (0, react.useState)({});
-	const [showResponseSearch, setShowResponseSearch] = (0, react.useState)({});
+	const [openRequestPanels, setOpenRequestPanels] = (0, react$1.useState)(/* @__PURE__ */ new Set());
+	const [openResponsePanels, setOpenResponsePanels] = (0, react$1.useState)(/* @__PURE__ */ new Set());
+	const [selectedStatusCodes, setSelectedStatusCodes] = (0, react$1.useState)({});
+	const [drawerSource, setDrawerSource] = (0, react$1.useState)("request");
+	const [requestPages, setRequestPages] = (0, react$1.useState)(/* @__PURE__ */ new Map());
+	const [responsePages, setResponsePages] = (0, react$1.useState)(/* @__PURE__ */ new Map());
+	const [requestSearches, setRequestSearches] = (0, react$1.useState)({});
+	const [responseSearches, setResponseSearches] = (0, react$1.useState)({});
+	const [showRequestSearch, setShowRequestSearch] = (0, react$1.useState)({});
+	const [showResponseSearch, setShowResponseSearch] = (0, react$1.useState)({});
 	const debouncedRequestSearches = useDebounce(requestSearches);
 	const debouncedResponseSearches = useDebounce(responseSearches);
 	const { selectNodeByKey } = useNodeSelection();
@@ -3353,11 +3403,11 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			return next;
 		});
 	};
-	const { wrapSSR, cx, token: token$1 } = useStyle("EndpointsSection", (token$2, scope) => ({
+	const { wrapSSR, cx, token } = useStyle("EndpointsSection", (token, scope) => ({
 		[scope("root")]: {
 			display: "flex",
 			flexDirection: "column",
-			borderRadius: token$2.borderRadius,
+			borderRadius: token.borderRadius,
 			overflow: "hidden",
 			width: "100%",
 			flexShrink: 0
@@ -3366,28 +3416,28 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "space-between",
-			padding: `${token$2.paddingXS}px ${token$2.paddingLG}px`,
-			background: token$2.colorPrimaryBg,
-			borderRadius: `${token$2.borderRadius}px ${token$2.borderRadius}px 0 0`
+			padding: `${token.paddingXS}px ${token.paddingLG}px`,
+			background: token.colorPrimaryBg,
+			borderRadius: `${token.borderRadius}px ${token.borderRadius}px 0 0`
 		},
 		[scope("body")]: {
 			display: "flex",
 			flexDirection: "column",
-			gap: token$2.margin,
-			padding: token$2.paddingLG,
-			background: token$2.colorBgElevated,
-			borderRadius: `0 0 ${token$2.borderRadius}px ${token$2.borderRadius}px`
+			gap: token.margin,
+			padding: token.paddingLG,
+			background: token.colorBgElevated,
+			borderRadius: `0 0 ${token.borderRadius}px ${token.borderRadius}px`
 		},
 		[scope("tag-title")]: {
-			fontSize: token$2.fontSize,
+			fontSize: token.fontSize,
 			fontWeight: 600,
-			color: token$2.colorTextSecondary,
-			marginBottom: token$2.marginXS
+			color: token.colorTextSecondary,
+			marginBottom: token.marginXS
 		},
 		[scope("endpoint-row")]: {
 			display: "flex",
 			alignItems: "center",
-			gap: token$2.marginSM,
+			gap: token.marginSM,
 			width: "100%"
 		},
 		[scope("endpoint-card")]: {
@@ -3395,44 +3445,48 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			flex: "1 0 0",
 			alignItems: "center",
 			gap: 14,
-			padding: `${token$2.paddingXS}px ${token$2.padding}px`,
-			background: token$2.colorFillSecondary,
-			borderRadius: token$2.borderRadius,
-			cursor: "pointer"
+			padding: `${token.paddingXS}px ${token.padding}px`,
+			background: token.colorFillSecondary,
+			borderRadius: token.borderRadius,
+			cursor: "pointer",
+			overflow: "hidden"
 		},
 		[scope("endpoint-card-active")]: {
 			background: "transparent",
-			border: `1px solid ${token$2.colorPrimaryBorder}`
+			border: `1px solid ${token.colorPrimaryBorder}`
 		},
 		[scope("method-badge")]: {
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "center",
 			width: 64,
-			padding: `0 ${token$2.paddingXS}px`,
-			borderRadius: token$2.borderRadius,
+			padding: `0 ${token.paddingXS}px`,
+			borderRadius: token.borderRadius,
 			border: "1px solid",
-			fontSize: token$2.fontSize,
+			fontSize: token.fontSize,
 			fontWeight: 400,
 			lineHeight: "22px",
 			whiteSpace: "nowrap",
 			alignSelf: "stretch"
 		},
 		[scope("endpoint-path")]: {
-			fontSize: token$2.fontSizeLG,
+			fontSize: token.fontSizeLG,
 			fontWeight: 600,
-			color: token$2.colorTextHeading,
-			lineHeight: "24px"
+			color: token.colorTextHeading,
+			lineHeight: "24px",
+			overflow: "hidden",
+			textOverflow: "ellipsis",
+			whiteSpace: "nowrap"
 		},
 		[scope("endpoint-form")]: {
 			display: "flex",
 			flexDirection: "column",
-			gap: token$2.paddingLG,
-			padding: token$2.paddingLG,
-			borderLeft: `3px solid ${token$2.colorPrimaryBorder}`,
-			borderRight: `3px solid ${token$2.colorPrimaryBorder}`,
-			borderBottom: `3px solid ${token$2.colorPrimaryBorder}`,
-			borderRadius: `0 0 ${token$2.borderRadius}px ${token$2.borderRadius}px`
+			gap: token.paddingLG,
+			padding: token.paddingLG,
+			borderLeft: `3px solid ${token.colorPrimaryBorder}`,
+			borderRight: `3px solid ${token.colorPrimaryBorder}`,
+			borderBottom: `3px solid ${token.colorPrimaryBorder}`,
+			borderRadius: `0 0 ${token.borderRadius}px ${token.borderRadius}px`
 		},
 		[scope("form-row")]: {
 			display: "flex",
@@ -3448,41 +3502,41 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 		[scope("field-label")]: {
 			display: "flex",
 			alignItems: "center",
-			gap: token$2.marginXXS,
-			fontSize: token$2.fontSize,
+			gap: token.marginXXS,
+			fontSize: token.fontSize,
 			fontWeight: 400,
-			color: token$2.colorText,
-			paddingBottom: token$2.paddingXS,
+			color: token.colorText,
+			paddingBottom: token.paddingXS,
 			lineHeight: "22px"
 		},
-		[scope("label-required")]: { color: token$2.colorError },
-		[scope("label-optional")]: { color: token$2.colorTextDescription },
+		[scope("label-required")]: { color: token.colorError },
+		[scope("label-optional")]: { color: token.colorTextDescription },
 		[scope("section-header")]: {
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "space-between",
-			paddingBottom: token$2.marginXXS,
-			borderBottom: `1px solid ${token$2.colorBorder}`,
+			paddingBottom: token.marginXXS,
+			borderBottom: `1px solid ${token.colorBorder}`,
 			width: "100%"
 		},
 		[scope("section-title")]: {
-			fontSize: token$2.fontSizeLG,
+			fontSize: token.fontSizeLG,
 			fontWeight: 600,
-			color: token$2.colorPrimary,
+			color: token.colorPrimary,
 			lineHeight: "24px"
 		},
 		[scope("param-row")]: {
 			display: "flex",
 			alignItems: "center",
-			gap: token$2.marginXS,
-			padding: `${token$2.marginXXS}px ${token$2.marginSM}px`,
-			border: `1px solid ${token$2.colorBorder}`,
-			borderRadius: token$2.borderRadius,
-			background: token$2.colorBgContainer,
+			gap: token.marginXS,
+			padding: `${token.marginXXS}px ${token.marginSM}px`,
+			border: `1px solid ${token.colorBorder}`,
+			borderRadius: token.borderRadius,
+			background: token.colorBgContainer,
 			width: "100%",
 			cursor: "pointer",
 			userSelect: "none",
-			"&:hover": { background: token$2.colorFillTertiary }
+			"&:hover": { background: token.colorFillTertiary }
 		},
 		[scope("param-row-icon")]: {
 			fontSize: 12,
@@ -3499,7 +3553,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			fontFamily: "Cairo, sans-serif",
 			fontSize: 14,
 			lineHeight: "20px",
-			color: token$2.colorTextLightSolid,
+			color: token.colorTextLightSolid,
 			width: "100%",
 			whiteSpace: "pre",
 			overflowX: "auto",
@@ -3515,7 +3569,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 		},
 		[scope("code-btn")]: {
 			borderColor: "#fff",
-			color: token$2.colorTextLightSolid,
+			color: token.colorTextLightSolid,
 			"&:hover": {
 				borderColor: "#fff !important",
 				color: "#fff !important",
@@ -3533,8 +3587,8 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			justifyContent: "space-between",
 			width: "100%",
 			padding: `12px 24px`,
-			borderBottom: `1px solid ${token$2.colorBorderSecondary}`,
-			background: token$2.colorBgContainer,
+			borderBottom: `1px solid ${token.colorBorderSecondary}`,
+			background: token.colorBgContainer,
 			"&:last-child": { borderBottom: "none" }
 		},
 		[scope("param-details")]: {
@@ -3552,12 +3606,12 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 		[scope("param-detail-label")]: {
 			fontFamily: "Cairo SemiBold, Cairo, sans-serif",
 			fontSize: 16,
-			color: token$2.colorTextSecondary
+			color: token.colorTextSecondary
 		},
 		[scope("param-detail-value")]: {
 			fontFamily: "Cairo, sans-serif",
 			fontSize: 16,
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("param-detail-value--ellipsis")]: {
 			overflow: "hidden",
@@ -3576,13 +3630,13 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			display: "inline-flex",
 			alignItems: "center",
 			verticalAlign: "middle",
-			background: token$2.colorBgContainer,
-			border: `1px solid ${token$2.colorBorder}`,
+			background: token.colorBgContainer,
+			border: `1px solid ${token.colorBorder}`,
 			borderRadius: 6,
 			padding: "1px 8px",
 			fontSize: 12,
 			lineHeight: "20px",
-			color: token$2.colorText,
+			color: token.colorText,
 			fontFamily: "Cairo, sans-serif",
 			margin: 0
 		},
@@ -3594,10 +3648,10 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			width: 20,
 			height: 20,
 			borderRadius: "50%",
-			border: `1px solid ${token$2.colorBorder}`,
+			border: `1px solid ${token.colorBorder}`,
 			background: "white",
 			fontSize: 12,
-			color: token$2.colorText,
+			color: token.colorText,
 			cursor: "default"
 		},
 		[scope("enum-tooltip-list")]: {
@@ -3605,7 +3659,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			padding: "0 0 0 16px",
 			fontSize: 14,
 			lineHeight: "22px",
-			color: token$2.colorTextLightSolid,
+			color: token.colorTextLightSolid,
 			fontFamily: "Cairo, sans-serif"
 		},
 		[scope("status-label")]: {
@@ -3656,7 +3710,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 				alignItems: "center",
 				gap: 8
 			},
-			"& .ant-select-item-option-selected": { background: `${token$2.colorPrimaryBg} !important` }
+			"& .ant-select-item-option-selected": { background: `${token.colorPrimaryBg} !important` }
 		},
 		[scope("param-actions")]: {
 			display: "flex",
@@ -3669,11 +3723,11 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "center",
-			borderColor: token$2.colorPrimary,
-			color: token$2.colorPrimary,
+			borderColor: token.colorPrimary,
+			color: token.colorPrimary,
 			"&:hover": {
-				borderColor: `${token$2.colorPrimary} !important`,
-				color: `${token$2.colorPrimary} !important`
+				borderColor: `${token.colorPrimary} !important`,
+				color: `${token.colorPrimary} !important`
 			}
 		},
 		[scope("param-delete-btn")]: {
@@ -3703,7 +3757,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			fontSize: 16,
 			fontWeight: 400,
 			lineHeight: "24px",
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("deleteModalCloseBtn")]: {
 			position: "absolute",
@@ -3719,12 +3773,12 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			border: "none",
 			background: "transparent",
 			padding: 0,
-			color: token$2.colorTextSecondary,
+			color: token.colorTextSecondary,
 			fontSize: 16,
 			lineHeight: 1,
 			"&:hover": {
-				color: token$2.colorText,
-				backgroundColor: token$2.colorFillSecondary
+				color: token.colorText,
+				backgroundColor: token.colorFillSecondary
 			}
 		},
 		[scope("deleteModalContent")]: {
@@ -3741,7 +3795,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			fontSize: 14,
 			fontWeight: 400,
 			lineHeight: "22px",
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("deleteModalFooter")]: {
 			display: "flex",
@@ -3759,33 +3813,33 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			flexDirection: "column",
 			gap: 16,
 			width: "100%",
-			borderLeft: `3px solid ${token$2.colorPrimaryBorder}`,
-			borderRight: `3px solid ${token$2.colorPrimaryBorder}`,
-			borderBottom: `3px solid ${token$2.colorPrimaryBorder}`,
-			borderRadius: `0 0 ${token$2.borderRadius}px ${token$2.borderRadius}px`,
-			padding: token$2.paddingLG
+			borderLeft: `3px solid ${token.colorPrimaryBorder}`,
+			borderRight: `3px solid ${token.colorPrimaryBorder}`,
+			borderBottom: `3px solid ${token.colorPrimaryBorder}`,
+			borderRadius: `0 0 ${token.borderRadius}px ${token.borderRadius}px`,
+			padding: token.paddingLG
 		},
 		[scope("view-params-card")]: {
-			border: `1px solid ${token$2.colorBorder}`,
-			borderRadius: token$2.borderRadius,
+			border: `1px solid ${token.colorBorder}`,
+			borderRadius: token.borderRadius,
 			display: "flex",
 			flexDirection: "column",
-			gap: token$2.marginSM,
+			gap: token.marginSM,
 			paddingTop: 12,
 			width: "100%",
 			overflow: "hidden",
 			"& .ant-table-thead > tr > th": {
-				background: token$2.colorFillSecondary,
+				background: token.colorFillSecondary,
 				fontWeight: 700,
 				fontSize: 14,
-				padding: `${token$2.paddingXS}px`,
-				paddingInline: `${token$2.paddingXS}px`,
-				borderColor: `${token$2.colorSplit} !important`
+				padding: `${token.paddingXS}px`,
+				paddingInline: `${token.paddingXS}px`,
+				borderColor: `${token.colorSplit} !important`
 			},
 			"& .ant-table-tbody > tr > td": {
-				padding: `${token$2.paddingXS}px`,
-				paddingInline: `${token$2.paddingXS}px`,
-				borderColor: `${token$2.colorBorder} !important`,
+				padding: `${token.paddingXS}px`,
+				paddingInline: `${token.paddingXS}px`,
+				borderColor: `${token.colorBorder} !important`,
 				height: 38
 			},
 			"& .ant-table-container": {
@@ -3804,30 +3858,30 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 		[scope("view-params-title")]: {
 			fontSize: 16,
 			fontWeight: 600,
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("view-status-select-sm")]: { width: 65 },
 		[scope("view-param-name")]: {
 			fontSize: 14,
 			fontWeight: 400,
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("view-param-type")]: {
 			fontFamily: "'Cascadia Code', sans-serif",
 			fontSize: 12,
-			color: token$2.colorTextSecondary,
+			color: token.colorTextSecondary,
 			marginLeft: 4,
 			marginRight: 4
 		},
-		[scope("view-param-required")]: { color: token$2.colorError },
+		[scope("view-param-required")]: { color: token.colorError },
 		[scope("view-param-optional")]: {
-			color: token$2.colorSuccess,
+			color: token.colorSuccess,
 			fontSize: 12,
 			marginLeft: 4
 		},
 		[scope("view-param-desc")]: {
 			fontSize: 12,
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("view-enum-container")]: {
 			display: "inline-flex",
@@ -3836,21 +3890,21 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 			alignItems: "center"
 		},
 		[scope("view-enum-tag")]: {
-			background: token$2.colorFillSecondary,
-			border: `1px solid ${token$2.colorBorder}`,
+			background: token.colorFillSecondary,
+			border: `1px solid ${token.colorBorder}`,
 			borderRadius: 4,
 			padding: "1px 8px",
 			fontSize: 12,
 			lineHeight: "20px",
-			color: token$2.colorText,
+			color: token.colorText,
 			margin: 0,
 			cursor: "default"
 		},
-		[scope("view-row-odd")]: { "& > td": { background: `${token$2.colorBgLayout} !important` } },
-		[scope("view-row-even")]: { "& > td": { background: `${token$2.colorBgContainer} !important` } },
+		[scope("view-row-odd")]: { "& > td": { background: `${token.colorBgLayout} !important` } },
+		[scope("view-row-even")]: { "& > td": { background: `${token.colorBgContainer} !important` } },
 		[scope("empty-wrapper")]: {
-			background: token$2.colorBgElevated,
-			borderRadius: token$2.borderRadius,
+			background: token.colorBgElevated,
+			borderRadius: token.borderRadius,
 			paddingTop: 16,
 			paddingBottom: 16,
 			gap: 8,
@@ -3883,25 +3937,25 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 		[scope("empty-description")]: {
 			fontSize: 14,
 			lineHeight: "22px",
-			color: token$2.colorTextDescription,
+			color: token.colorTextDescription,
 			textAlign: "center",
 			fontWeight: 400
 		},
 		[scope("pagination")]: {
 			display: "flex",
 			justifyContent: "center",
-			marginTop: token$2.marginMD,
+			marginTop: token.marginMD,
 			".ant-pagination-item-active": {
-				backgroundColor: token$2.colorBgContainer,
-				borderColor: token$2.colorPrimary,
-				borderRadius: token$2.borderRadius,
+				backgroundColor: token.colorBgContainer,
+				borderColor: token.colorPrimary,
+				borderRadius: token.borderRadius,
 				display: "flex",
 				alignItems: "center",
 				justifyContent: "center",
 				a: {
-					color: token$2.colorPrimary,
-					fontWeight: token$2.fontWeightStrong,
-					fontSize: token$2.fontSize,
+					color: token.colorPrimary,
+					fontWeight: token.fontWeightStrong,
+					fontSize: token.fontSize,
 					lineHeight: "22px",
 					display: "flex",
 					alignItems: "center",
@@ -3910,18 +3964,18 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 				}
 			},
 			".ant-pagination-item": {
-				borderRadius: token$2.borderRadius,
+				borderRadius: token.borderRadius,
 				minWidth: 32,
 				height: 32,
 				lineHeight: "32px",
 				a: {
-					color: token$2.colorText,
+					color: token.colorText,
 					fontWeight: 400,
-					fontSize: token$2.fontSize
+					fontSize: token.fontSize
 				}
 			},
 			".ant-pagination-prev .ant-pagination-item-link, .ant-pagination-next .ant-pagination-item-link": {
-				borderRadius: token$2.borderRadius,
+				borderRadius: token.borderRadius,
 				width: 32,
 				height: 32,
 				display: "flex",
@@ -4015,13 +4069,13 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 					level: 4,
 					style: {
 						margin: 0,
-						color: token$1.colorTextHeading
+						color: token.colorTextHeading
 					},
 					children: "Endpoints"
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 					type: "text",
 					size: "large",
-					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.UpCircleOutlined, { style: { fontSize: 18 } }),
+					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.UpCircleOutlined, { style: { fontSize: 18 } }),
 					onClick: onToggleCollapse,
 					style: {
 						transform: collapsed ? "rotate(180deg)" : "rotate(0deg)",
@@ -4043,16 +4097,19 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: cx("method-badge"),
 									style: {
-										color: methodColor?.color,
+										color: isExpanded ? "#ffffff" : methodColor?.color,
 										borderColor: methodColor?.color,
-										backgroundColor: methodColor?.bg
+										backgroundColor: isExpanded ? methodColor?.color : "transparent"
 									},
 									children: ep.method
-								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-									className: cx("endpoint-path"),
-									children: ep.path
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Tooltip, {
+									title: ep.path,
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										className: cx("endpoint-path"),
+										children: ep.path
+									})
 								})]
-							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.UpCircleOutlined, {
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.UpCircleOutlined, {
 								onClick: () => handleEndpointClick(ep),
 								style: {
 									fontSize: 16,
@@ -4060,7 +4117,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 									transform: isExpanded ? "rotate(0deg)" : "rotate(180deg)",
 									transition: "transform 0.2s",
 									flexShrink: 0,
-									color: isExpanded ? token$1.colorPrimary : token$1.colorText
+									color: isExpanded ? token.colorPrimary : token.colorText
 								}
 							})]
 						}),
@@ -4187,7 +4244,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 												style: {
 													display: "flex",
 													alignItems: "center",
-													gap: token$1.marginMD
+													gap: token.marginMD
 												},
 												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 													className: cx("section-title"),
@@ -4195,7 +4252,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 												}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 													ghost: true,
 													type: "primary",
-													icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.SearchOutlined, {}),
+													icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.SearchOutlined, {}),
 													size: "large",
 													style: {
 														width: 40,
@@ -4213,7 +4270,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 											}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 												ghost: true,
 												type: "primary",
-												icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.PlusOutlined, {}),
+												icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.PlusOutlined, {}),
 												onClick: () => {
 													setDrawerSource("request");
 													setParamDrawerMode("add");
@@ -4249,7 +4306,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 											}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 												ghost: true,
 												type: "primary",
-												icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.PlusOutlined, {}),
+												icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.PlusOutlined, {}),
 												onClick: () => {
 													setDrawerSource("request");
 													setParamDrawerMode("add");
@@ -4313,7 +4370,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 											const pagedReqParams = allReqParams.slice((reqPage - 1) * PAGE_SIZE, reqPage * PAGE_SIZE);
 											return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 												className: cx("param-list"),
-												style: { marginTop: token$1.margin },
+												style: { marginTop: token.margin },
 												children: pagedReqParams.map((param, i) => {
 													const idx = (reqPage - 1) * PAGE_SIZE + i;
 													return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -4353,16 +4410,16 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 															style: {
 																display: "flex",
 																alignItems: "center",
-																gap: token$1.margin,
-																background: token$1.colorFillTertiary,
-																borderRadius: token$1.borderRadius,
-																padding: `0 ${token$1.marginSM}px`,
+																gap: token.margin,
+																background: token.colorFillTertiary,
+																borderRadius: token.borderRadius,
+																padding: `0 ${token.marginSM}px`,
 																height: 50,
 																flexShrink: 0
 															},
 															children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 																danger: true,
-																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(trash_default, {
+																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Trash, {
 																	width: 32,
 																	height: 32
 																}),
@@ -4383,7 +4440,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																})
 															}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 																ghost: true,
-																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.EditOutlined, {}),
+																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.EditOutlined, {}),
 																className: cx("param-edit-btn"),
 																onClick: () => {
 																	setDrawerSource("request");
@@ -4481,7 +4538,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 															children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 																danger: true,
 																type: "text",
-																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(trash_default, {
+																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Trash, {
 																	height: 32,
 																	width: 32
 																}),
@@ -4499,7 +4556,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																})
 															}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 																ghost: true,
-																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.EditOutlined, {}),
+																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.EditOutlined, {}),
 																className: cx("param-edit-btn"),
 																onClick: () => {
 																	setDrawerSource("request");
@@ -4523,12 +4580,12 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 										})(),
 										/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 											className: cx("param-row"),
-											style: { marginTop: token$1.margin },
+											style: { marginTop: token.margin },
 											onClick: () => toggleRequestPanel(ep.id),
-											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.DownOutlined, { className: cx("param-row-icon", openRequestPanels.has(ep.id) ? "param-row-icon--open" : "") }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-												style: { fontSize: token$1.fontSize },
+											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.DownOutlined, { className: cx("param-row-icon", openRequestPanels.has(ep.id) ? "param-row-icon--open" : "") }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+												style: { fontSize: token.fontSize },
 												children: ["Request ", /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-													style: { color: token$1.colorError },
+													style: { color: token.colorError },
 													children: "*"
 												})]
 											})]
@@ -4572,7 +4629,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 												style: {
 													display: "flex",
 													alignItems: "center",
-													gap: token$1.marginMD
+													gap: token.marginMD
 												},
 												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 													className: cx("section-title"),
@@ -4580,7 +4637,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 												}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 													ghost: true,
 													type: "primary",
-													icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.SearchOutlined, {}),
+													icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.SearchOutlined, {}),
 													size: "large",
 													style: {
 														width: 40,
@@ -4598,7 +4655,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 											}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 												ghost: true,
 												type: "primary",
-												icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.PlusOutlined, {}),
+												icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.PlusOutlined, {}),
 												onClick: () => {
 													setDrawerSource("response");
 													setParamDrawerMode("add");
@@ -4674,7 +4731,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																				style: { color: text },
 																				children: code
 																			}),
-																			isSelected && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.CheckCircleOutlined, {
+																			isSelected && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.CheckCircleOutlined, {
 																				className: cx("status-checkmark"),
 																				style: { color: text }
 																			})
@@ -4688,7 +4745,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 											}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 												ghost: true,
 												type: "primary",
-												icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.PlusOutlined, {}),
+												icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.PlusOutlined, {}),
 												onClick: () => {
 													setDrawerSource("response");
 													setParamDrawerMode("add");
@@ -4752,7 +4809,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 											const pagedResParams = allResParams.slice((resPage - 1) * PAGE_SIZE, resPage * PAGE_SIZE);
 											return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 												className: cx("param-list"),
-												style: { marginTop: token$1.margin },
+												style: { marginTop: token.margin },
 												children: pagedResParams.map((param, i) => {
 													const idx = (resPage - 1) * PAGE_SIZE + i;
 													return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -4792,16 +4849,16 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 															style: {
 																display: "flex",
 																alignItems: "center",
-																gap: token$1.margin,
-																background: token$1.colorFillTertiary,
-																borderRadius: token$1.borderRadius,
-																padding: `0 ${token$1.marginSM}px`,
+																gap: token.margin,
+																background: token.colorFillTertiary,
+																borderRadius: token.borderRadius,
+																padding: `0 ${token.marginSM}px`,
 																height: 50,
 																flexShrink: 0
 															},
 															children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 																danger: true,
-																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(trash_default, {
+																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Trash, {
 																	width: 32,
 																	height: 32
 																}),
@@ -4822,7 +4879,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 																})
 															}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 																ghost: true,
-																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.EditOutlined, {}),
+																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.EditOutlined, {}),
 																className: cx("param-edit-btn"),
 																onClick: () => {
 																	setDrawerSource("response");
@@ -4919,7 +4976,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 															className: cx("param-actions"),
 															children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 																ghost: true,
-																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.EditOutlined, {}),
+																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.EditOutlined, {}),
 																className: cx("param-edit-btn"),
 																onClick: () => {
 																	setDrawerSource("response");
@@ -4931,7 +4988,7 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 															}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 																danger: true,
 																type: "text",
-																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(trash_default, {
+																icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Trash, {
 																	height: 18,
 																	width: 18
 																}),
@@ -4962,18 +5019,18 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 										})(),
 										/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 											className: cx("param-row"),
-											style: { marginTop: token$1.margin },
+											style: { marginTop: token.margin },
 											onClick: () => toggleResponsePanel(ep.id),
 											children: [
-												/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.DownOutlined, { className: cx("param-row-icon", openResponsePanels.has(ep.id) ? "param-row-icon--open" : "") }),
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.DownOutlined, { className: cx("param-row-icon", openResponsePanels.has(ep.id) ? "param-row-icon--open" : "") }),
 												/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-													style: { fontSize: token$1.fontSize },
+													style: { fontSize: token.fontSize },
 													children: ["Response ", /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-														style: { color: token$1.colorError },
+														style: { color: token.colorError },
 														children: "*"
 													})]
 												}),
-												/* @__PURE__ */ (0, react_jsx_runtime.jsx)(info_circle_default, { style: {
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)(InfoCircle, { style: {
 													width: 24,
 													height: 24
 												} })
@@ -5155,11 +5212,10 @@ const EndpointsSection = ({ endpointsByTag, collapsed = false, onToggleCollapse,
 		]
 	}));
 };
-
 //#endregion
 //#region src/view/components/ApiPage/components/UnsavedChangesBanner.tsx
 const UnsavedChangesBanner = ({ onClose }) => {
-	const { wrapSSR, cx, token: token$1 } = useStyle("UnsavedChangesBanner", (token$2, scope) => ({
+	const { wrapSSR, cx } = useStyle("UnsavedChangesBanner", (token, scope) => ({
 		[scope("root")]: {
 			position: "sticky",
 			top: 0,
@@ -5169,7 +5225,7 @@ const UnsavedChangesBanner = ({ onClose }) => {
 		},
 		[scope("alert")]: {
 			padding: "8px 12px",
-			fontSize: token$2.fontSize,
+			fontSize: token.fontSize,
 			fontWeight: 400,
 			borderRadius: 0
 		}
@@ -5182,22 +5238,21 @@ const UnsavedChangesBanner = ({ onClose }) => {
 			message: "There are changes you made may not be saved",
 			closable: true,
 			onClose,
-			icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.ExclamationCircleFilled, {}),
+			icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.ExclamationCircleFilled, {}),
 			showIcon: true
 		})
 	}));
 };
-
 //#endregion
 //#region src/view/components/ApiPage/components/TagsSection.tsx
 const { useBreakpoint } = antd.Grid;
 const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEditTag, onDeleteTag }) => {
 	const isMobile = !useBreakpoint().md;
-	const { wrapSSR, cx, token: token$1 } = useStyle("TagsSection", (token$2, scope) => ({
+	const { wrapSSR, cx, token } = useStyle("TagsSection", (token, scope) => ({
 		[scope("root")]: {
 			display: "flex",
 			flexDirection: "column",
-			borderRadius: token$2.borderRadius,
+			borderRadius: token.borderRadius,
 			overflow: "hidden",
 			width: "100%",
 			flexShrink: 0
@@ -5206,36 +5261,37 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "space-between",
-			padding: `${token$2.paddingXS}px ${token$2.paddingLG}px`,
-			background: token$2.colorPrimaryBg,
-			borderRadius: `${token$2.borderRadius}px ${token$2.borderRadius}px 0 0`
+			padding: `${token.paddingXS}px ${token.paddingLG}px`,
+			background: token.colorPrimaryBg,
+			borderRadius: `${token.borderRadius}px ${token.borderRadius}px 0 0`
 		},
 		[scope("head-actions")]: {
 			display: "flex",
 			alignItems: "center",
-			gap: token$2.margin
+			gap: token.margin
 		},
 		[scope("body")]: {
 			display: "flex",
 			flexDirection: "column",
 			gap: 0,
-			padding: token$2.paddingLG,
-			background: token$2.colorBgElevated,
-			borderRadius: `0 0 ${token$2.borderRadius}px ${token$2.borderRadius}px`
+			padding: token.paddingLG,
+			background: token.colorBgElevated,
+			borderRadius: `0 0 ${token.borderRadius}px ${token.borderRadius}px`
 		},
 		[scope("tag-row")]: {
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "space-between",
 			height: 50,
-			paddingBottom: token$2.margin,
-			paddingRight: token$2.paddingLG,
-			borderBottom: `1px solid ${token$2.colorBorder}`,
+			paddingTop: token.controlHeightLG,
+			paddingBottom: token.controlHeightLG,
+			paddingRight: token.paddingLG,
+			borderBottom: `1px solid ${token.colorBorder}`,
 			width: "100%"
 		},
 		[scope("tag-row-last")]: {
 			borderBottom: "none",
-			paddingBottom: 0
+			paddingBottom: token.marginLG
 		},
 		[scope("tag-info")]: {
 			display: "flex",
@@ -5247,26 +5303,26 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 		[scope("tag-col")]: {
 			display: "flex",
 			flexDirection: "column",
-			gap: token$2.marginXXS
+			gap: token.marginXXS
 		},
 		[scope("col-label")]: {
-			fontSize: token$2.fontSizeLG,
+			fontSize: token.fontSizeLG,
 			fontWeight: 600,
-			color: token$2.colorTextTertiary,
+			color: token.colorTextTertiary,
 			lineHeight: "24px",
 			whiteSpace: "nowrap"
 		},
 		[scope("col-value")]: {
-			fontSize: token$2.fontSizeLG,
+			fontSize: token.fontSizeLG,
 			fontWeight: 400,
-			color: token$2.colorText,
+			color: token.colorText,
 			lineHeight: "24px",
 			whiteSpace: "nowrap"
 		},
 		[scope("col-value-link")]: {
-			fontSize: token$2.fontSize,
+			fontSize: token.fontSize,
 			fontWeight: 400,
-			color: token$2.colorPrimary,
+			color: token.colorPrimary,
 			lineHeight: "22px",
 			textDecoration: "underline",
 			whiteSpace: "nowrap"
@@ -5274,13 +5330,13 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 		[scope("tag-actions")]: {
 			display: "flex",
 			alignItems: "center",
-			gap: token$2.margin
+			gap: token.margin
 		},
 		[scope("btn-delete")]: {
 			width: 40,
 			height: 40,
-			border: `1px solid ${token$2.colorError}`,
-			borderRadius: token$2.borderRadius,
+			border: `1px solid ${token.colorError}`,
+			borderRadius: token.borderRadius,
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "center"
@@ -5288,9 +5344,9 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 		[scope("btn-edit")]: {
 			width: 40,
 			height: 40,
-			border: `1px solid ${token$2.colorBorder}`,
-			borderRadius: token$2.borderRadius,
-			background: token$2.colorBgContainer,
+			border: `1px solid ${token.colorBorder}`,
+			borderRadius: token.borderRadius,
+			background: token.colorBgContainer,
 			boxShadow: "0px 2px 0px 0px rgba(0,0,0,0.02)",
 			display: "flex",
 			alignItems: "center",
@@ -5302,8 +5358,8 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 			alignItems: "flex-start",
 			justifyContent: "space-between",
 			gap: 8,
-			paddingBottom: token$2.margin,
-			borderBottom: `1px solid ${token$2.colorBorder}`,
+			paddingBottom: token.margin,
+			borderBottom: `1px solid ${token.colorBorder}`,
 			width: "100%",
 			minHeight: 50
 		},
@@ -5331,9 +5387,9 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 			display: "flex",
 			flexDirection: "column",
 			gap: 0,
-			padding: token$2.paddingMD,
-			background: token$2.colorBgElevated,
-			borderRadius: `0 0 ${token$2.borderRadius}px ${token$2.borderRadius}px`,
+			padding: token.paddingMD,
+			background: token.colorBgElevated,
+			borderRadius: `0 0 ${token.borderRadius}px ${token.borderRadius}px`,
 			overflowX: "auto"
 		}
 	}));
@@ -5345,7 +5401,7 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 				level: 4,
 				style: {
 					margin: 0,
-					color: token$1.colorTextHeading
+					color: token.colorTextHeading
 				},
 				children: "Tags"
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -5353,14 +5409,14 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 					ghost: true,
 					type: "primary",
-					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.PlusOutlined, {}),
+					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.PlusOutlined, {}),
 					onClick: onAddTag,
-					style: { borderRadius: token$1.borderRadius },
+					style: { borderRadius: token.borderRadius },
 					children: "Add Tag"
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 					type: "text",
 					size: "large",
-					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.UpCircleOutlined, { style: { fontSize: 18 } }),
+					icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.UpCircleOutlined, { style: { fontSize: 18 } }),
 					onClick: onToggleCollapse,
 					style: {
 						transform: collapsed ? "rotate(180deg)" : "rotate(0deg)",
@@ -5380,14 +5436,14 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 								className: cx("col-label"),
 								style: {
-									fontSize: token$1.fontSize,
+									fontSize: token.fontSize,
 									lineHeight: "20px"
 								},
 								children: "Tag Name:"
 							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 								className: cx("col-value"),
 								style: {
-									fontSize: token$1.fontSize,
+									fontSize: token.fontSize,
 									lineHeight: "20px",
 									overflow: "hidden",
 									textOverflow: "ellipsis",
@@ -5400,7 +5456,7 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 								className: cx("col-label"),
 								style: {
-									fontSize: token$1.fontSize,
+									fontSize: token.fontSize,
 									lineHeight: "20px"
 								},
 								children: "Description:"
@@ -5409,7 +5465,7 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: cx("col-value"),
 									style: {
-										fontSize: token$1.fontSize,
+										fontSize: token.fontSize,
 										lineHeight: "20px",
 										overflow: "hidden",
 										textOverflow: "ellipsis",
@@ -5432,7 +5488,7 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 								danger: true,
 								type: "text",
-								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(trash_default, {
+								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Trash, {
 									width: 32,
 									height: 32
 								}),
@@ -5448,7 +5504,7 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Tooltip, {
 							title: tag.isDefault ? "The default tag cannot be deleted or edited" : "",
 							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
-								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.EditOutlined, { style: { fontSize: 18 } }),
+								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.EditOutlined, { style: { fontSize: 18 } }),
 								disabled: tag.isDefault,
 								onClick: () => !tag.isDefault && onEditTag?.(tag),
 								style: {
@@ -5539,7 +5595,7 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 								danger: true,
 								type: "text",
-								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(trash_default, {
+								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Trash, {
 									width: 32,
 									height: 32
 								}),
@@ -5555,7 +5611,7 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Tooltip, {
 							title: tag.isDefault ? "The default tag cannot be deleted or edited" : "",
 							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
-								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.EditOutlined, { style: { fontSize: 18 } }),
+								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.EditOutlined, { style: { fontSize: 18 } }),
 								disabled: tag.isDefault,
 								onClick: () => !tag.isDefault && onEditTag?.(tag),
 								style: {
@@ -5572,7 +5628,6 @@ const TagsSection = ({ tags, collapsed = false, onToggleCollapse, onAddTag, onEd
 		}))]
 	}));
 };
-
 //#endregion
 //#region src/view/components/ApiPage/components/AddTagDrawer.tsx
 const TAG_NAME_REGEX = /^[A-Za-z0-9_-]+$/;
@@ -5581,16 +5636,16 @@ const EXT_DESC_REGEX = /^[A-Za-z0-9_-]+$/;
 const AddTagDrawer = ({ open, onClose, mode, initialValues, onAddTag, onEditTag }) => {
 	const [form] = antd.Form.useForm();
 	const [messageApi, contextHolder] = antd.message.useMessage();
-	const [confirmModalOpen, setConfirmModalOpen] = (0, react.useState)(false);
-	const [tagName, setTagName] = (0, react.useState)("");
+	const [confirmModalOpen, setConfirmModalOpen] = (0, react$1.useState)(false);
+	const [tagName, setTagName] = (0, react$1.useState)("");
 	const tagNameValue = antd.Form.useWatch("name", form);
 	const extDocsDesc = antd.Form.useWatch("externalDocsDescription", form);
 	const extDocsLink = antd.Form.useWatch("externalDocsLink", form);
-	const { wrapSSR, cx, token: token$1 } = useStyle("AddTagDrawer", (token$2, scope) => ({
+	const { wrapSSR, cx, token } = useStyle("AddTagDrawer", (token, scope) => ({
 		[scope("title")]: {
 			fontSize: 16,
 			fontWeight: 600,
-			color: token$2.colorTextBase,
+			color: token.colorTextBase,
 			lineHeight: "24px",
 			fontFamily: "Cairo SemiBold, Cairo, sans-serif"
 		},
@@ -5601,25 +5656,25 @@ const AddTagDrawer = ({ open, onClose, mode, initialValues, onAddTag, onEditTag
 			"& .ant-form-item": { marginBottom: 0 }
 		},
 		[scope("label")]: {
-			fontSize: token$2.fontSize,
-			color: token$2.colorText
+			fontSize: token.fontSize,
+			color: token.colorText
 		},
 		[scope("asterisk")]: {
-			color: token$2.colorError,
+			color: token.colorError,
 			marginLeft: 2
 		},
 		[scope("label-optional")]: {
-			color: token$2.colorTextTertiary,
+			color: token.colorTextTertiary,
 			marginLeft: 4,
-			fontSize: token$2.fontSize
+			fontSize: token.fontSize
 		},
 		[scope("label-secondary")]: {
-			fontSize: token$2.fontSize,
-			color: token$2.colorTextSecondary
+			fontSize: token.fontSize,
+			color: token.colorTextSecondary
 		},
 		[scope("label-disabled")]: {
-			fontSize: token$2.fontSize,
-			color: token$2.colorTextDisabled
+			fontSize: token.fontSize,
+			color: token.colorTextDisabled
 		},
 		[scope("footer")]: {
 			display: "flex",
@@ -5656,7 +5711,7 @@ const AddTagDrawer = ({ open, onClose, mode, initialValues, onAddTag, onEditTag
 			fontSize: 16,
 			fontWeight: 400,
 			lineHeight: "24px",
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("modalCloseBtn")]: {
 			position: "absolute",
@@ -5672,12 +5727,12 @@ const AddTagDrawer = ({ open, onClose, mode, initialValues, onAddTag, onEditTag
 			border: "none",
 			background: "transparent",
 			padding: 0,
-			color: token$2.colorTextTertiary,
+			color: token.colorTextTertiary,
 			fontSize: 16,
 			lineHeight: 1,
 			"&:hover": {
-				color: token$2.colorText,
-				backgroundColor: token$2.colorFillSecondary
+				color: token.colorText,
+				backgroundColor: token.colorFillSecondary
 			}
 		},
 		[scope("modalContent")]: {
@@ -5694,7 +5749,7 @@ const AddTagDrawer = ({ open, onClose, mode, initialValues, onAddTag, onEditTag
 			fontSize: 14,
 			fontWeight: 400,
 			lineHeight: "22px",
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("modalFooter")]: {
 			display: "flex",
@@ -5710,18 +5765,18 @@ const AddTagDrawer = ({ open, onClose, mode, initialValues, onAddTag, onEditTag
 	}));
 	const isLinkEnabled = Boolean(extDocsDesc?.trim());
 	const isAddEnabled = !!(tagNameValue && TAG_NAME_REGEX.test(tagNameValue));
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (open && mode === "edit" && initialValues) form.setFieldsValue(initialValues);
 		if (!open) form.resetFields();
 	}, [open]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (!extDocsDesc?.trim()) form.setFields([{
 			name: "externalDocsLink",
 			value: void 0,
 			errors: []
 		}]);
 	}, [extDocsDesc]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (extDocsDesc?.trim()) form.validateFields(["externalDocsLink"]).catch(() => {});
 	}, [extDocsLink, extDocsDesc]);
 	const handleClose = () => {
@@ -5771,14 +5826,14 @@ const AddTagDrawer = ({ open, onClose, mode, initialValues, onAddTag, onEditTag
 			styles: {
 				header: {
 					padding: "16px 24px",
-					borderBottom: `1px solid ${token$1.colorFillSecondary}`,
-					background: token$1.colorBgBase
+					borderBottom: `1px solid ${token.colorFillSecondary}`,
+					background: token.colorBgBase
 				},
 				body: { padding: "24px" },
 				footer: {
 					padding: "24px",
-					background: token$1.colorPrimaryBg,
-					borderTop: `1px solid ${token$1.colorFillSecondary}`
+					background: token.colorPrimaryBg,
+					borderTop: `1px solid ${token.colorFillSecondary}`
 				}
 			},
 			footer: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -5791,7 +5846,7 @@ const AddTagDrawer = ({ open, onClose, mode, initialValues, onAddTag, onEditTag
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Button, {
 					size: "large",
 					type: "primary",
-					icon: mode === "add" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.PlusOutlined, {}) : void 0,
+					icon: mode === "add" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.PlusOutlined, {}) : void 0,
 					className: cx("footer-btn"),
 					disabled: !isAddEnabled,
 					onClick: handleAddTagClick,
@@ -5979,9 +6034,9 @@ const AddTagDrawer = ({ open, onClose, mode, initialValues, onAddTag, onEditTag
 							borderRadius: 8,
 							height: 32,
 							paddingInline: 16,
-							backgroundColor: token$1.colorPrimary,
-							borderColor: token$1.colorPrimary,
-							boxShadow: `0px 2px 0px ${token$1.colorPrimaryBg}`
+							backgroundColor: token.colorPrimary,
+							borderColor: token.colorPrimary,
+							boxShadow: `0px 2px 0px ${token.colorPrimaryBg}`
 						},
 						children: confirmBtnLabel
 					})]
@@ -5990,7 +6045,6 @@ const AddTagDrawer = ({ open, onClose, mode, initialValues, onAddTag, onEditTag
 		})
 	] }));
 };
-
 //#endregion
 //#region src/view/helper/mutate.ts
 const resolveSchema = (schema, components) => {
@@ -6075,44 +6129,32 @@ const transformOpenApiToDocs = (api) => {
 		curl
 	};
 };
-
 //#endregion
-//#region src/assets/copy.svg
-var _path, _path2;
-function _extends() {
-	return _extends = Object.assign ? Object.assign.bind() : function(n) {
-		for (var e = 1; e < arguments.length; e++) {
-			var t = arguments[e];
-			for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
-		}
-		return n;
-	}, _extends.apply(null, arguments);
-}
-var SvgCopy = function SvgCopy$1(props) {
-	return /* @__PURE__ */ react.createElement("svg", _extends({
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 16,
-		height: 16,
-		fill: "none"
-	}, props), _path || (_path = /* @__PURE__ */ react.createElement("path", {
-		fill: "currentcolor",
-		d: "M7.4 15.167H4.6c-2.607 0-3.767-1.16-3.767-3.766V8.6c0-2.607 1.16-3.767 3.767-3.767h2.8c2.606 0 3.766 1.16 3.766 3.767v2.8c0 2.606-1.16 3.766-3.766 3.766M4.6 5.834c-2.067 0-2.767.7-2.767 2.767v2.8c0 2.066.7 2.766 2.767 2.766h2.8c2.066 0 2.766-.7 2.766-2.766V8.6c0-2.067-.7-2.767-2.766-2.767z"
-	})), _path2 || (_path2 = /* @__PURE__ */ react.createElement("path", {
-		fill: "currentcolor",
-		d: "M11.4 11.167h-.734a.504.504 0 0 1-.5-.5V8.601c0-2.067-.7-2.767-2.766-2.767H5.333a.504.504 0 0 1-.5-.5v-.733C4.833 1.994 5.993.834 8.6.834h2.8c2.606 0 3.766 1.16 3.766 3.767v2.8c0 2.606-1.16 3.766-3.766 3.766m-.234-1h.234c2.066 0 2.766-.7 2.766-2.766V4.6c0-2.067-.7-2.767-2.766-2.767H8.6c-2.067 0-2.767.7-2.767 2.767v.233H7.4c2.606 0 3.766 1.16 3.766 3.767z"
-	})));
-};
-var copy_default = SvgCopy;
-
+//#region src/assets/copy.tsx
+const Copy = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+	width: "16",
+	height: "16",
+	viewBox: "0 0 16 16",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	...props,
+	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M7.39967 15.1673H4.59967C1.99301 15.1673 0.833008 14.0073 0.833008 11.4007V8.60065C0.833008 5.99398 1.99301 4.83398 4.59967 4.83398H7.39967C10.0063 4.83398 11.1663 5.99398 11.1663 8.60065V11.4007C11.1663 14.0073 10.0063 15.1673 7.39967 15.1673ZM4.59967 5.83398C2.53301 5.83398 1.83301 6.53398 1.83301 8.60065V11.4007C1.83301 13.4673 2.53301 14.1673 4.59967 14.1673H7.39967C9.46634 14.1673 10.1663 13.4673 10.1663 11.4007V8.60065C10.1663 6.53398 9.46634 5.83398 7.39967 5.83398H4.59967Z",
+		fill: "currentcolor"
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M11.3997 11.1673H10.6663C10.393 11.1673 10.1663 10.9407 10.1663 10.6673V8.60065C10.1663 6.53398 9.46634 5.83398 7.39967 5.83398H5.33301C5.05967 5.83398 4.83301 5.60732 4.83301 5.33398V4.60065C4.83301 1.99398 5.99301 0.833984 8.59967 0.833984H11.3997C14.0063 0.833984 15.1663 1.99398 15.1663 4.60065V7.40065C15.1663 10.0073 14.0063 11.1673 11.3997 11.1673ZM11.1663 10.1673H11.3997C13.4663 10.1673 14.1663 9.46732 14.1663 7.40065V4.60065C14.1663 2.53398 13.4663 1.83398 11.3997 1.83398H8.59967C6.53301 1.83398 5.83301 2.53398 5.83301 4.60065V4.83398H7.39967C10.0063 4.83398 11.1663 5.99398 11.1663 8.60065V10.1673Z",
+		fill: "currentcolor"
+	})]
+});
 //#endregion
 //#region src/view/components/EndpointPage/Codebox/Codebox.tsx
-react_syntax_highlighter.Light.registerLanguage("json", react_syntax_highlighter_dist_esm_languages_hljs_json.default);
+react_syntax_highlighter.Light.registerLanguage("json", react_syntax_highlighter_dist_esm_languages_hljs_json_js.default);
 const Codebox = ({ code, language, wrapLongLines }) => {
-	const [appTheme] = (0, react.useState)("DARK");
-	const { token: token$1, theme: themeConfig } = antd.theme.useToken();
-	const bodyBg = themeConfig.id == 1 ? token$1.colorBgContainer : "#1d2856";
-	const { cx } = useStyle("codeBox", (token$2, scope) => ({ [scope("codebox")]: {
-		borderRadius: token$2.borderRadius,
+	const [appTheme] = (0, react$1.useState)("DARK");
+	const { token, theme: themeConfig } = antd.theme.useToken();
+	const bodyBg = themeConfig.id == 1 ? token.colorBgContainer : "#1d2856";
+	const { cx } = useStyle("codeBox", (token, scope) => ({ [scope("codebox")]: {
+		borderRadius: token.borderRadius,
 		height: "100%",
 		maxHeight: "100%",
 		overflow: "auto",
@@ -6122,7 +6164,7 @@ const Codebox = ({ code, language, wrapLongLines }) => {
 		className: cx("codebox"),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_syntax_highlighter.Light, {
 			language: language || "json",
-			style: appTheme === "LIGHT" ? react_syntax_highlighter_dist_esm_styles_hljs.stackoverflowLight : react_syntax_highlighter_dist_esm_styles_hljs.stackoverflowDark,
+			style: appTheme === "LIGHT" ? react_syntax_highlighter_dist_esm_styles_hljs_index_js.stackoverflowLight : react_syntax_highlighter_dist_esm_styles_hljs_index_js.stackoverflowDark,
 			showLineNumbers: true,
 			wrapLines: true,
 			wrapLongLines,
@@ -6139,13 +6181,11 @@ const Codebox = ({ code, language, wrapLongLines }) => {
 		})
 	});
 };
-var Codebox_default = Codebox;
-
 //#endregion
 //#region src/view/components/CodeboxSidebar.tsx
 function CodeboxSidebar() {
-	const { selectedEndpoint, selectedApi, activeRequestTab, selectedStatusCode, statusCodeOptions, setSelectedStatusCode } = store_default(({ view }) => view);
-	const httpStatusOptions = (0, react.useMemo)(() => statusCodeOptions.map((code) => ({
+	const { selectedEndpoint, selectedApi, activeRequestTab, selectedStatusCode, statusCodeOptions, setSelectedStatusCode } = useStore(({ view }) => view);
+	const httpStatusOptions = (0, react$1.useMemo)(() => statusCodeOptions.map((code) => ({
 		value: code,
 		label: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 			style: {
@@ -6164,7 +6204,7 @@ function CodeboxSidebar() {
 			} }), code]
 		})
 	})), [statusCodeOptions]);
-	const [curlTooltip, setCurlTooltip] = (0, react.useState)("Copy Request");
+	const [curlTooltip, setCurlTooltip] = (0, react$1.useState)("Copy Request");
 	const curlCommand = (() => {
 		if (!selectedEndpoint || !Array.isArray(selectedApi?.curl)) return "";
 		return selectedApi.curl.find((c) => c.path === selectedEndpoint.path && c.method?.toUpperCase() === selectedEndpoint.method.toUpperCase())?.curlCommand ?? "";
@@ -6318,7 +6358,7 @@ function CodeboxSidebar() {
 							setCurlTooltip("Copied!");
 							setTimeout(() => setCurlTooltip("Copy cURL"), 1500);
 						},
-						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(copy_default, { style: { color: "white" } })
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Copy, { style: { color: "white" } })
 					})
 				})]
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -6348,47 +6388,45 @@ function CodeboxSidebar() {
 					open: httpStatusOptions.length === 1 ? false : void 0,
 					suffixIcon: httpStatusOptions.length > 1 ? void 0 : false
 				})]
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Codebox_default, { code: JSON.stringify(selectedEndpoint?.responses[selectedStatusCode], null, 2) || "" })]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Codebox, { code: JSON.stringify(selectedEndpoint?.responses[selectedStatusCode], null, 2) || "" })]
 		})]
 	});
 }
-var CodeboxSidebar_default = CodeboxSidebar;
-
 //#endregion
 //#region src/view/layout.tsx
 const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onSave }) => {
-	const [searchValue, setSearchValue] = (0, react.useState)("");
-	const [mode, setMode] = (0, react.useState)("edit");
-	const [hasChanges, setHasChanges] = (0, react.useState)(false);
-	const [bannerVisible, setBannerVisible] = (0, react.useState)(false);
-	const [resetKey, setResetKey] = (0, react.useState)(0);
-	const [generalCollapsed, setGeneralCollapsed] = (0, react.useState)(false);
-	const [tagsCollapsed, setTagsCollapsed] = (0, react.useState)(false);
-	const [endpointsCollapsed, setEndpointsCollapsed] = (0, react.useState)(false);
-	const [localApiName, setLocalApiName] = (0, react.useState)("");
-	const [localDescription, setLocalDescription] = (0, react.useState)("");
-	const [selectedUrl, setSelectedUrl] = (0, react.useState)("");
-	const [endpointNames, setEndpointNames] = (0, react.useState)({});
-	const [endpointDescs, setEndpointDescs] = (0, react.useState)({});
-	const [endpointTags, setEndpointTags] = (0, react.useState)({});
-	const [endpointParams, setEndpointParams] = (0, react.useState)({});
-	const [endpointResponseParams, setEndpointResponseParams] = (0, react.useState)({});
-	const [tagDrawerState, setTagDrawerState] = (0, react.useState)({
+	const [searchValue, setSearchValue] = (0, react$1.useState)("");
+	const [mode, setMode] = (0, react$1.useState)("edit");
+	const [hasChanges, setHasChanges] = (0, react$1.useState)(false);
+	const [bannerVisible, setBannerVisible] = (0, react$1.useState)(false);
+	const [resetKey, setResetKey] = (0, react$1.useState)(0);
+	const [generalCollapsed, setGeneralCollapsed] = (0, react$1.useState)(false);
+	const [tagsCollapsed, setTagsCollapsed] = (0, react$1.useState)(false);
+	const [endpointsCollapsed, setEndpointsCollapsed] = (0, react$1.useState)(false);
+	const [localApiName, setLocalApiName] = (0, react$1.useState)("");
+	const [localDescription, setLocalDescription] = (0, react$1.useState)("");
+	const [selectedUrl, setSelectedUrl] = (0, react$1.useState)("");
+	const [endpointNames, setEndpointNames] = (0, react$1.useState)({});
+	const [endpointDescs, setEndpointDescs] = (0, react$1.useState)({});
+	const [endpointTags, setEndpointTags] = (0, react$1.useState)({});
+	const [endpointParams, setEndpointParams] = (0, react$1.useState)({});
+	const [endpointResponseParams, setEndpointResponseParams] = (0, react$1.useState)({});
+	const [tagDrawerState, setTagDrawerState] = (0, react$1.useState)({
 		open: false,
 		mode: "add"
 	});
-	const [deleteTagModal, setDeleteTagModal] = (0, react.useState)({
+	const [deleteTagModal, setDeleteTagModal] = (0, react$1.useState)({
 		open: false,
 		tagName: ""
 	});
-	const [localTags, setLocalTags] = (0, react.useState)([]);
+	const [localTags, setLocalTags] = (0, react$1.useState)([]);
 	const [messageApi, contextHolder] = antd.message.useMessage();
-	const { focusedContent, selectedNodeKey, selectedApi, originalData, builtTreeData, selectedEndpoint, setOriginalData, setTransformedData, setBuiltTreeData, setFocusedContent, setExpandedKeys, setSelectedEndpoint } = store_default(({ view }) => view);
+	const { focusedContent, selectedNodeKey, selectedApi, originalData, builtTreeData, selectedEndpoint, setOriginalData, setTransformedData, setBuiltTreeData, setFocusedContent, setExpandedKeys, setSelectedEndpoint } = useStore(({ view }) => view);
 	const { selectFirstApi, selectPreSelectedApi, clearSelection } = useNodeSelection();
-	const hasInitializedRef = (0, react.useRef)(false);
-	const { useBreakpoint: useBreakpoint$5 } = antd.Grid;
-	const isMobile = !useBreakpoint$5().md;
-	(0, react.useEffect)(() => {
+	const hasInitializedRef = (0, react$1.useRef)(false);
+	const { useBreakpoint } = antd.Grid;
+	const isMobile = !useBreakpoint().md;
+	(0, react$1.useEffect)(() => {
 		return () => {
 			resetStore();
 		};
@@ -6403,7 +6441,7 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 		clearSelection();
 		hasInitializedRef.current = false;
 	};
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (!hasInitializedRef.current && data.length > 0) {
 			setOriginalData(data);
 			const transformedData = data.map(transformOpenApiToDocs).sort((a, b) => a.title.localeCompare(b.title));
@@ -6417,7 +6455,7 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 		setTransformedData,
 		setBuiltTreeData
 	]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (builtTreeData && builtTreeData.length > 0 && !selectedApi && !selectedNodeKey && hasInitializedRef.current) {
 			if (!preSelectedApi) selectFirstApi(builtTreeData);
 			else selectPreSelectedApi(builtTreeData, preSelectedApi);
@@ -6429,11 +6467,11 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 		selectedApi,
 		selectFirstApi
 	]);
-	const { cx, token: token$1 } = useStyle("APIDocumentationLayout", (token$2, scope) => ({
+	const { cx, token } = useStyle("APIDocumentationLayout", (token, scope) => ({
 		[scope("documentation-container")]: {
 			display: "flex",
 			flexDirection: "column",
-			gap: token$2.marginLG,
+			gap: token.marginLG,
 			height: "100%",
 			overflowY: "auto"
 		},
@@ -6445,7 +6483,7 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 			display: "flex",
 			flexShrink: 0,
 			height: "auto",
-			gap: token$2.marginLG,
+			gap: token.marginLG,
 			width: "100%"
 		},
 		[".delete-tag-confirm-modal .ant-modal-container"]: {
@@ -6467,7 +6505,7 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 			fontSize: 16,
 			fontWeight: 400,
 			lineHeight: "24px",
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("deleteModalCloseBtn")]: {
 			position: "absolute",
@@ -6483,12 +6521,12 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 			border: "none",
 			background: "transparent",
 			padding: 0,
-			color: token$2.colorTextTertiary,
+			color: token.colorTextTertiary,
 			fontSize: 16,
 			lineHeight: 1,
 			"&:hover": {
-				color: token$2.colorText,
-				backgroundColor: token$2.colorFillSecondary
+				color: token.colorText,
+				backgroundColor: token.colorFillSecondary
 			}
 		},
 		[scope("deleteModalContent")]: {
@@ -6505,7 +6543,7 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 			fontSize: 14,
 			fontWeight: 400,
 			lineHeight: "22px",
-			color: token$2.colorText
+			color: token.colorText
 		},
 		[scope("deleteModalFooter")]: {
 			display: "flex",
@@ -6519,12 +6557,12 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 			backgroundColor: "transparent"
 		}
 	}));
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		setLocalApiName(selectedApi?.title || "");
 		setLocalDescription(selectedApi?.description || "");
 		if (selectedApi?.servers?.length) setSelectedUrl(selectedApi.servers[0].url);
 	}, [selectedApi]);
-	const tagMetadata = (0, react.useMemo)(() => {
+	const tagMetadata = (0, react$1.useMemo)(() => {
 		if (!originalData || !selectedApi) return [];
 		const rawFile = originalData.find((f) => Object.keys(f.paths)[0] === selectedApi.contextPath);
 		if (!rawFile?.tags) return [];
@@ -6536,7 +6574,7 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 			isDefault: t.name.toLowerCase() === "default"
 		}));
 	}, [originalData, selectedApi]);
-	const initialEndpointResponseParams = (0, react.useMemo)(() => {
+	const initialEndpointResponseParams = (0, react$1.useMemo)(() => {
 		if (!originalData || !selectedApi) return {};
 		const rawFile = originalData.find((f) => Object.keys(f.paths)[0] === selectedApi.contextPath);
 		if (!rawFile) return {};
@@ -6566,7 +6604,7 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 		});
 		return result;
 	}, [originalData, selectedApi]);
-	const initialEndpointParams = (0, react.useMemo)(() => {
+	const initialEndpointParams = (0, react$1.useMemo)(() => {
 		if (!originalData || !selectedApi) return {};
 		const rawFile = originalData.find((f) => Object.keys(f.paths)[0] === selectedApi.contextPath);
 		if (!rawFile) return {};
@@ -6596,12 +6634,12 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 		});
 		return result;
 	}, [originalData, selectedApi]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		setLocalTags(tagMetadata);
 		setEndpointParams(initialEndpointParams);
 		setEndpointResponseParams(initialEndpointResponseParams);
 	}, [selectedApi]);
-	(0, react.useEffect)(() => {
+	(0, react$1.useEffect)(() => {
 		if (mode !== "view" || !selectedEndpoint) return;
 		const epId = selectedEndpoint.id;
 		const openApiParams = (endpointParams[epId] ?? []).map((p) => ({
@@ -6794,7 +6832,7 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 		style: {
 			display: "flex",
 			alignItems: "center",
-			background: token$1.colorBgLayout,
+			background: token.colorBgLayout,
 			padding: "4px",
 			borderRadius: 8,
 			gap: 8
@@ -6809,14 +6847,14 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 				border: "none",
 				cursor: "pointer",
 				borderRadius: 8,
-				fontFamily: token$1.fontFamily,
-				background: mode === "edit" ? token$1.colorBgContainer : "transparent",
+				fontFamily: token.fontFamily,
+				background: mode === "edit" ? token.colorBgContainer : "transparent",
 				boxShadow: mode === "edit" ? "0px 2px 4px -2px rgba(17,12,34,0.12)" : "none",
 				fontWeight: mode === "edit" ? 700 : 400,
-				fontSize: mode === "edit" ? token$1.fontSize : token$1.fontSizeLG,
-				color: token$1.colorText
+				fontSize: mode === "edit" ? token.fontSize : token.fontSizeLG,
+				color: token.colorText
 			},
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.EditOutlined, { style: { fontSize: 18 } }), "Edit"]
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.EditOutlined, { style: { fontSize: 18 } }), "Edit"]
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 			onClick: () => setMode("view"),
 			style: {
@@ -6827,14 +6865,14 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 				border: "none",
 				cursor: "pointer",
 				borderRadius: 8,
-				fontFamily: token$1.fontFamily,
-				background: mode === "view" ? token$1.colorBgContainer : "transparent",
+				fontFamily: token.fontFamily,
+				background: mode === "view" ? token.colorBgContainer : "transparent",
 				boxShadow: mode === "view" ? "0px 2px 4px -2px rgba(17,12,34,0.12)" : "none",
 				fontWeight: mode === "view" ? 700 : 400,
-				fontSize: mode === "view" ? token$1.fontSize : token$1.fontSizeLG,
-				color: token$1.colorText
+				fontSize: mode === "view" ? token.fontSize : token.fontSizeLG,
+				color: token.colorText
 			},
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ant_design_icons.EyeOutlined, { style: { fontSize: 18 } }), "View"]
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.EyeOutlined, { style: { fontSize: 18 } }), "View"]
 		})]
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -6997,7 +7035,7 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 						handleResetSearch,
 						searchEnabled: !!searchValue
 					}),
-					!isMobile && focusedContent === "ENDPOINT" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CodeboxSidebar_default, {})
+					!isMobile && focusedContent === "ENDPOINT" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CodeboxSidebar, {})
 				]
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(AddTagDrawer, {
@@ -7097,9 +7135,105 @@ const DocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage, onS
 		]
 	});
 };
-
+//#endregion
+//#region src/view/devportal-layout.tsx
+const DevportalDocumentationLayout = ({ data, preSelectedApi, handleVisitLandingPage }) => {
+	const [searchValue, setSearchValue] = (0, react$1.useState)("");
+	const { focusedContent, selectedNodeKey, selectedApi, builtTreeData, setOriginalData, setTransformedData, setBuiltTreeData, setFocusedContent, setExpandedKeys } = useStore(({ view }) => view);
+	const { selectFirstApi, selectPreSelectedApi, clearSelection } = useNodeSelection();
+	const hasInitializedRef = (0, react$1.useRef)(false);
+	(0, react$1.useEffect)(() => {
+		return () => {
+			resetStore();
+		};
+	}, []);
+	const resetStore = () => {
+		setExpandedKeys([]);
+		setFocusedContent(null);
+		setBuiltTreeData([]);
+		setTransformedData([]);
+		setOriginalData([]);
+		setSearchValue("");
+		clearSelection();
+		hasInitializedRef.current = false;
+	};
+	(0, react$1.useEffect)(() => {
+		if (!hasInitializedRef.current && data.length > 0) {
+			setOriginalData(data);
+			const transformedData = data.map(transformOpenApiToDocs).sort((a, b) => a.title.localeCompare(b.title));
+			setTransformedData(transformedData);
+			setBuiltTreeData(buildTreeDataStructure(transformedData));
+			hasInitializedRef.current = true;
+		}
+	}, [
+		data,
+		setOriginalData,
+		setTransformedData,
+		setBuiltTreeData
+	]);
+	(0, react$1.useEffect)(() => {
+		if (builtTreeData && builtTreeData.length > 0 && !selectedApi && !selectedNodeKey && hasInitializedRef.current) {
+			if (!preSelectedApi) selectFirstApi(builtTreeData);
+			else selectPreSelectedApi(builtTreeData, preSelectedApi);
+			hasInitializedRef.current = false;
+		}
+	}, [
+		builtTreeData,
+		selectedNodeKey,
+		selectedApi,
+		selectFirstApi
+	]);
+	const { cx } = useStyle("APIDocumentationLayout", (token, scope) => ({
+		[scope("documentation-container")]: {
+			display: "flex",
+			flexDirection: "column",
+			gap: token.marginLG,
+			height: "100%",
+			maxHeight: "100%",
+			overflow: "hidden"
+		},
+		[scope("docs-layout")]: {
+			display: "flex",
+			height: "100%",
+			maxHeight: "100%",
+			overflow: "hidden",
+			gap: token.marginLG,
+			width: "100%"
+		}
+	}));
+	const handleResetSearch = () => {
+		setSearchValue("");
+	};
+	const _handleVisitLandingPage = () => {
+		if (handleVisitLandingPage) {
+			handleVisitLandingPage();
+			return;
+		}
+		window.location.pathname = "/";
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: cx("documentation-container"),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: cx("docs-layout"),
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Sidebar, {
+					searchValue,
+					setSearchValue
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MainContent, {
+					handleVisitLandingPage: _handleVisitLandingPage,
+					handleResetSearch,
+					searchEnabled: !!searchValue
+				}),
+				focusedContent === "ENDPOINT" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CodeboxSidebar, {})
+			]
+		})
+	});
+};
 //#endregion
 exports.ApiDocumentationBar = ApiDocumentationBar;
+exports.DevportalDocumentationLayout = DevportalDocumentationLayout;
 exports.DocumentationLayout = DocumentationLayout;
 exports.useStore = useStore;
+
 //# sourceMappingURL=index.cjs.map