@burdenoff/microfe-crewfoundry 2026.704.6 → 2026.707.1

package/dist/crewfoundry/pages/MarketplaceMarketplaceServicesPagePage.js

@@ -1,65 +1,110 @@
 import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { formatEnumLabel as t } from "../utils/formatEnumLabel.js";
-import { useState as n } from "react";
-import { Search as r, Star as i } from "lucide-react";
-import { useNavigate as a } from "react-router-dom";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { Badge as c, CardContent as l, GlassCard as u, GradientText as d, IllustratedEmptyState as f, Input as p, PagePurpose as m, Pagination as h, ResponsiveTable as g } from "@burdenoff/fe-libs/ui";
-import { usePagination as _ } from "@burdenoff/fe-libs/shared/hooks";
+import { getInitials as n } from "../components/viz/lib/format.js";
+import { RatingStars as r } from "../components/viz/RatingStars.js";
+import { SegmentedTabs as i } from "../components/viz/SegmentedTabs.js";
+import "../components/viz/index.js";
+import { useEffect as a, useMemo as o, useState as s } from "react";
+import { Search as c } from "lucide-react";
+import { useNavigate as l } from "react-router-dom";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { Badge as f, CardContent as p, GlassCard as m, GradientText as h, IllustratedEmptyState as g, Input as _, PagePurpose as v, Pagination as y, ResponsiveTable as b } from "@burdenoff/fe-libs/ui";
+import { usePagination as x } from "@burdenoff/fe-libs/shared/hooks";
 //#region src/crewfoundry/pages/MarketplaceMarketplaceServicesPagePage.tsx
-function v() {
-	let v = a(), { marketplaceServices: y } = e(), [b, x] = n(""), { page: S, pageSize: C, offset: w, setPage: T } = _({ initialPageSize: 10 }), E = y.filter((e) => `${e.title} ${e.provider} ${e.category}`.toLowerCase().includes(b.toLowerCase())), D = E.slice(w, w + C);
-	return /* @__PURE__ */ s("div", {
+function S() {
+	let S = l(), { marketplaceServices: C } = e(), [w, T] = s(""), [E, D] = s("all"), { page: O, pageSize: k, offset: A, setPage: j } = x({ initialPageSize: 10 }), M = o(() => {
+		let e = /* @__PURE__ */ new Map();
+		for (let t of C) e.set(t.category, (e.get(t.category) ?? 0) + 1);
+		let t = [{
+			id: "all",
+			label: "All",
+			count: C.length
+		}];
+		for (let [n, r] of [...e.entries()].sort((e, t) => e[0].localeCompare(t[0]))) t.push({
+			id: n,
+			label: n,
+			count: r
+		});
+		return t;
+	}, [C]), N = C.filter((e) => E !== "all" && e.category !== E ? !1 : `${e.title} ${e.provider} ${e.category}`.toLowerCase().includes(w.toLowerCase())), P = N.slice(A, A + k);
+	return a(() => {
+		j(1);
+	}, [
+		w,
+		E,
+		j
+	]), /* @__PURE__ */ d("div", {
 		className: "space-y-6 p-6",
 		children: [
-			/* @__PURE__ */ s("div", { children: [
-				/* @__PURE__ */ o("h1", {
+			/* @__PURE__ */ d("div", { children: [
+				/* @__PURE__ */ u("h1", {
 					className: "text-2xl font-semibold",
-					children: /* @__PURE__ */ o(d, { children: "Browse Services" })
+					children: /* @__PURE__ */ u(h, { children: "Browse Services" })
 				}),
-				/* @__PURE__ */ s("p", {
+				/* @__PURE__ */ d("p", {
 					className: "text-sm text-text-secondary",
-					children: [y.length, " services available"]
+					children: [C.length, " services available"]
 				}),
-				/* @__PURE__ */ o(m, {
+				/* @__PURE__ */ u(v, {
 					className: "mt-1",
 					children: "Explore services offered on the marketplace — search and compare offerings to find exactly the help your project needs."
 				})
 			] }),
-			/* @__PURE__ */ s("div", {
-				className: "relative max-w-sm",
-				children: [/* @__PURE__ */ o(r, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary" }), /* @__PURE__ */ o(p, {
-					placeholder: "Search services...",
-					className: "pl-9",
-					value: b,
-					onChange: (e) => x(e.target.value)
+			/* @__PURE__ */ d("div", {
+				className: "flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between",
+				children: [/* @__PURE__ */ d("div", {
+					className: "relative w-full max-w-sm",
+					children: [/* @__PURE__ */ u(c, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary" }), /* @__PURE__ */ u(_, {
+						placeholder: "Search services...",
+						className: "pl-9",
+						value: w,
+						onChange: (e) => T(e.target.value)
+					})]
+				}), /* @__PURE__ */ u("div", {
+					className: "-mx-1 overflow-x-auto px-1 pb-1",
+					children: /* @__PURE__ */ u(i, {
+						tabs: M,
+						value: E,
+						onChange: D,
+						"aria-label": "Filter services by category"
+					})
 				})]
 			}),
-			/* @__PURE__ */ o(u, {
+			/* @__PURE__ */ u(m, {
 				treatment: "glass",
 				glow: !0,
 				className: "border-border-seam",
-				children: /* @__PURE__ */ o(l, {
+				children: /* @__PURE__ */ u(p, {
 					className: "p-4",
-					children: /* @__PURE__ */ o(g, {
+					children: /* @__PURE__ */ u(b, {
 						columns: [
 							{
 								key: "service",
 								header: "Service",
 								priority: "primary",
-								cell: (e) => /* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("p", {
-									className: "font-medium",
-									children: e.title
-								}), /* @__PURE__ */ s("p", {
-									className: "text-xs text-text-secondary truncate",
-									children: [e.description.slice(0, 60), e.description.length > 60 ? "…" : ""]
-								})] })
+								cell: (e) => /* @__PURE__ */ d("div", {
+									className: "flex items-center gap-2.5",
+									children: [/* @__PURE__ */ u("span", {
+										className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-action-primary-bg text-[11px] font-semibold text-action-primary-text",
+										"aria-hidden": "true",
+										children: n(e.provider)
+									}), /* @__PURE__ */ d("div", {
+										className: "min-w-0",
+										children: [/* @__PURE__ */ u("p", {
+											className: "font-medium",
+											children: e.title
+										}), /* @__PURE__ */ d("p", {
+											className: "truncate text-xs text-text-secondary",
+											children: [e.description.slice(0, 60), e.description.length > 60 ? "…" : ""]
+										})]
+									})]
+								})
 							},
 							{
 								key: "provider",
 								header: "Provider",
 								priority: "secondary",
-								cell: (e) => /* @__PURE__ */ o("span", {
+								cell: (e) => /* @__PURE__ */ u("span", {
 									className: "text-text-secondary",
 									children: e.provider
 								})
@@ -68,7 +113,7 @@ function v() {
 								key: "category",
 								header: "Category",
 								priority: "secondary",
-								cell: (e) => /* @__PURE__ */ o(c, {
+								cell: (e) => /* @__PURE__ */ u(f, {
 									variant: "outline",
 									className: "w-fit h-fit text-[10px]",
 									children: e.category
@@ -78,7 +123,7 @@ function v() {
 								key: "price",
 								header: "Price",
 								priority: "secondary",
-								cell: (e) => /* @__PURE__ */ s("span", {
+								cell: (e) => /* @__PURE__ */ d("span", {
 									className: "font-medium",
 									children: [
 										"$",
@@ -92,32 +137,27 @@ function v() {
 								key: "rating",
 								header: "Rating",
 								priority: "secondary",
-								cell: (e) => /* @__PURE__ */ s("span", {
-									className: "flex items-center gap-1",
-									children: [
-										/* @__PURE__ */ o(i, { className: "h-3 w-3 text-status-warning-text" }),
-										e.rating,
-										" (",
-										e.reviews,
-										")"
-									]
+								cell: (e) => /* @__PURE__ */ u(r, {
+									value: e.rating,
+									count: e.reviews,
+									size: 12
 								})
 							},
 							{
 								key: "status",
 								header: "Status",
 								priority: "secondary",
-								cell: (e) => /* @__PURE__ */ o(c, {
+								cell: (e) => /* @__PURE__ */ u(f, {
 									variant: e.status === "active" ? "default" : "secondary",
 									className: "text-[10px]",
 									children: t(e.status)
 								})
 							}
 						],
-						data: D,
+						data: P,
 						rowKey: (e) => e.id,
-						onRowClick: (e) => v(`../marketplace/service-details-page?id=${e.id}`),
-						emptyState: /* @__PURE__ */ o(f, {
+						onRowClick: (e) => S(`../marketplace/service-details-page?id=${e.id}`),
+						emptyState: /* @__PURE__ */ u(g, {
 							illustration: "empty-search",
 							title: "No services found",
 							description: "Try a different search term to find the help you need."
@@ -125,16 +165,16 @@ function v() {
 					})
 				})
 			}),
-			E.length > 0 ? /* @__PURE__ */ o(h, {
-				page: S,
-				pageSize: C,
-				totalItems: E.length,
-				onPageChange: T
+			N.length > 0 ? /* @__PURE__ */ u(y, {
+				page: O,
+				pageSize: k,
+				totalItems: N.length,
+				onPageChange: j
 			}) : null
 		]
 	});
 }
 //#endregion
-export { v as MarketplaceMarketplaceServicesPagePage };
+export { S as MarketplaceMarketplaceServicesPagePage };
 
 //# sourceMappingURL=MarketplaceMarketplaceServicesPagePage.js.map

package/dist/crewfoundry/pages/MarketplaceMarketplaceServicesPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"MarketplaceMarketplaceServicesPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/MarketplaceMarketplaceServicesPagePage.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n  Badge,\n  CardContent,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  Input,\n  PagePurpose,\n  Pagination,\n  ResponsiveTable,\n  type ResponsiveTableColumn,\n} from '@burdenoff/fe-libs/ui';\nimport { usePagination } from '@burdenoff/fe-libs/shared/hooks';\nimport { Search, Star } from 'lucide-react';\nimport { useNavigate } from 'react-router-dom';\nimport { useCrewFoundryStore, type MarketplaceService } from '../store/crewfoundryStore';\nimport { formatEnumLabel } from '../utils/formatEnumLabel';\n\nexport function MarketplaceMarketplaceServicesPagePage() {\n  const navigate = useNavigate();\n  const { marketplaceServices } = useCrewFoundryStore();\n  const [search, setSearch] = useState('');\n  const { page, pageSize, offset, setPage } = usePagination({ initialPageSize: 10 });\n  const filtered = marketplaceServices.filter((s) =>\n    `${s.title} ${s.provider} ${s.category}`.toLowerCase().includes(search.toLowerCase())\n  );\n  const paged = filtered.slice(offset, offset + pageSize);\n\n  const columns: ResponsiveTableColumn<MarketplaceService>[] = [\n    {\n      key: 'service',\n      header: 'Service',\n      priority: 'primary',\n      cell: (svc) => (\n        <div>\n          <p className=\"font-medium\">{svc.title}</p>\n          <p className=\"text-xs text-text-secondary truncate\">\n            {svc.description.slice(0, 60)}\n            {svc.description.length > 60 ? '…' : ''}\n          </p>\n        </div>\n      ),\n    },\n    {\n      key: 'provider',\n      header: 'Provider',\n      priority: 'secondary',\n      cell: (svc) => <span className=\"text-text-secondary\">{svc.provider}</span>,\n    },\n    {\n      key: 'category',\n      header: 'Category',\n      priority: 'secondary',\n      cell: (svc) => (\n        <Badge variant=\"outline\" className=\"w-fit h-fit text-[10px]\">\n          {svc.category}\n        </Badge>\n      ),\n    },\n    {\n      key: 'price',\n      header: 'Price',\n      priority: 'secondary',\n      cell: (svc) => (\n        <span className=\"font-medium\">\n          ${svc.price.toLocaleString()}/{svc.priceType}\n        </span>\n      ),\n    },\n    {\n      key: 'rating',\n      header: 'Rating',\n      priority: 'secondary',\n      cell: (svc) => (\n        <span className=\"flex items-center gap-1\">\n          <Star className=\"h-3 w-3 text-status-warning-text\" />\n          {svc.rating} ({svc.reviews})\n        </span>\n      ),\n    },\n    {\n      key: 'status',\n      header: 'Status',\n      priority: 'secondary',\n      cell: (svc) => (\n        <Badge variant={svc.status === 'active' ? 'default' : 'secondary'} className=\"text-[10px]\">\n          {formatEnumLabel(svc.status)}\n        </Badge>\n      ),\n    },\n  ];\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div>\n        <h1 className=\"text-2xl font-semibold\">\n          <GradientText>Browse Services</GradientText>\n        </h1>\n        <p className=\"text-sm text-text-secondary\">\n          {marketplaceServices.length} services available\n        </p>\n        <PagePurpose className=\"mt-1\">\n          Explore services offered on the marketplace — search and compare offerings to find exactly\n          the help your project needs.\n        </PagePurpose>\n      </div>\n      <div className=\"relative max-w-sm\">\n        <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n        <Input\n          placeholder=\"Search services...\"\n          className=\"pl-9\"\n          value={search}\n          onChange={(e) => setSearch(e.target.value)}\n        />\n      </div>\n      <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n        <CardContent className=\"p-4\">\n          <ResponsiveTable\n            columns={columns}\n            data={paged}\n            rowKey={(svc) => svc.id}\n            onRowClick={(svc) => navigate(`../marketplace/service-details-page?id=${svc.id}`)}\n            emptyState={\n              <IllustratedEmptyState\n                illustration=\"empty-search\"\n                title=\"No services found\"\n                description=\"Try a different search term to find the help you need.\"\n              />\n            }\n          />\n        </CardContent>\n      </GlassCard>\n      {filtered.length > 0 ? (\n        <Pagination\n          page={page}\n          pageSize={pageSize}\n          totalItems={filtered.length}\n          onPageChange={setPage}\n        />\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;AAmBA,SAAgB,IAAyC;CACvD,IAAM,IAAW,GAAa,EACxB,EAAE,2BAAwB,GAAqB,EAC/C,CAAC,GAAQ,KAAa,EAAS,GAAG,EAClC,EAAE,SAAM,aAAU,WAAQ,eAAY,EAAc,EAAE,iBAAiB,IAAI,CAAC,EAC5E,IAAW,EAAoB,QAAQ,MAC3C,GAAG,EAAE,MAAM,GAAG,EAAE,SAAS,GAAG,EAAE,WAAW,aAAa,CAAC,SAAS,EAAO,aAAa,CAAC,CACtF,EACK,IAAQ,EAAS,MAAM,GAAQ,IAAS,EAAS;AAkEvD,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,OAAD,EAAA,UAAA;IACE,kBAAC,MAAD;KAAI,WAAU;eACZ,kBAAC,GAAD,EAAA,UAAc,mBAA8B,CAAA;KACzC,CAAA;IACL,kBAAC,KAAD;KAAG,WAAU;eAAb,CACG,EAAoB,QAAO,sBAC1B;;IACJ,kBAAC,GAAD;KAAa,WAAU;eAAO;KAGhB,CAAA;IACV,EAAA,CAAA;GACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,GAAD,EAAQ,WAAU,wEAAyE,CAAA,EAC3F,kBAAC,GAAD;KACE,aAAY;KACZ,WAAU;KACV,OAAO;KACP,WAAW,MAAM,EAAU,EAAE,OAAO,MAAM;KAC1C,CAAA,CACE;;GACN,kBAAC,GAAD;IAAW,WAAU;IAAQ,MAAA;IAAK,WAAU;cAC1C,kBAAC,GAAD;KAAa,WAAU;eACrB,kBAAC,GAAD;MACW,SA1F0C;OAC3D;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MACL,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,KAAD;SAAG,WAAU;mBAAe,EAAI;SAAU,CAAA,EAC1C,kBAAC,KAAD;SAAG,WAAU;mBAAb,CACG,EAAI,YAAY,MAAM,GAAG,GAAG,EAC5B,EAAI,YAAY,SAAS,KAAK,MAAM,GACnC;WACA,EAAA,CAAA;QAET;OACD;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MAAQ,kBAAC,QAAD;SAAM,WAAU;mBAAuB,EAAI;SAAgB,CAAA;QAC3E;OACD;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MACL,kBAAC,GAAD;SAAO,SAAQ;SAAU,WAAU;mBAChC,EAAI;SACC,CAAA;QAEX;OACD;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MACL,kBAAC,QAAD;SAAM,WAAU;mBAAhB;UAA8B;UAC1B,EAAI,MAAM,gBAAgB;UAAC;UAAE,EAAI;UAC9B;;QAEV;OACD;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MACL,kBAAC,QAAD;SAAM,WAAU;mBAAhB;UACE,kBAAC,GAAD,EAAM,WAAU,oCAAqC,CAAA;UACpD,EAAI;UAAO;UAAG,EAAI;UAAQ;UACtB;;QAEV;OACD;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MACL,kBAAC,GAAD;SAAO,SAAS,EAAI,WAAW,WAAW,YAAY;SAAa,WAAU;mBAC1E,EAAgB,EAAI,OAAO;SACtB,CAAA;QAEX;OACF;MA6BS,MAAM;MACN,SAAS,MAAQ,EAAI;MACrB,aAAa,MAAQ,EAAS,0CAA0C,EAAI,KAAK;MACjF,YACE,kBAAC,GAAD;OACE,cAAa;OACb,OAAM;OACN,aAAY;OACZ,CAAA;MAEJ,CAAA;KACU,CAAA;IACJ,CAAA;GACX,EAAS,SAAS,IACjB,kBAAC,GAAD;IACQ;IACI;IACV,YAAY,EAAS;IACrB,cAAc;IACd,CAAA,GACA;GACA"}
+{"version":3,"file":"MarketplaceMarketplaceServicesPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/MarketplaceMarketplaceServicesPagePage.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\nimport {\n  Badge,\n  CardContent,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  Input,\n  PagePurpose,\n  Pagination,\n  ResponsiveTable,\n  type ResponsiveTableColumn,\n} from '@burdenoff/fe-libs/ui';\nimport { usePagination } from '@burdenoff/fe-libs/shared/hooks';\nimport { Search } from 'lucide-react';\nimport { useNavigate } from 'react-router-dom';\nimport { useCrewFoundryStore, type MarketplaceService } from '../store/crewfoundryStore';\nimport { formatEnumLabel } from '../utils/formatEnumLabel';\nimport { RatingStars, SegmentedTabs, getInitials, type SegmentedTab } from '../components/viz';\n\nexport function MarketplaceMarketplaceServicesPagePage() {\n  const navigate = useNavigate();\n  const { marketplaceServices } = useCrewFoundryStore();\n  const [search, setSearch] = useState('');\n  const [category, setCategory] = useState('all');\n  const { page, pageSize, offset, setPage } = usePagination({ initialPageSize: 10 });\n\n  const categoryTabs = useMemo<SegmentedTab[]>(() => {\n    const counts = new Map<string, number>();\n    for (const svc of marketplaceServices) {\n      counts.set(svc.category, (counts.get(svc.category) ?? 0) + 1);\n    }\n    const tabs: SegmentedTab[] = [{ id: 'all', label: 'All', count: marketplaceServices.length }];\n    for (const [name, count] of [...counts.entries()].sort((a, b) => a[0].localeCompare(b[0]))) {\n      tabs.push({ id: name, label: name, count });\n    }\n    return tabs;\n  }, [marketplaceServices]);\n\n  const filtered = marketplaceServices.filter((s) => {\n    if (category !== 'all' && s.category !== category) {\n      return false;\n    }\n    return `${s.title} ${s.provider} ${s.category}`.toLowerCase().includes(search.toLowerCase());\n  });\n  const paged = filtered.slice(offset, offset + pageSize);\n\n  useEffect(() => {\n    setPage(1);\n  }, [search, category, setPage]);\n\n  const columns: ResponsiveTableColumn<MarketplaceService>[] = [\n    {\n      key: 'service',\n      header: 'Service',\n      priority: 'primary',\n      cell: (svc) => (\n        <div className=\"flex items-center gap-2.5\">\n          <span\n            className=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-action-primary-bg text-[11px] font-semibold text-action-primary-text\"\n            aria-hidden=\"true\"\n          >\n            {getInitials(svc.provider)}\n          </span>\n          <div className=\"min-w-0\">\n            <p className=\"font-medium\">{svc.title}</p>\n            <p className=\"truncate text-xs text-text-secondary\">\n              {svc.description.slice(0, 60)}\n              {svc.description.length > 60 ? '…' : ''}\n            </p>\n          </div>\n        </div>\n      ),\n    },\n    {\n      key: 'provider',\n      header: 'Provider',\n      priority: 'secondary',\n      cell: (svc) => <span className=\"text-text-secondary\">{svc.provider}</span>,\n    },\n    {\n      key: 'category',\n      header: 'Category',\n      priority: 'secondary',\n      cell: (svc) => (\n        <Badge variant=\"outline\" className=\"w-fit h-fit text-[10px]\">\n          {svc.category}\n        </Badge>\n      ),\n    },\n    {\n      key: 'price',\n      header: 'Price',\n      priority: 'secondary',\n      cell: (svc) => (\n        <span className=\"font-medium\">\n          ${svc.price.toLocaleString()}/{svc.priceType}\n        </span>\n      ),\n    },\n    {\n      key: 'rating',\n      header: 'Rating',\n      priority: 'secondary',\n      cell: (svc) => <RatingStars value={svc.rating} count={svc.reviews} size={12} />,\n    },\n    {\n      key: 'status',\n      header: 'Status',\n      priority: 'secondary',\n      cell: (svc) => (\n        <Badge variant={svc.status === 'active' ? 'default' : 'secondary'} className=\"text-[10px]\">\n          {formatEnumLabel(svc.status)}\n        </Badge>\n      ),\n    },\n  ];\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div>\n        <h1 className=\"text-2xl font-semibold\">\n          <GradientText>Browse Services</GradientText>\n        </h1>\n        <p className=\"text-sm text-text-secondary\">\n          {marketplaceServices.length} services available\n        </p>\n        <PagePurpose className=\"mt-1\">\n          Explore services offered on the marketplace — search and compare offerings to find exactly\n          the help your project needs.\n        </PagePurpose>\n      </div>\n      <div className=\"flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between\">\n        <div className=\"relative w-full max-w-sm\">\n          <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n          <Input\n            placeholder=\"Search services...\"\n            className=\"pl-9\"\n            value={search}\n            onChange={(e) => setSearch(e.target.value)}\n          />\n        </div>\n        <div className=\"-mx-1 overflow-x-auto px-1 pb-1\">\n          <SegmentedTabs\n            tabs={categoryTabs}\n            value={category}\n            onChange={setCategory}\n            aria-label=\"Filter services by category\"\n          />\n        </div>\n      </div>\n      <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n        <CardContent className=\"p-4\">\n          <ResponsiveTable\n            columns={columns}\n            data={paged}\n            rowKey={(svc) => svc.id}\n            onRowClick={(svc) => navigate(`../marketplace/service-details-page?id=${svc.id}`)}\n            emptyState={\n              <IllustratedEmptyState\n                illustration=\"empty-search\"\n                title=\"No services found\"\n                description=\"Try a different search term to find the help you need.\"\n              />\n            }\n          />\n        </CardContent>\n      </GlassCard>\n      {filtered.length > 0 ? (\n        <Pagination\n          page={page}\n          pageSize={pageSize}\n          totalItems={filtered.length}\n          onPageChange={setPage}\n        />\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AAoBA,SAAgB,IAAyC;CACvD,IAAM,IAAW,GAAa,EACxB,EAAE,2BAAwB,GAAqB,EAC/C,CAAC,GAAQ,KAAa,EAAS,GAAG,EAClC,CAAC,GAAU,KAAe,EAAS,MAAM,EACzC,EAAE,SAAM,aAAU,WAAQ,eAAY,EAAc,EAAE,iBAAiB,IAAI,CAAC,EAE5E,IAAe,QAA8B;EACjD,IAAM,oBAAS,IAAI,KAAqB;AACxC,OAAK,IAAM,KAAO,EAChB,GAAO,IAAI,EAAI,WAAW,EAAO,IAAI,EAAI,SAAS,IAAI,KAAK,EAAE;EAE/D,IAAM,IAAuB,CAAC;GAAE,IAAI;GAAO,OAAO;GAAO,OAAO,EAAoB;GAAQ,CAAC;AAC7F,OAAK,IAAM,CAAC,GAAM,MAAU,CAAC,GAAG,EAAO,SAAS,CAAC,CAAC,MAAM,GAAG,MAAM,EAAE,GAAG,cAAc,EAAE,GAAG,CAAC,CACxF,GAAK,KAAK;GAAE,IAAI;GAAM,OAAO;GAAM;GAAO,CAAC;AAE7C,SAAO;IACN,CAAC,EAAoB,CAAC,EAEnB,IAAW,EAAoB,QAAQ,MACvC,MAAa,SAAS,EAAE,aAAa,IAChC,KAEF,GAAG,EAAE,MAAM,GAAG,EAAE,SAAS,GAAG,EAAE,WAAW,aAAa,CAAC,SAAS,EAAO,aAAa,CAAC,CAC5F,EACI,IAAQ,EAAS,MAAM,GAAQ,IAAS,EAAS;AAyEvD,QAvEA,QAAgB;AACd,IAAQ,EAAE;IACT;EAAC;EAAQ;EAAU;EAAQ,CAAC,EAsE7B,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,OAAD,EAAA,UAAA;IACE,kBAAC,MAAD;KAAI,WAAU;eACZ,kBAAC,GAAD,EAAA,UAAc,mBAA8B,CAAA;KACzC,CAAA;IACL,kBAAC,KAAD;KAAG,WAAU;eAAb,CACG,EAAoB,QAAO,sBAC1B;;IACJ,kBAAC,GAAD;KAAa,WAAU;eAAO;KAGhB,CAAA;IACV,EAAA,CAAA;GACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD,EAAQ,WAAU,wEAAyE,CAAA,EAC3F,kBAAC,GAAD;MACE,aAAY;MACZ,WAAU;MACV,OAAO;MACP,WAAW,MAAM,EAAU,EAAE,OAAO,MAAM;MAC1C,CAAA,CACE;QACN,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,GAAD;MACE,MAAM;MACN,OAAO;MACP,UAAU;MACV,cAAW;MACX,CAAA;KACE,CAAA,CACF;;GACN,kBAAC,GAAD;IAAW,WAAU;IAAQ,MAAA;IAAK,WAAU;cAC1C,kBAAC,GAAD;KAAa,WAAU;eACrB,kBAAC,GAAD;MACW,SAvG0C;OAC3D;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MACL,kBAAC,OAAD;SAAK,WAAU;mBAAf,CACE,kBAAC,QAAD;UACE,WAAU;UACV,eAAY;oBAEX,EAAY,EAAI,SAAS;UACrB,CAAA,EACP,kBAAC,OAAD;UAAK,WAAU;oBAAf,CACE,kBAAC,KAAD;WAAG,WAAU;qBAAe,EAAI;WAAU,CAAA,EAC1C,kBAAC,KAAD;WAAG,WAAU;qBAAb,CACG,EAAI,YAAY,MAAM,GAAG,GAAG,EAC5B,EAAI,YAAY,SAAS,KAAK,MAAM,GACnC;aACA;YACF;;QAET;OACD;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MAAQ,kBAAC,QAAD;SAAM,WAAU;mBAAuB,EAAI;SAAgB,CAAA;QAC3E;OACD;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MACL,kBAAC,GAAD;SAAO,SAAQ;SAAU,WAAU;mBAChC,EAAI;SACC,CAAA;QAEX;OACD;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MACL,kBAAC,QAAD;SAAM,WAAU;mBAAhB;UAA8B;UAC1B,EAAI,MAAM,gBAAgB;UAAC;UAAE,EAAI;UAC9B;;QAEV;OACD;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MAAQ,kBAAC,GAAD;SAAa,OAAO,EAAI;SAAQ,OAAO,EAAI;SAAS,MAAM;SAAM,CAAA;QAChF;OACD;QACE,KAAK;QACL,QAAQ;QACR,UAAU;QACV,OAAO,MACL,kBAAC,GAAD;SAAO,SAAS,EAAI,WAAW,WAAW,YAAY;SAAa,WAAU;mBAC1E,EAAgB,EAAI,OAAO;SACtB,CAAA;QAEX;OACF;MAuCS,MAAM;MACN,SAAS,MAAQ,EAAI;MACrB,aAAa,MAAQ,EAAS,0CAA0C,EAAI,KAAK;MACjF,YACE,kBAAC,GAAD;OACE,cAAa;OACb,OAAM;OACN,aAAY;OACZ,CAAA;MAEJ,CAAA;KACU,CAAA;IACJ,CAAA;GACX,EAAS,SAAS,IACjB,kBAAC,GAAD;IACQ;IACI;IACV,YAAY,EAAS;IACrB,cAAc;IACd,CAAA,GACA;GACA"}