@burdenoff/microfe-workspaces 2026.520.1 → 2026.528.1

package/dist/WorkspacesRoot.js

@@ -7,7 +7,10 @@ import { FeatureFlagProvider as l, useFeatureFlags as u } from "@burdenoff/fe-li
 import { jsx as d } from "react/jsx-runtime";
 //#region src/WorkspacesRoot.tsx
 var f = (f) => {
-	let { registerNavItems: p, registerFooterItems: m, basePath: h = "/" } = f, { isEnabled: g, evaluations: _ } = u(), v = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`), y = i(() => ({ isEnabled: g }), [_, g]);
+	let { registerNavItems: p, registerFooterItems: m, basePath: h = "/" } = f, { isEnabled: g, evaluations: _ } = u(), v = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`), y = i(() => ({
+		isEnabled: g,
+		evaluations: _
+	}), [_, g]);
 	return r(() => {
 		if (p) return p([
 			{

package/dist/WorkspacesRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"WorkspacesRoot.js","names":[],"sources":["../src/WorkspacesRoot.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useEffect, useMemo } from 'react';\nimport { Building2, FolderKanban, Users, Activity } from 'lucide-react';\nimport { useFeatureFlags, FeatureFlagProvider } from '@burdenoff/fe-libs/shared/feature-flags';\nimport { WorkspacesProvider } from './providers/WorkspacesProvider';\nimport { WorkspacesErrorBoundary } from './components/WorkspacesErrorBoundary';\nimport type { NavItem, WorkspacesRootProps } from './types';\nimport { WorkspacesRoutes } from './WorkspacesRoutes';\n\n/**\n * Root component for the Workspaces microfrontend.\n *\n * This is the main entry point that host applications import and render.\n * It sets up the necessary providers and renders the internal routing.\n * Automatically registers navigation items with the shell if registration functions are provided.\n * Nav items for feature-previewed pages (projects, members, activity) are conditionally\n * hidden based on feature flags.\n *\n * @example\n * ```tsx\n * import { WorkspacesRoot } from '@burdenoff/micro-fe/workspaces';\n *\n * function App() {\n *   return (\n *     <Route path=\"/workspaces/*\" element={\n *       <WorkspacesRoot\n *         basePath=\"/workspaces\"\n *         navigate={navigate}\n *         currentUser={user}\n *         workspaceId=\"ws-123\"\n *         tenantId=\"tenant-123\"\n *         apiGatewayUrl=\"https://gw-global.local.burdenoff.com\"\n *         authToken=\"token\"\n *       />\n *     } />\n *   );\n * }\n * ```\n */\nexport const WorkspacesRoot: FC<WorkspacesRootProps> = (props) => {\n  const { registerNavItems, registerFooterItems, basePath = '/' } = props;\n  const { isEnabled, evaluations } = useFeatureFlags();\n\n  // Helper to join paths correctly, avoiding double slashes\n  const joinPath = (base: string, path: string): string => {\n    const cleanBase = base.endsWith('/') ? base.slice(0, -1) : base;\n    const cleanPath = path.startsWith('/') ? path : `/${path}`;\n    return cleanBase + cleanPath;\n  };\n\n  // Rebuild flag helpers whenever evaluations change so nav re-registers\n  const flagHelpers = useMemo(() => ({ isEnabled }), [evaluations, isEnabled]);\n\n  // Register navigation items with the shell\n  useEffect(() => {\n    if (!registerNavItems) return;\n\n    const navItems: NavItem[] = [\n      {\n        id: 'workspaces-all',\n        label: 'All Workspaces',\n        path: joinPath(basePath, 'list'),\n        icon: <Building2 size={20} />,\n        order: 10,\n        group: 'workspaces',\n      },\n      // workspaces.projects — hidden until feature flag is enabled\n      ...(flagHelpers.isEnabled('workspaces.projects')\n        ? [\n            {\n              id: 'workspaces-projects',\n              label: 'Projects',\n              path: joinPath(basePath, 'projects'),\n              icon: <FolderKanban size={20} />,\n              order: 20,\n              group: 'workspaces',\n            },\n          ]\n        : []),\n      // workspaces.members — hidden until feature flag is enabled\n      ...(flagHelpers.isEnabled('workspaces.members')\n        ? [\n            {\n              id: 'workspaces-members',\n              label: 'Members',\n              path: joinPath(basePath, 'members'),\n              icon: <Users size={20} />,\n              order: 30,\n              group: 'workspaces',\n            },\n          ]\n        : []),\n      // workspaces.activity — hidden until feature flag is enabled\n      ...(flagHelpers.isEnabled('workspaces.activity')\n        ? [\n            {\n              id: 'workspaces-activity',\n              label: 'Activity',\n              path: joinPath(basePath, 'activity'),\n              icon: <Activity size={20} />,\n              order: 40,\n              group: 'workspaces',\n            },\n          ]\n        : []),\n    ];\n\n    // Register and get cleanup function\n    const cleanup = registerNavItems(navItems);\n\n    // Return cleanup function to unregister on unmount\n    return cleanup;\n  }, [registerNavItems, basePath, flagHelpers]);\n\n  // Register footer items (example: workspace status in left section)\n  useEffect(() => {\n    if (!registerFooterItems) return;\n\n    const footerItems = [\n      {\n        id: 'workspaces-status',\n        label: 'Workspaces Ready',\n        type: 'status' as const,\n        order: 10,\n        section: 'left' as const,\n      },\n    ];\n\n    const cleanup = registerFooterItems(footerItems);\n    return cleanup;\n  }, [registerFooterItems]);\n\n  return (\n    <FeatureFlagProvider workspaceId={null} gateway=\"global\" defaultEnabled={true}>\n      <WorkspacesErrorBoundary>\n        <WorkspacesProvider {...props}>\n          <WorkspacesRoutes />\n        </WorkspacesProvider>\n      </WorkspacesErrorBoundary>\n    </FeatureFlagProvider>\n  );\n};\n"],"mappings":";;;;;;;;AAuCA,IAAa,KAA2C,MAAU;CAChE,IAAM,EAAE,qBAAkB,wBAAqB,cAAW,QAAQ,GAC5D,EAAE,cAAW,mBAAgB,GAAiB,EAG9C,KAAY,GAAc,OACZ,EAAK,SAAS,IAAI,GAAG,EAAK,MAAM,GAAG,GAAG,GAAG,MACzC,EAAK,WAAW,IAAI,GAAG,IAAO,IAAI,MAKhD,IAAc,SAAe,EAAE,cAAW,GAAG,CAAC,GAAa,EAAU,CAAC;AAiF5E,QA9EA,QAAgB;AACT,QAwDL,QAHgB,EAnDY;GAC1B;IACE,IAAI;IACJ,OAAO;IACP,MAAM,EAAS,GAAU,OAAO;IAChC,MAAM,kBAAC,GAAD,EAAW,MAAM,IAAM,CAAA;IAC7B,OAAO;IACP,OAAO;IACR;GAED,GAAI,EAAY,UAAU,sBAAsB,GAC5C,CACE;IACE,IAAI;IACJ,OAAO;IACP,MAAM,EAAS,GAAU,WAAW;IACpC,MAAM,kBAAC,GAAD,EAAc,MAAM,IAAM,CAAA;IAChC,OAAO;IACP,OAAO;IACR,CACF,GACD,EAAE;GAEN,GAAI,EAAY,UAAU,qBAAqB,GAC3C,CACE;IACE,IAAI;IACJ,OAAO;IACP,MAAM,EAAS,GAAU,UAAU;IACnC,MAAM,kBAAC,GAAD,EAAO,MAAM,IAAM,CAAA;IACzB,OAAO;IACP,OAAO;IACR,CACF,GACD,EAAE;GAEN,GAAI,EAAY,UAAU,sBAAsB,GAC5C,CACE;IACE,IAAI;IACJ,OAAO;IACP,MAAM,EAAS,GAAU,WAAW;IACpC,MAAM,kBAAC,GAAD,EAAU,MAAM,IAAM,CAAA;IAC5B,OAAO;IACP,OAAO;IACR,CACF,GACD,EAAE;GACP,CAGyC;IAIzC;EAAC;EAAkB;EAAU;EAAY,CAAC,EAG7C,QAAgB;AACT,QAaL,QADgB,EAVI,CAClB;GACE,IAAI;GACJ,OAAO;GACP,MAAM;GACN,OAAO;GACP,SAAS;GACV,CACF,CAE+C;IAE/C,CAAC,EAAoB,CAAC,EAGvB,kBAAC,GAAD;EAAqB,aAAa;EAAM,SAAQ;EAAS,gBAAgB;YACvE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;GAAoB,GAAI;aACtB,kBAAC,GAAD,EAAoB,CAAA;GACD,CAAA,EACG,CAAA;EACN,CAAA"}
+{"version":3,"file":"WorkspacesRoot.js","names":[],"sources":["../src/WorkspacesRoot.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useEffect, useMemo } from 'react';\nimport { Building2, FolderKanban, Users, Activity } from 'lucide-react';\nimport { useFeatureFlags, FeatureFlagProvider } from '@burdenoff/fe-libs/shared/feature-flags';\nimport { WorkspacesProvider } from './providers/WorkspacesProvider';\nimport { WorkspacesErrorBoundary } from './components/WorkspacesErrorBoundary';\nimport type { NavItem, WorkspacesRootProps } from './types';\nimport { WorkspacesRoutes } from './WorkspacesRoutes';\n\n/**\n * Root component for the Workspaces microfrontend.\n *\n * This is the main entry point that host applications import and render.\n * It sets up the necessary providers and renders the internal routing.\n * Automatically registers navigation items with the shell if registration functions are provided.\n * Nav items for feature-previewed pages (projects, members, activity) are conditionally\n * hidden based on feature flags.\n *\n * @example\n * ```tsx\n * import { WorkspacesRoot } from '@burdenoff/micro-fe/workspaces';\n *\n * function App() {\n *   return (\n *     <Route path=\"/workspaces/*\" element={\n *       <WorkspacesRoot\n *         basePath=\"/workspaces\"\n *         navigate={navigate}\n *         currentUser={user}\n *         workspaceId=\"ws-123\"\n *         tenantId=\"tenant-123\"\n *         apiGatewayUrl=\"https://gw-global.local.burdenoff.com\"\n *         authToken=\"token\"\n *       />\n *     } />\n *   );\n * }\n * ```\n */\nexport const WorkspacesRoot: FC<WorkspacesRootProps> = (props) => {\n  const { registerNavItems, registerFooterItems, basePath = '/' } = props;\n  const { isEnabled, evaluations } = useFeatureFlags();\n\n  // Helper to join paths correctly, avoiding double slashes\n  const joinPath = (base: string, path: string): string => {\n    const cleanBase = base.endsWith('/') ? base.slice(0, -1) : base;\n    const cleanPath = path.startsWith('/') ? path : `/${path}`;\n    return cleanBase + cleanPath;\n  };\n\n  const flagHelpers = useMemo(() => ({ isEnabled, evaluations }), [evaluations, isEnabled]);\n\n  // Register navigation items with the shell\n  useEffect(() => {\n    if (!registerNavItems) return;\n\n    const navItems: NavItem[] = [\n      {\n        id: 'workspaces-all',\n        label: 'All Workspaces',\n        path: joinPath(basePath, 'list'),\n        icon: <Building2 size={20} />,\n        order: 10,\n        group: 'workspaces',\n      },\n      // workspaces.projects — hidden until feature flag is enabled\n      ...(flagHelpers.isEnabled('workspaces.projects')\n        ? [\n            {\n              id: 'workspaces-projects',\n              label: 'Projects',\n              path: joinPath(basePath, 'projects'),\n              icon: <FolderKanban size={20} />,\n              order: 20,\n              group: 'workspaces',\n            },\n          ]\n        : []),\n      // workspaces.members — hidden until feature flag is enabled\n      ...(flagHelpers.isEnabled('workspaces.members')\n        ? [\n            {\n              id: 'workspaces-members',\n              label: 'Members',\n              path: joinPath(basePath, 'members'),\n              icon: <Users size={20} />,\n              order: 30,\n              group: 'workspaces',\n            },\n          ]\n        : []),\n      // workspaces.activity — hidden until feature flag is enabled\n      ...(flagHelpers.isEnabled('workspaces.activity')\n        ? [\n            {\n              id: 'workspaces-activity',\n              label: 'Activity',\n              path: joinPath(basePath, 'activity'),\n              icon: <Activity size={20} />,\n              order: 40,\n              group: 'workspaces',\n            },\n          ]\n        : []),\n    ];\n\n    // Register and get cleanup function\n    const cleanup = registerNavItems(navItems);\n\n    // Return cleanup function to unregister on unmount\n    return cleanup;\n  }, [registerNavItems, basePath, flagHelpers]);\n\n  // Register footer items (example: workspace status in left section)\n  useEffect(() => {\n    if (!registerFooterItems) return;\n\n    const footerItems = [\n      {\n        id: 'workspaces-status',\n        label: 'Workspaces Ready',\n        type: 'status' as const,\n        order: 10,\n        section: 'left' as const,\n      },\n    ];\n\n    const cleanup = registerFooterItems(footerItems);\n    return cleanup;\n  }, [registerFooterItems]);\n\n  return (\n    <FeatureFlagProvider workspaceId={null} gateway=\"global\" defaultEnabled={true}>\n      <WorkspacesErrorBoundary>\n        <WorkspacesProvider {...props}>\n          <WorkspacesRoutes />\n        </WorkspacesProvider>\n      </WorkspacesErrorBoundary>\n    </FeatureFlagProvider>\n  );\n};\n"],"mappings":";;;;;;;;AAuCA,IAAa,KAA2C,MAAU;CAChE,IAAM,EAAE,qBAAkB,wBAAqB,cAAW,QAAQ,GAC5D,EAAE,cAAW,mBAAgB,GAAiB,EAG9C,KAAY,GAAc,OACZ,EAAK,SAAS,IAAI,GAAG,EAAK,MAAM,GAAG,GAAG,GAAG,MACzC,EAAK,WAAW,IAAI,GAAG,IAAO,IAAI,MAIhD,IAAc,SAAe;EAAE;EAAW;EAAa,GAAG,CAAC,GAAa,EAAU,CAAC;AAiFzF,QA9EA,QAAgB;AACT,QAwDL,QAHgB,EAnDY;GAC1B;IACE,IAAI;IACJ,OAAO;IACP,MAAM,EAAS,GAAU,OAAO;IAChC,MAAM,kBAAC,GAAD,EAAW,MAAM,IAAM,CAAA;IAC7B,OAAO;IACP,OAAO;IACR;GAED,GAAI,EAAY,UAAU,sBAAsB,GAC5C,CACE;IACE,IAAI;IACJ,OAAO;IACP,MAAM,EAAS,GAAU,WAAW;IACpC,MAAM,kBAAC,GAAD,EAAc,MAAM,IAAM,CAAA;IAChC,OAAO;IACP,OAAO;IACR,CACF,GACD,EAAE;GAEN,GAAI,EAAY,UAAU,qBAAqB,GAC3C,CACE;IACE,IAAI;IACJ,OAAO;IACP,MAAM,EAAS,GAAU,UAAU;IACnC,MAAM,kBAAC,GAAD,EAAO,MAAM,IAAM,CAAA;IACzB,OAAO;IACP,OAAO;IACR,CACF,GACD,EAAE;GAEN,GAAI,EAAY,UAAU,sBAAsB,GAC5C,CACE;IACE,IAAI;IACJ,OAAO;IACP,MAAM,EAAS,GAAU,WAAW;IACpC,MAAM,kBAAC,GAAD,EAAU,MAAM,IAAM,CAAA;IAC5B,OAAO;IACP,OAAO;IACR,CACF,GACD,EAAE;GACP,CAGyC;IAIzC;EAAC;EAAkB;EAAU;EAAY,CAAC,EAG7C,QAAgB;AACT,QAaL,QADgB,EAVI,CAClB;GACE,IAAI;GACJ,OAAO;GACP,MAAM;GACN,OAAO;GACP,SAAS;GACV,CACF,CAE+C;IAE/C,CAAC,EAAoB,CAAC,EAGvB,kBAAC,GAAD;EAAqB,aAAa;EAAM,SAAQ;EAAS,gBAAgB;YACvE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;GAAoB,GAAI;aACtB,kBAAC,GAAD,EAAoB,CAAA;GACD,CAAA,EACG,CAAA;EACN,CAAA"}

package/dist/WorkspacesRoutes.js

@@ -9,7 +9,7 @@ var u = r(() => import("./pages/CreateWorkspacePage.js").then((e) => ({ default:
 function v() {
 	return /* @__PURE__ */ a("div", {
 		className: "flex items-center justify-center h-64",
-		children: /* @__PURE__ */ a("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-primary" })
+		children: /* @__PURE__ */ a("div", { className: "animate-spin rounded-full size-8 border-b-2 border-primary" })
 	});
 }
 function y() {
@@ -72,15 +72,15 @@ function S() {
 			}),
 			/* @__PURE__ */ a(c, {
 				path: "projects",
-				element: b("workspaces.projects", /* @__PURE__ */ a(p, {}))
+				element: /* @__PURE__ */ a(p, {})
 			}),
 			/* @__PURE__ */ a(c, {
 				path: ":workspaceId/projects",
-				element: b("workspaces.projects", /* @__PURE__ */ a(p, {}))
+				element: /* @__PURE__ */ a(p, {})
 			}),
 			/* @__PURE__ */ a(c, {
 				path: ":workspaceId/projects/:projectId",
-				element: b("workspaces.projects", /* @__PURE__ */ a(m, {}))
+				element: /* @__PURE__ */ a(m, {})
 			}),
 			/* @__PURE__ */ a(c, {
 				path: "members",

package/dist/WorkspacesRoutes.js.map

@@ -1 +1 @@
-{"version":3,"file":"WorkspacesRoutes.js","names":[],"sources":["../src/WorkspacesRoutes.tsx"],"sourcesContent":["import { lazy, Suspense } from 'react';\nimport { Routes, Route, Navigate } from 'react-router-dom';\nimport { FeatureGate } from '@burdenoff/fe-libs/shared/feature-flags';\nimport { useWorkspacesContext } from './providers/WorkspacesProvider';\n\n// Eager load - main entry point\nimport { WorkspacesListPage } from './pages/WorkspacesListPage';\n\n// Lazy load - secondary pages\nconst CreateWorkspacePage = lazy(() =>\n  import('./pages/CreateWorkspacePage').then((m) => ({ default: m.CreateWorkspacePage }))\n);\nconst WorkspaceDetailPage = lazy(() =>\n  import('./pages/WorkspaceDetailPage').then((m) => ({ default: m.WorkspaceDetailPage }))\n);\nconst WorkspaceSettingsPage = lazy(() =>\n  import('./pages/WorkspaceSettingsPage').then((m) => ({ default: m.WorkspaceSettingsPage }))\n);\nconst ProjectsListPage = lazy(() =>\n  import('./pages/ProjectsListPage').then((m) => ({ default: m.ProjectsListPage }))\n);\nconst ProjectDetailPage = lazy(() =>\n  import('./pages/ProjectDetailPage').then((m) => ({ default: m.ProjectDetailPage }))\n);\nconst MembersListPage = lazy(() =>\n  import('./pages/MembersListPage').then((m) => ({ default: m.MembersListPage }))\n);\nconst ActivityListPage = lazy(() =>\n  import('./pages/ActivityListPage').then((m) => ({ default: m.ActivityListPage }))\n);\nconst InviteAcceptancePage = lazy(() =>\n  import('./pages/InviteAcceptancePage').then((m) => ({ default: m.InviteAcceptancePage }))\n);\n\n/**\n * Loading fallback for lazy-loaded components\n */\nfunction PageLoader() {\n  return (\n    <div className=\"flex items-center justify-center h-64\">\n      <div className=\"animate-spin rounded-full h-8 w-8 border-b-2 border-primary\" />\n    </div>\n  );\n}\n\n/**\n * Fallback shown when a feature-gated route is disabled.\n */\nfunction FeatureDisabledFallback() {\n  return (\n    <div className=\"flex h-full items-center justify-center p-8 text-center\">\n      <div>\n        <h2 className=\"text-lg font-semibold mb-2 text-text-primary\">Feature Not Available</h2>\n        <p className=\"text-sm text-text-secondary\">\n          This feature is not currently available. Enable it under Feature Previews to access this\n          functionality.\n        </p>\n      </div>\n    </div>\n  );\n}\n\n/**\n * Helper: wraps a page element in a FeatureGate.\n * defaultValue=false → hidden until explicitly enabled (unreleased feature).\n */\nfunction gated(flag: string, element: React.ReactNode, defaultValue = false): React.ReactElement {\n  return (\n    <FeatureGate flag={flag} defaultValue={defaultValue} fallback={<FeatureDisabledFallback />}>\n      {element}\n    </FeatureGate>\n  );\n}\n\n/**\n * Catch-all redirect component that uses the basePath from context\n * to navigate to an absolute path, preventing infinite redirect loops.\n */\nfunction CatchAllRedirect() {\n  const { basePath = '/workspaces' } = useWorkspacesContext();\n  return <Navigate to={`${basePath}/list`} replace />;\n}\n\n/**\n * Internal routing for the Workspaces microfrontend.\n * Defines all routes and their corresponding page components.\n *\n * - WorkspacesListPage: Eager loaded (main entry point)\n * - All other pages: Lazy loaded for better performance\n * - Projects, Members, Activity: gated by feature flags (unreleased)\n */\nexport function WorkspacesRoutes() {\n  return (\n    <Suspense fallback={<PageLoader />}>\n      <Routes>\n        {/* Default redirect */}\n        <Route index element={<Navigate to=\"list\" replace />} />\n\n        {/* Workspaces List - Eager loaded */}\n        <Route path=\"list\" element={<WorkspacesListPage />} />\n\n        {/* Create Workspace (must come before :workspaceId to avoid conflicts) */}\n        <Route path=\"new\" element={<CreateWorkspacePage />} />\n\n        {/* Invitation Acceptance (must come before :workspaceId to avoid conflicts) */}\n        <Route path=\"invite/:invitationId\" element={<InviteAcceptancePage />} />\n\n        {/* Workspace Detail */}\n        <Route path=\":workspaceId\" element={<WorkspaceDetailPage />} />\n        <Route\n          path=\":workspaceId/settings\"\n          element={gated('workspaces.settings', <WorkspaceSettingsPage />, true)}\n        />\n\n        {/* Projects — gated by workspaces.projects */}\n        <Route path=\"projects\" element={gated('workspaces.projects', <ProjectsListPage />)} />\n        <Route\n          path=\":workspaceId/projects\"\n          element={gated('workspaces.projects', <ProjectsListPage />)}\n        />\n        <Route\n          path=\":workspaceId/projects/:projectId\"\n          element={gated('workspaces.projects', <ProjectDetailPage />)}\n        />\n\n        {/* Members — gated by workspaces.members */}\n        <Route path=\"members\" element={gated('workspaces.members', <MembersListPage />, true)} />\n        <Route\n          path=\":workspaceId/members\"\n          element={gated('workspaces.members', <MembersListPage />, true)}\n        />\n\n        {/* Activity — gated by workspaces.activity */}\n        <Route path=\"activity\" element={gated('workspaces.activity', <ActivityListPage />)} />\n        <Route\n          path=\":workspaceId/activity\"\n          element={gated('workspaces.activity', <ActivityListPage />)}\n        />\n\n        {/* Catch-all redirect - uses absolute path to prevent infinite loops */}\n        <Route path=\"*\" element={<CatchAllRedirect />} />\n      </Routes>\n    </Suspense>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"WorkspacesRoutes.js","names":[],"sources":["../src/WorkspacesRoutes.tsx"],"sourcesContent":["import { lazy, Suspense } from 'react';\nimport { Routes, Route, Navigate } from 'react-router-dom';\nimport { FeatureGate } from '@burdenoff/fe-libs/shared/feature-flags';\nimport { useWorkspacesContext } from './providers/WorkspacesProvider';\n\n// Eager load - main entry point\nimport { WorkspacesListPage } from './pages/WorkspacesListPage';\n\n// Lazy load - secondary pages\nconst CreateWorkspacePage = lazy(() =>\n  import('./pages/CreateWorkspacePage').then((m) => ({ default: m.CreateWorkspacePage }))\n);\nconst WorkspaceDetailPage = lazy(() =>\n  import('./pages/WorkspaceDetailPage').then((m) => ({ default: m.WorkspaceDetailPage }))\n);\nconst WorkspaceSettingsPage = lazy(() =>\n  import('./pages/WorkspaceSettingsPage').then((m) => ({ default: m.WorkspaceSettingsPage }))\n);\nconst ProjectsListPage = lazy(() =>\n  import('./pages/ProjectsListPage').then((m) => ({ default: m.ProjectsListPage }))\n);\nconst ProjectDetailPage = lazy(() =>\n  import('./pages/ProjectDetailPage').then((m) => ({ default: m.ProjectDetailPage }))\n);\nconst MembersListPage = lazy(() =>\n  import('./pages/MembersListPage').then((m) => ({ default: m.MembersListPage }))\n);\nconst ActivityListPage = lazy(() =>\n  import('./pages/ActivityListPage').then((m) => ({ default: m.ActivityListPage }))\n);\nconst InviteAcceptancePage = lazy(() =>\n  import('./pages/InviteAcceptancePage').then((m) => ({ default: m.InviteAcceptancePage }))\n);\n\n/**\n * Loading fallback for lazy-loaded components\n */\nfunction PageLoader() {\n  return (\n    <div className=\"flex items-center justify-center h-64\">\n      <div className=\"animate-spin rounded-full size-8 border-b-2 border-primary\" />\n    </div>\n  );\n}\n\n/**\n * Fallback shown when a feature-gated route is disabled.\n */\nfunction FeatureDisabledFallback() {\n  return (\n    <div className=\"flex h-full items-center justify-center p-8 text-center\">\n      <div>\n        <h2 className=\"text-lg font-semibold mb-2 text-text-primary\">Feature Not Available</h2>\n        <p className=\"text-sm text-text-secondary\">\n          This feature is not currently available. Enable it under Feature Previews to access this\n          functionality.\n        </p>\n      </div>\n    </div>\n  );\n}\n\n/**\n * Helper: wraps a page element in a FeatureGate.\n * defaultValue=false → hidden until explicitly enabled (unreleased feature).\n */\nfunction gated(flag: string, element: React.ReactNode, defaultValue = false): React.ReactElement {\n  return (\n    <FeatureGate flag={flag} defaultValue={defaultValue} fallback={<FeatureDisabledFallback />}>\n      {element}\n    </FeatureGate>\n  );\n}\n\n/**\n * Catch-all redirect component that uses the basePath from context\n * to navigate to an absolute path, preventing infinite redirect loops.\n */\nfunction CatchAllRedirect() {\n  const { basePath = '/workspaces' } = useWorkspacesContext();\n  return <Navigate to={`${basePath}/list`} replace />;\n}\n\n/**\n * Internal routing for the Workspaces microfrontend.\n * Defines all routes and their corresponding page components.\n *\n * - WorkspacesListPage: Eager loaded (main entry point)\n * - All other pages: Lazy loaded for better performance\n * - Projects, Members, Activity: gated by feature flags (unreleased)\n */\nexport function WorkspacesRoutes() {\n  return (\n    <Suspense fallback={<PageLoader />}>\n      <Routes>\n        {/* Default redirect */}\n        <Route index element={<Navigate to=\"list\" replace />} />\n\n        {/* Workspaces List - Eager loaded */}\n        <Route path=\"list\" element={<WorkspacesListPage />} />\n\n        {/* Create Workspace (must come before :workspaceId to avoid conflicts) */}\n        <Route path=\"new\" element={<CreateWorkspacePage />} />\n\n        {/* Invitation Acceptance (must come before :workspaceId to avoid conflicts) */}\n        <Route path=\"invite/:invitationId\" element={<InviteAcceptancePage />} />\n\n        {/* Workspace Detail */}\n        <Route path=\":workspaceId\" element={<WorkspaceDetailPage />} />\n        <Route\n          path=\":workspaceId/settings\"\n          element={gated('workspaces.settings', <WorkspaceSettingsPage />, true)}\n        />\n\n        {/* Projects — core feature, never gated */}\n        <Route path=\"projects\" element={<ProjectsListPage />} />\n        <Route path=\":workspaceId/projects\" element={<ProjectsListPage />} />\n        <Route path=\":workspaceId/projects/:projectId\" element={<ProjectDetailPage />} />\n\n        {/* Members — gated by workspaces.members */}\n        <Route path=\"members\" element={gated('workspaces.members', <MembersListPage />, true)} />\n        <Route\n          path=\":workspaceId/members\"\n          element={gated('workspaces.members', <MembersListPage />, true)}\n        />\n\n        {/* Activity — gated by workspaces.activity */}\n        <Route path=\"activity\" element={gated('workspaces.activity', <ActivityListPage />)} />\n        <Route\n          path=\":workspaceId/activity\"\n          element={gated('workspaces.activity', <ActivityListPage />)}\n        />\n\n        {/* Catch-all redirect - uses absolute path to prevent infinite loops */}\n        <Route path=\"*\" element={<CatchAllRedirect />} />\n      </Routes>\n    </Suspense>\n  );\n}\n"],"mappings":"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"}

package/dist/components/CreateProjectDialog.js

@@ -1,7 +1,7 @@
 import { useWorkspacesStore as e } from "../store/workspacesStore.js";
 import { useCreateProject as t } from "../hooks/useProjectMutations.js";
 import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import { Button as i, Dialog as a, DialogContent as o, DialogDescription as s, DialogHeader as c, DialogTitle as l } from "@burdenoff/fe-libs/ui";
+import { Button as i, ResponsiveDialog as a, ResponsiveDialogContent as o, ResponsiveDialogDescription as s, ResponsiveDialogHeader as c, ResponsiveDialogTitle as l } from "@burdenoff/fe-libs/ui";
 import { FormControl as u, FormDescription as d, FormField as f, FormItem as p, FormLabel as m, FormMessage as h, FormProvider as g, Input as _, Textarea as v, useForm as y, z as b } from "@burdenoff/fe-libs/form";
 //#region src/components/CreateProjectDialog.tsx
 var x = b.object({

package/dist/components/CreateProjectDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"CreateProjectDialog.js","names":[],"sources":["../../src/components/CreateProjectDialog.tsx"],"sourcesContent":["import {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogHeader,\n  DialogTitle,\n  Button,\n} from '@burdenoff/fe-libs/ui';\nimport {\n  FormField,\n  FormItem,\n  FormLabel,\n  FormControl,\n  FormMessage,\n  FormDescription,\n  Input,\n  Textarea,\n  useForm,\n  FormProvider,\n  z,\n} from '@burdenoff/fe-libs/form';\nimport { useWorkspacesStore } from '../store/workspacesStore';\nimport { useCreateProject } from '../hooks/useProjectMutations';\n\nconst createProjectSchema = z.object({\n  name: z\n    .string()\n    .min(2, 'Name must be at least 2 characters')\n    .max(100, 'Name must be less than 100 characters'),\n  key: z\n    .string()\n    .min(2, 'Key must be at least 2 characters')\n    .max(10, 'Key must be less than 10 characters')\n    .regex(/^[A-Z0-9_-]+$/, 'Key must be uppercase letters, numbers, underscores, or hyphens'),\n  description: z.string().optional(),\n});\n\ntype CreateProjectFormData = z.infer<typeof createProjectSchema>;\n\ninterface CreateProjectDialogProps {\n  workspaceId?: string;\n}\n\nexport function CreateProjectDialog({ workspaceId }: CreateProjectDialogProps) {\n  const { isCreateProjectDialogOpen, closeCreateProjectDialog } = useWorkspacesStore();\n  const { mutate: createProject, isPending } = useCreateProject(workspaceId);\n\n  const form = useForm({\n    schema: createProjectSchema,\n    defaultValues: {\n      name: '',\n      key: '',\n      description: '',\n    },\n  });\n\n  const onSubmit = (data: CreateProjectFormData) => {\n    const input = {\n      name: data.name,\n      key: data.key,\n      config: data.description ? { description: data.description } : undefined,\n    };\n\n    createProject(input, {\n      onSuccess: () => {\n        closeCreateProjectDialog();\n        form.reset();\n      },\n      onError: (error) => {\n        console.error('Failed to create project:', error);\n      },\n    });\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    if (!open) {\n      closeCreateProjectDialog();\n      form.reset();\n    }\n  };\n\n  // Auto-generate key from name\n  const handleNameChange = (name: string) => {\n    const autoKey = name\n      .toUpperCase()\n      .replace(/[^A-Z0-9\\s]/g, '')\n      .replace(/\\s+/g, '_')\n      .slice(0, 10);\n\n    if (!form.getValues('key')) {\n      form.setValue('key', autoKey);\n    }\n  };\n\n  return (\n    <Dialog open={isCreateProjectDialogOpen} onOpenChange={handleOpenChange}>\n      <DialogContent className=\"sm:max-w-[500px]\">\n        <DialogHeader>\n          <DialogTitle>Create Project</DialogTitle>\n          <DialogDescription>\n            Create a new project in your workspace. Projects help organize your work.\n          </DialogDescription>\n        </DialogHeader>\n\n        <FormProvider {...form}>\n          <form onSubmit={form.handleSubmit(onSubmit)} className=\"space-y-4\">\n            <FormField\n              control={form.control}\n              name=\"name\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Project Name</FormLabel>\n                  <FormControl>\n                    <Input\n                      {...field}\n                      placeholder=\"My Project\"\n                      onChange={(e) => {\n                        field.onChange(e);\n                        handleNameChange(e.target.value);\n                      }}\n                    />\n                  </FormControl>\n                  <FormDescription>A descriptive name for your project</FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <FormField\n              control={form.control}\n              name=\"key\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Project Key</FormLabel>\n                  <FormControl>\n                    <Input {...field} placeholder=\"MYPROJ\" />\n                  </FormControl>\n                  <FormDescription>\n                    Short identifier (uppercase letters, numbers, underscores)\n                  </FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <FormField\n              control={form.control}\n              name=\"description\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Description (Optional)</FormLabel>\n                  <FormControl>\n                    <Textarea {...field} placeholder=\"Brief description of the project\" rows={3} />\n                  </FormControl>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <div className=\"flex justify-end gap-3 pt-4\">\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                onClick={() => handleOpenChange(false)}\n                disabled={isPending}\n              >\n                Cancel\n              </Button>\n              <Button type=\"submit\" disabled={isPending}>\n                {isPending ? 'Creating...' : 'Create Project'}\n              </Button>\n            </div>\n          </form>\n        </FormProvider>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"CreateProjectDialog.js","names":[],"sources":["../../src/components/CreateProjectDialog.tsx"],"sourcesContent":["import {\n  ResponsiveDialog,\n  ResponsiveDialogContent,\n  ResponsiveDialogDescription,\n  ResponsiveDialogHeader,\n  ResponsiveDialogTitle,\n  Button,\n} from '@burdenoff/fe-libs/ui';\nimport {\n  FormField,\n  FormItem,\n  FormLabel,\n  FormControl,\n  FormMessage,\n  FormDescription,\n  Input,\n  Textarea,\n  useForm,\n  FormProvider,\n  z,\n} from '@burdenoff/fe-libs/form';\nimport { useWorkspacesStore } from '../store/workspacesStore';\nimport { useCreateProject } from '../hooks/useProjectMutations';\n\nconst createProjectSchema = z.object({\n  name: z\n    .string()\n    .min(2, 'Name must be at least 2 characters')\n    .max(100, 'Name must be less than 100 characters'),\n  key: z\n    .string()\n    .min(2, 'Key must be at least 2 characters')\n    .max(10, 'Key must be less than 10 characters')\n    .regex(/^[A-Z0-9_-]+$/, 'Key must be uppercase letters, numbers, underscores, or hyphens'),\n  description: z.string().optional(),\n});\n\ntype CreateProjectFormData = z.infer<typeof createProjectSchema>;\n\ninterface CreateProjectDialogProps {\n  workspaceId?: string;\n}\n\nexport function CreateProjectDialog({ workspaceId }: CreateProjectDialogProps) {\n  const { isCreateProjectDialogOpen, closeCreateProjectDialog } = useWorkspacesStore();\n  const { mutate: createProject, isPending } = useCreateProject(workspaceId);\n\n  const form = useForm({\n    schema: createProjectSchema,\n    defaultValues: {\n      name: '',\n      key: '',\n      description: '',\n    },\n  });\n\n  const onSubmit = (data: CreateProjectFormData) => {\n    const input = {\n      name: data.name,\n      key: data.key,\n      config: data.description ? { description: data.description } : undefined,\n    };\n\n    createProject(input, {\n      onSuccess: () => {\n        closeCreateProjectDialog();\n        form.reset();\n      },\n      onError: (error) => {\n        console.error('Failed to create project:', error);\n      },\n    });\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    if (!open) {\n      closeCreateProjectDialog();\n      form.reset();\n    }\n  };\n\n  // Auto-generate key from name\n  const handleNameChange = (name: string) => {\n    const autoKey = name\n      .toUpperCase()\n      .replace(/[^A-Z0-9\\s]/g, '')\n      .replace(/\\s+/g, '_')\n      .slice(0, 10);\n\n    if (!form.getValues('key')) {\n      form.setValue('key', autoKey);\n    }\n  };\n\n  return (\n    <ResponsiveDialog open={isCreateProjectDialogOpen} onOpenChange={handleOpenChange}>\n      <ResponsiveDialogContent className=\"sm:max-w-[500px]\">\n        <ResponsiveDialogHeader>\n          <ResponsiveDialogTitle>Create Project</ResponsiveDialogTitle>\n          <ResponsiveDialogDescription>\n            Create a new project in your workspace. Projects help organize your work.\n          </ResponsiveDialogDescription>\n        </ResponsiveDialogHeader>\n\n        <FormProvider {...form}>\n          <form onSubmit={form.handleSubmit(onSubmit)} className=\"space-y-4\">\n            <FormField\n              control={form.control}\n              name=\"name\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Project Name</FormLabel>\n                  <FormControl>\n                    <Input\n                      {...field}\n                      placeholder=\"My Project\"\n                      onChange={(e) => {\n                        field.onChange(e);\n                        handleNameChange(e.target.value);\n                      }}\n                    />\n                  </FormControl>\n                  <FormDescription>A descriptive name for your project</FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <FormField\n              control={form.control}\n              name=\"key\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Project Key</FormLabel>\n                  <FormControl>\n                    <Input {...field} placeholder=\"MYPROJ\" />\n                  </FormControl>\n                  <FormDescription>\n                    Short identifier (uppercase letters, numbers, underscores)\n                  </FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <FormField\n              control={form.control}\n              name=\"description\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Description (Optional)</FormLabel>\n                  <FormControl>\n                    <Textarea {...field} placeholder=\"Brief description of the project\" rows={3} />\n                  </FormControl>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <div className=\"flex justify-end gap-3 pt-4\">\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                onClick={() => handleOpenChange(false)}\n                disabled={isPending}\n              >\n                Cancel\n              </Button>\n              <Button type=\"submit\" disabled={isPending}>\n                {isPending ? 'Creating...' : 'Create Project'}\n              </Button>\n            </div>\n          </form>\n        </FormProvider>\n      </ResponsiveDialogContent>\n    </ResponsiveDialog>\n  );\n}\n"],"mappings":"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"}

package/dist/components/CreateWorkspaceDialog.js

@@ -5,7 +5,7 @@ import { generateSlug as i } from "../utils/slug.js";
 import { useEffect as a, useMemo as o } from "react";
 import { AlertCircle as s } from "lucide-react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
-import { Button as u, Dialog as d, DialogContent as f, DialogFooter as p, DialogHeader as m, DialogTitle as h, Skeleton as g } from "@burdenoff/fe-libs/ui";
+import { Button as u, ResponsiveDialog as d, ResponsiveDialogContent as f, ResponsiveDialogFooter as p, ResponsiveDialogHeader as m, ResponsiveDialogTitle as h, Skeleton as g } from "@burdenoff/fe-libs/ui";
 import { FormControl as _, FormDescription as v, FormField as y, FormItem as b, FormLabel as x, FormMessage as S, FormProvider as C, Input as w, Select as T, SelectContent as E, SelectItem as D, SelectTrigger as O, SelectValue as k, useForm as A, z as j } from "@burdenoff/fe-libs/form";
 //#region src/components/CreateWorkspaceDialog.tsx
 var M = j.object({
@@ -16,7 +16,7 @@ var M = j.object({
 	type: j.enum(["TEAM", "PERSONAL"]).optional()
 });
 function N() {
-	let { isCreateWorkspaceDialogOpen: j, closeCreateWorkspaceDialog: N } = e(), { mutate: P, isPending: F } = t(), { data: I, isLoading: L, error: R } = r(), { data: z, isLoading: B, error: V } = n(), H = I?.items ?? [], U = z?.items ?? [], W = A({
+	let { isCreateWorkspaceDialogOpen: j, closeCreateWorkspaceDialog: N } = e(), { mutate: P, isPending: F } = t(), { data: I, isLoading: L, error: R } = r(), { data: z, isLoading: B, error: V } = n(), H = o(() => I?.items ?? [], [I]), U = o(() => z?.items ?? [], [z]), W = A({
 		schema: M,
 		defaultValues: {
 			name: "",

package/dist/components/CreateWorkspaceDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"CreateWorkspaceDialog.js","names":[],"sources":["../../src/components/CreateWorkspaceDialog.tsx"],"sourcesContent":["import { useEffect, useMemo } from 'react';\nimport { AlertCircle } from 'lucide-react';\nimport {\n  Dialog,\n  DialogContent,\n  DialogHeader,\n  DialogTitle,\n  DialogFooter,\n  Button,\n  Skeleton,\n} from '@burdenoff/fe-libs/ui';\nimport {\n  FormField,\n  FormItem,\n  FormLabel,\n  FormControl,\n  FormMessage,\n  FormDescription,\n  Input,\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n  useForm,\n  FormProvider,\n  z,\n} from '@burdenoff/fe-libs/form';\nimport { useWorkspacesStore } from '../store/workspacesStore';\nimport { useCreateWorkspace } from '../hooks/useWorkspaceMutations';\nimport { useMyTenants, useMyOrganizations } from '../hooks/useTenants';\nimport { generateSlug } from '../utils/slug';\n\nconst createWorkspaceSchema = z.object({\n  name: z.string().min(2, 'Name must be at least 2 characters').max(100),\n  slug: z\n    .string()\n    .min(2, 'Slug must be at least 2 characters')\n    .max(50)\n    .regex(/^[a-z0-9-]+$/, 'Slug can only contain lowercase letters, numbers, and hyphens'),\n  tenantId: z.string().min(1, 'Please select a tenant'),\n  organizationId: z.string().min(1, 'Please select an organization'),\n  type: z.enum(['TEAM', 'PERSONAL']).optional(),\n});\n\ntype CreateWorkspaceFormData = z.infer<typeof createWorkspaceSchema>;\n\nexport function CreateWorkspaceDialog() {\n  const { isCreateWorkspaceDialogOpen, closeCreateWorkspaceDialog } = useWorkspacesStore();\n  const { mutate: createWorkspace, isPending } = useCreateWorkspace();\n  const { data: tenantsData, isLoading: isLoadingTenants, error: tenantsError } = useMyTenants();\n  const {\n    data: organizationsData,\n    isLoading: isLoadingOrganizations,\n    error: organizationsError,\n  } = useMyOrganizations();\n\n  const tenants = tenantsData?.items ?? [];\n  const allOrganizations = organizationsData?.items ?? [];\n\n  const form = useForm<CreateWorkspaceFormData>({\n    schema: createWorkspaceSchema,\n    defaultValues: {\n      name: '',\n      slug: '',\n      tenantId: '',\n      organizationId: '',\n      type: 'TEAM',\n    },\n  });\n\n  const selectedTenantId = form.watch('tenantId');\n  const workspaceName = form.watch('name');\n\n  // Filter organizations by selected tenant\n  const filteredOrganizations = useMemo(() => {\n    if (!selectedTenantId) return [];\n    return allOrganizations.filter((org) => org.tenantId === selectedTenantId);\n  }, [selectedTenantId, allOrganizations]);\n\n  // Auto-generate slug from name (clear when name is empty)\n  useEffect(() => {\n    form.setValue('slug', workspaceName ? generateSlug(workspaceName) : '');\n  }, [workspaceName, form]);\n\n  // Reset organizationId when tenant changes\n  useEffect(() => {\n    form.setValue('organizationId', '');\n  }, [selectedTenantId, form]);\n\n  const onSubmit = (data: CreateWorkspaceFormData) => {\n    createWorkspace(\n      {\n        name: data.name,\n        slug: data.slug,\n        tenantId: data.tenantId,\n        organizationId: data.organizationId,\n        type: data.type,\n      },\n      {\n        onSuccess: () => {\n          closeCreateWorkspaceDialog();\n          form.reset();\n        },\n      }\n    );\n  };\n\n  return (\n    <Dialog open={isCreateWorkspaceDialogOpen} onOpenChange={closeCreateWorkspaceDialog}>\n      <DialogContent className=\"sm:max-w-[500px]\">\n        <DialogHeader>\n          <DialogTitle>Create Workspace</DialogTitle>\n        </DialogHeader>\n\n        <FormProvider {...form}>\n          <form onSubmit={form.handleSubmit(onSubmit)} className=\"space-y-4\">\n            {/* Workspace Name */}\n            <FormField\n              control={form.control}\n              name=\"name\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Workspace Name *</FormLabel>\n                  <FormControl>\n                    <Input placeholder=\"My Workspace\" {...field} />\n                  </FormControl>\n                  <FormDescription>A descriptive name for your workspace</FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            {/* Slug */}\n            <FormField\n              control={form.control}\n              name=\"slug\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Slug *</FormLabel>\n                  <FormControl>\n                    <Input placeholder=\"my-workspace\" {...field} />\n                  </FormControl>\n                  <FormDescription>URL-friendly identifier (auto-generated)</FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            {/* Tenant Selection */}\n            <FormField\n              control={form.control}\n              name=\"tenantId\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Tenant *</FormLabel>\n                  {isLoadingTenants ? (\n                    <Skeleton className=\"h-10 w-full\" />\n                  ) : tenantsError ? (\n                    <div className=\"flex items-center gap-2 text-destructive text-sm\">\n                      <AlertCircle size={16} />\n                      Failed to load tenants\n                    </div>\n                  ) : tenants.length === 0 ? (\n                    <div className=\"text-muted-foreground text-sm\">\n                      No tenants available. Contact your administrator.\n                    </div>\n                  ) : (\n                    <Select onValueChange={field.onChange} value={field.value}>\n                      <FormControl>\n                        <SelectTrigger>\n                          <SelectValue placeholder=\"Select a tenant\" />\n                        </SelectTrigger>\n                      </FormControl>\n                      <SelectContent>\n                        {tenants.map((tenant) => (\n                          <SelectItem key={tenant.id} value={tenant.id}>\n                            {tenant.name}\n                          </SelectItem>\n                        ))}\n                      </SelectContent>\n                    </Select>\n                  )}\n                  <FormDescription>Select which tenant this workspace belongs to</FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            {/* Organization Selection */}\n            <FormField\n              control={form.control}\n              name=\"organizationId\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Organization *</FormLabel>\n                  {isLoadingOrganizations ? (\n                    <Skeleton className=\"h-10 w-full\" />\n                  ) : organizationsError ? (\n                    <div className=\"flex items-center gap-2 text-destructive text-sm\">\n                      <AlertCircle size={16} />\n                      Failed to load organizations\n                    </div>\n                  ) : !selectedTenantId ? (\n                    <div className=\"text-muted-foreground text-sm\">\n                      Please select a tenant first\n                    </div>\n                  ) : filteredOrganizations.length === 0 ? (\n                    <div className=\"text-muted-foreground text-sm\">\n                      No organizations found for this tenant\n                    </div>\n                  ) : (\n                    <Select\n                      onValueChange={field.onChange}\n                      value={field.value}\n                      disabled={!selectedTenantId}\n                    >\n                      <FormControl>\n                        <SelectTrigger>\n                          <SelectValue placeholder=\"Select an organization\" />\n                        </SelectTrigger>\n                      </FormControl>\n                      <SelectContent>\n                        {filteredOrganizations.map((org) => (\n                          <SelectItem key={org.id} value={org.id}>\n                            {org.name}\n                          </SelectItem>\n                        ))}\n                      </SelectContent>\n                    </Select>\n                  )}\n                  <FormDescription>Select which organization owns this workspace</FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            {/* Workspace Type */}\n            <FormField\n              control={form.control}\n              name=\"type\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Workspace Type</FormLabel>\n                  <Select onValueChange={field.onChange} defaultValue={field.value}>\n                    <FormControl>\n                      <SelectTrigger>\n                        <SelectValue placeholder=\"Select type\" />\n                      </SelectTrigger>\n                    </FormControl>\n                    <SelectContent>\n                      <SelectItem value=\"TEAM\">Team Workspace</SelectItem>\n                      <SelectItem value=\"PERSONAL\">Personal Workspace</SelectItem>\n                    </SelectContent>\n                  </Select>\n                  <FormDescription>\n                    Choose between a collaborative workspace or a personal one\n                  </FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <DialogFooter>\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                onClick={closeCreateWorkspaceDialog}\n                disabled={isPending}\n              >\n                Cancel\n              </Button>\n              <Button\n                type=\"submit\"\n                disabled={isPending || isLoadingTenants || isLoadingOrganizations}\n              >\n                {isPending ? 'Creating...' : 'Create Workspace'}\n              </Button>\n            </DialogFooter>\n          </form>\n        </FormProvider>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"CreateWorkspaceDialog.js","names":[],"sources":["../../src/components/CreateWorkspaceDialog.tsx"],"sourcesContent":["import { useEffect, useMemo } from 'react';\nimport { AlertCircle } from 'lucide-react';\nimport {\n  ResponsiveDialog,\n  ResponsiveDialogContent,\n  ResponsiveDialogHeader,\n  ResponsiveDialogTitle,\n  ResponsiveDialogFooter,\n  Button,\n  Skeleton,\n} from '@burdenoff/fe-libs/ui';\nimport {\n  FormField,\n  FormItem,\n  FormLabel,\n  FormControl,\n  FormMessage,\n  FormDescription,\n  Input,\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n  useForm,\n  FormProvider,\n  z,\n} from '@burdenoff/fe-libs/form';\nimport { useWorkspacesStore } from '../store/workspacesStore';\nimport { useCreateWorkspace } from '../hooks/useWorkspaceMutations';\nimport { useMyTenants, useMyOrganizations } from '../hooks/useTenants';\nimport { generateSlug } from '../utils/slug';\n\nconst createWorkspaceSchema = z.object({\n  name: z.string().min(2, 'Name must be at least 2 characters').max(100),\n  slug: z\n    .string()\n    .min(2, 'Slug must be at least 2 characters')\n    .max(50)\n    .regex(/^[a-z0-9-]+$/, 'Slug can only contain lowercase letters, numbers, and hyphens'),\n  tenantId: z.string().min(1, 'Please select a tenant'),\n  organizationId: z.string().min(1, 'Please select an organization'),\n  type: z.enum(['TEAM', 'PERSONAL']).optional(),\n});\n\ntype CreateWorkspaceFormData = z.infer<typeof createWorkspaceSchema>;\n\nexport function CreateWorkspaceDialog() {\n  const { isCreateWorkspaceDialogOpen, closeCreateWorkspaceDialog } = useWorkspacesStore();\n  const { mutate: createWorkspace, isPending } = useCreateWorkspace();\n  const { data: tenantsData, isLoading: isLoadingTenants, error: tenantsError } = useMyTenants();\n  const {\n    data: organizationsData,\n    isLoading: isLoadingOrganizations,\n    error: organizationsError,\n  } = useMyOrganizations();\n\n  const tenants = useMemo(() => tenantsData?.items ?? [], [tenantsData]);\n  const allOrganizations = useMemo(() => organizationsData?.items ?? [], [organizationsData]);\n\n  const form = useForm<CreateWorkspaceFormData>({\n    schema: createWorkspaceSchema,\n    defaultValues: {\n      name: '',\n      slug: '',\n      tenantId: '',\n      organizationId: '',\n      type: 'TEAM',\n    },\n  });\n\n  const selectedTenantId = form.watch('tenantId');\n  const workspaceName = form.watch('name');\n\n  // Filter organizations by selected tenant\n  const filteredOrganizations = useMemo(() => {\n    if (!selectedTenantId) return [];\n    return allOrganizations.filter((org) => org.tenantId === selectedTenantId);\n  }, [selectedTenantId, allOrganizations]);\n\n  // Auto-generate slug from name (clear when name is empty)\n  useEffect(() => {\n    form.setValue('slug', workspaceName ? generateSlug(workspaceName) : '');\n  }, [workspaceName, form]);\n\n  // Reset organizationId when tenant changes\n  useEffect(() => {\n    form.setValue('organizationId', '');\n  }, [selectedTenantId, form]);\n\n  const onSubmit = (data: CreateWorkspaceFormData) => {\n    createWorkspace(\n      {\n        name: data.name,\n        slug: data.slug,\n        tenantId: data.tenantId,\n        organizationId: data.organizationId,\n        type: data.type,\n      },\n      {\n        onSuccess: () => {\n          closeCreateWorkspaceDialog();\n          form.reset();\n        },\n      }\n    );\n  };\n\n  return (\n    <ResponsiveDialog open={isCreateWorkspaceDialogOpen} onOpenChange={closeCreateWorkspaceDialog}>\n      <ResponsiveDialogContent className=\"sm:max-w-[500px]\">\n        <ResponsiveDialogHeader>\n          <ResponsiveDialogTitle>Create Workspace</ResponsiveDialogTitle>\n        </ResponsiveDialogHeader>\n\n        <FormProvider {...form}>\n          <form onSubmit={form.handleSubmit(onSubmit)} className=\"space-y-4\">\n            {/* Workspace Name */}\n            <FormField\n              control={form.control}\n              name=\"name\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Workspace Name *</FormLabel>\n                  <FormControl>\n                    <Input placeholder=\"My Workspace\" {...field} />\n                  </FormControl>\n                  <FormDescription>A descriptive name for your workspace</FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            {/* Slug */}\n            <FormField\n              control={form.control}\n              name=\"slug\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Slug *</FormLabel>\n                  <FormControl>\n                    <Input placeholder=\"my-workspace\" {...field} />\n                  </FormControl>\n                  <FormDescription>URL-friendly identifier (auto-generated)</FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            {/* Tenant Selection */}\n            <FormField\n              control={form.control}\n              name=\"tenantId\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Tenant *</FormLabel>\n                  {isLoadingTenants ? (\n                    <Skeleton className=\"h-10 w-full\" />\n                  ) : tenantsError ? (\n                    <div className=\"flex items-center gap-2 text-destructive text-sm\">\n                      <AlertCircle size={16} />\n                      Failed to load tenants\n                    </div>\n                  ) : tenants.length === 0 ? (\n                    <div className=\"text-muted-foreground text-sm\">\n                      No tenants available. Contact your administrator.\n                    </div>\n                  ) : (\n                    <Select onValueChange={field.onChange} value={field.value}>\n                      <FormControl>\n                        <SelectTrigger>\n                          <SelectValue placeholder=\"Select a tenant\" />\n                        </SelectTrigger>\n                      </FormControl>\n                      <SelectContent>\n                        {tenants.map((tenant) => (\n                          <SelectItem key={tenant.id} value={tenant.id}>\n                            {tenant.name}\n                          </SelectItem>\n                        ))}\n                      </SelectContent>\n                    </Select>\n                  )}\n                  <FormDescription>Select which tenant this workspace belongs to</FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            {/* Organization Selection */}\n            <FormField\n              control={form.control}\n              name=\"organizationId\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Organization *</FormLabel>\n                  {isLoadingOrganizations ? (\n                    <Skeleton className=\"h-10 w-full\" />\n                  ) : organizationsError ? (\n                    <div className=\"flex items-center gap-2 text-destructive text-sm\">\n                      <AlertCircle size={16} />\n                      Failed to load organizations\n                    </div>\n                  ) : !selectedTenantId ? (\n                    <div className=\"text-muted-foreground text-sm\">\n                      Please select a tenant first\n                    </div>\n                  ) : filteredOrganizations.length === 0 ? (\n                    <div className=\"text-muted-foreground text-sm\">\n                      No organizations found for this tenant\n                    </div>\n                  ) : (\n                    <Select\n                      onValueChange={field.onChange}\n                      value={field.value}\n                      disabled={!selectedTenantId}\n                    >\n                      <FormControl>\n                        <SelectTrigger>\n                          <SelectValue placeholder=\"Select an organization\" />\n                        </SelectTrigger>\n                      </FormControl>\n                      <SelectContent>\n                        {filteredOrganizations.map((org) => (\n                          <SelectItem key={org.id} value={org.id}>\n                            {org.name}\n                          </SelectItem>\n                        ))}\n                      </SelectContent>\n                    </Select>\n                  )}\n                  <FormDescription>Select which organization owns this workspace</FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            {/* Workspace Type */}\n            <FormField\n              control={form.control}\n              name=\"type\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Workspace Type</FormLabel>\n                  <Select onValueChange={field.onChange} defaultValue={field.value}>\n                    <FormControl>\n                      <SelectTrigger>\n                        <SelectValue placeholder=\"Select type\" />\n                      </SelectTrigger>\n                    </FormControl>\n                    <SelectContent>\n                      <SelectItem value=\"TEAM\">Team Workspace</SelectItem>\n                      <SelectItem value=\"PERSONAL\">Personal Workspace</SelectItem>\n                    </SelectContent>\n                  </Select>\n                  <FormDescription>\n                    Choose between a collaborative workspace or a personal one\n                  </FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <ResponsiveDialogFooter>\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                onClick={closeCreateWorkspaceDialog}\n                disabled={isPending}\n              >\n                Cancel\n              </Button>\n              <Button\n                type=\"submit\"\n                disabled={isPending || isLoadingTenants || isLoadingOrganizations}\n              >\n                {isPending ? 'Creating...' : 'Create Workspace'}\n              </Button>\n            </ResponsiveDialogFooter>\n          </form>\n        </FormProvider>\n      </ResponsiveDialogContent>\n    </ResponsiveDialog>\n  );\n}\n"],"mappings":"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"}

package/dist/components/InviteMemberDialog.js

@@ -4,7 +4,7 @@ import { useWorkspaceRoles as n } from "../hooks/useWorkspaceRoles.js";
 import { useState as r } from "react";
 import { AlertCircle as i } from "lucide-react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { Badge as s, Button as c, Dialog as l, DialogContent as u, DialogDescription as d, DialogHeader as f, DialogTitle as p } from "@burdenoff/fe-libs/ui";
+import { Badge as s, Button as c, ResponsiveDialog as l, ResponsiveDialogContent as u, ResponsiveDialogDescription as d, ResponsiveDialogHeader as f, ResponsiveDialogTitle as p } from "@burdenoff/fe-libs/ui";
 import { FormControl as m, FormDescription as h, FormField as g, FormItem as _, FormLabel as v, FormMessage as y, FormProvider as b, Input as x, useForm as S, z as C } from "@burdenoff/fe-libs/form";
 //#region src/components/InviteMemberDialog.tsx
 var w = C.object({
@@ -52,7 +52,7 @@ function T({ workspaceId: C }) {
 					children: [
 						j && /* @__PURE__ */ o("div", {
 							className: "flex items-center gap-2 p-3 text-sm text-destructive bg-destructive/10 border border-destructive/20 rounded-md",
-							children: [/* @__PURE__ */ a(i, { className: "h-4 w-4 flex-shrink-0" }), /* @__PURE__ */ a("span", { children: j })]
+							children: [/* @__PURE__ */ a(i, { className: "size-4 flex-shrink-0" }), /* @__PURE__ */ a("span", { children: j })]
 						}),
 						/* @__PURE__ */ a(g, {
 							control: N.control,

package/dist/components/InviteMemberDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"InviteMemberDialog.js","names":[],"sources":["../../src/components/InviteMemberDialog.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { AlertCircle } from 'lucide-react';\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogHeader,\n  DialogTitle,\n  Button,\n  Badge,\n} from '@burdenoff/fe-libs/ui';\nimport {\n  FormField,\n  FormItem,\n  FormLabel,\n  FormControl,\n  FormMessage,\n  FormDescription,\n  Input,\n  useForm,\n  FormProvider,\n  z,\n} from '@burdenoff/fe-libs/form';\nimport { useWorkspacesStore } from '../store/workspacesStore';\nimport { useCreateInvitation } from '../hooks/useMemberMutations';\nimport { useWorkspaceRoles } from '../hooks/useWorkspaceRoles';\n\nconst inviteMemberSchema = z.object({\n  email: z.string().email('Invalid email address'),\n  // Using a lambda default instead of `.default([])` to keep input type required\n  // (zod v4 widens defaulted inputs to `T | undefined`, which breaks useForm typing).\n  roleIds: z.array(z.string()),\n});\n\ntype InviteMemberFormData = z.infer<typeof inviteMemberSchema>;\n\ninterface InviteMemberDialogProps {\n  /** Workspace ID to invite the member to (from URL params) */\n  workspaceId?: string;\n}\n\nexport function InviteMemberDialog({ workspaceId }: InviteMemberDialogProps) {\n  const { isInviteMemberDialogOpen, closeInviteMemberDialog } = useWorkspacesStore();\n  const { mutate: createInvitation, isPending } = useCreateInvitation(workspaceId);\n  const { data: availableRoles = [], isLoading: isLoadingRoles } = useWorkspaceRoles(workspaceId);\n  const [error, setError] = useState<string | null>(null);\n\n  const form = useForm<InviteMemberFormData>({\n    schema: inviteMemberSchema,\n    defaultValues: {\n      email: '',\n      roleIds: [],\n    },\n  });\n\n  const onSubmit = (data: InviteMemberFormData) => {\n    setError(null);\n\n    if (!workspaceId) {\n      setError('No workspace selected. Please select a workspace first.');\n      return;\n    }\n\n    createInvitation(\n      {\n        email: data.email,\n        roleIds: data.roleIds,\n        workspaceId,\n      },\n      {\n        onSuccess: () => {\n          closeInviteMemberDialog();\n          form.reset();\n          setError(null);\n        },\n        onError: (err) => {\n          const errorMessage = err instanceof Error ? err.message : 'Failed to send invitation';\n          console.error('Failed to create invitation:', err);\n          setError(errorMessage);\n        },\n      }\n    );\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    if (!open) {\n      closeInviteMemberDialog();\n      form.reset();\n      setError(null);\n    }\n  };\n\n  return (\n    <Dialog open={isInviteMemberDialogOpen} onOpenChange={handleOpenChange}>\n      <DialogContent className=\"sm:max-w-[500px]\">\n        <DialogHeader>\n          <DialogTitle>Invite Member</DialogTitle>\n          <DialogDescription>\n            Invite a new member to this workspace by email. They'll receive an invitation link to\n            join.\n          </DialogDescription>\n        </DialogHeader>\n\n        <FormProvider {...form}>\n          <form onSubmit={form.handleSubmit(onSubmit)} className=\"space-y-4\">\n            {error && (\n              <div className=\"flex items-center gap-2 p-3 text-sm text-destructive bg-destructive/10 border border-destructive/20 rounded-md\">\n                <AlertCircle className=\"h-4 w-4 flex-shrink-0\" />\n                <span>{error}</span>\n              </div>\n            )}\n\n            <FormField\n              control={form.control}\n              name=\"email\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Email Address *</FormLabel>\n                  <FormControl>\n                    <Input\n                      type=\"email\"\n                      placeholder=\"member@example.com\"\n                      {...field}\n                      disabled={isPending}\n                      onChange={(e) => {\n                        field.onChange(e);\n                        setError(null); // Clear error when user types\n                      }}\n                    />\n                  </FormControl>\n                  <FormDescription>\n                    Enter the email address of the person you want to invite\n                  </FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <FormField\n              control={form.control}\n              name=\"roleIds\"\n              render={({ field }) => (\n                <FormItem>\n                  <div className=\"flex items-center justify-between gap-2\">\n                    <FormLabel>Roles (Optional)</FormLabel>\n                    {field.value.length > 0 && (\n                      <Badge variant=\"secondary\">{field.value.length} selected</Badge>\n                    )}\n                  </div>\n                  <FormControl>\n                    <div className=\"grid grid-cols-1 gap-2 sm:grid-cols-2\">\n                      {isLoadingRoles ? (\n                        <p className=\"text-sm text-muted-foreground\">Loading roles…</p>\n                      ) : availableRoles.length === 0 ? (\n                        <p className=\"text-sm text-muted-foreground\">\n                          No assignable roles were returned for this workspace.\n                        </p>\n                      ) : (\n                        availableRoles.map((role) => {\n                          const isSelected = field.value.includes(role.id);\n                          return (\n                            <button\n                              key={role.id}\n                              type=\"button\"\n                              aria-pressed={isSelected}\n                              disabled={isPending}\n                              onClick={() => {\n                                const nextValue = isSelected\n                                  ? field.value.filter((id) => id !== role.id)\n                                  : [...field.value, role.id];\n                                field.onChange(nextValue);\n                              }}\n                              className={`rounded-md border p-3 text-left transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 ${\n                                isSelected\n                                  ? 'border-primary bg-primary/10 text-foreground'\n                                  : 'border-border bg-background text-foreground hover:bg-accent'\n                              }`}\n                            >\n                              <div className=\"flex items-center justify-between gap-2\">\n                                <span className=\"font-medium\">{role.name}</span>\n                                {role.isSystem && <Badge variant=\"outline\">System</Badge>}\n                              </div>\n                              {role.description && (\n                                <p className=\"mt-1 text-xs text-muted-foreground\">\n                                  {role.description}\n                                </p>\n                              )}\n                            </button>\n                          );\n                        })\n                      )}\n                    </div>\n                  </FormControl>\n                  <FormDescription>\n                    Choose the roles to assign once the invitation is accepted.\n                  </FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <div className=\"flex justify-end gap-3 pt-4\">\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                onClick={() => handleOpenChange(false)}\n                disabled={isPending}\n              >\n                Cancel\n              </Button>\n              <Button type=\"submit\" disabled={isPending}>\n                {isPending ? 'Sending...' : 'Send Invitation'}\n              </Button>\n            </div>\n          </form>\n        </FormProvider>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;;;AA2BA,IAAM,IAAqB,EAAE,OAAO;CAClC,OAAO,EAAE,QAAQ,CAAC,MAAM,wBAAwB;CAGhD,SAAS,EAAE,MAAM,EAAE,QAAQ,CAAC;CAC7B,CAAC;AASF,SAAgB,EAAmB,EAAE,kBAAwC;CAC3E,IAAM,EAAE,6BAA0B,+BAA4B,GAAoB,EAC5E,EAAE,QAAQ,GAAkB,iBAAc,EAAoB,EAAY,EAC1E,EAAE,MAAM,IAAiB,EAAE,EAAE,WAAW,MAAmB,EAAkB,EAAY,EACzF,CAAC,GAAO,KAAY,EAAwB,KAAK,EAEjD,IAAO,EAA8B;EACzC,QAAQ;EACR,eAAe;GACb,OAAO;GACP,SAAS,EAAE;GACZ;EACF,CAAC,EAEI,KAAY,MAA+B;AAG/C,MAFA,EAAS,KAAK,EAEV,CAAC,GAAa;AAChB,KAAS,0DAA0D;AACnE;;AAGF,IACE;GACE,OAAO,EAAK;GACZ,SAAS,EAAK;GACd;GACD,EACD;GACE,iBAAiB;AAGf,IAFA,GAAyB,EACzB,EAAK,OAAO,EACZ,EAAS,KAAK;;GAEhB,UAAU,MAAQ;IAChB,IAAM,IAAe,aAAe,QAAQ,EAAI,UAAU;AAE1D,IADA,QAAQ,MAAM,gCAAgC,EAAI,EAClD,EAAS,EAAa;;GAEzB,CACF;IAGG,KAAoB,MAAkB;AAC1C,EAAK,MACH,GAAyB,EACzB,EAAK,OAAO,EACZ,EAAS,KAAK;;AAIlB,QACE,kBAAC,GAAD;EAAQ,MAAM;EAA0B,cAAc;YACpD,kBAAC,GAAD;GAAe,WAAU;aAAzB,CACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD,EAAA,UAAa,iBAA2B,CAAA,EACxC,kBAAC,GAAD,EAAA,UAAmB,+FAGC,CAAA,CACP,EAAA,CAAA,EAEf,kBAAC,GAAD;IAAc,GAAI;cAChB,kBAAC,QAAD;KAAM,UAAU,EAAK,aAAa,EAAS;KAAE,WAAU;eAAvD;MACG,KACC,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD,EAAa,WAAU,yBAA0B,CAAA,EACjD,kBAAC,QAAD,EAAA,UAAO,GAAa,CAAA,CAChB;;MAGR,kBAAC,GAAD;OACE,SAAS,EAAK;OACd,MAAK;OACL,SAAS,EAAE,eACT,kBAAC,GAAD,EAAA,UAAA;QACE,kBAAC,GAAD,EAAA,UAAW,mBAA2B,CAAA;QACtC,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;SACE,MAAK;SACL,aAAY;SACZ,GAAI;SACJ,UAAU;SACV,WAAW,MAAM;AAEf,UADA,EAAM,SAAS,EAAE,EACjB,EAAS,KAAK;;SAEhB,CAAA,EACU,CAAA;QACd,kBAAC,GAAD,EAAA,UAAiB,4DAEC,CAAA;QAClB,kBAAC,GAAD,EAAe,CAAA;QACN,EAAA,CAAA;OAEb,CAAA;MAEF,kBAAC,GAAD;OACE,SAAS,EAAK;OACd,MAAK;OACL,SAAS,EAAE,eACT,kBAAC,GAAD,EAAA,UAAA;QACE,kBAAC,OAAD;SAAK,WAAU;mBAAf,CACE,kBAAC,GAAD,EAAA,UAAW,oBAA4B,CAAA,EACtC,EAAM,MAAM,SAAS,KACpB,kBAAC,GAAD;UAAO,SAAQ;oBAAf,CAA4B,EAAM,MAAM,QAAO,YAAiB;YAE9D;;QACN,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;SAAK,WAAU;mBACZ,IACC,kBAAC,KAAD;UAAG,WAAU;oBAAgC;UAAkB,CAAA,GAC7D,EAAe,WAAW,IAC5B,kBAAC,KAAD;UAAG,WAAU;oBAAgC;UAEzC,CAAA,GAEJ,EAAe,KAAK,MAAS;UAC3B,IAAM,IAAa,EAAM,MAAM,SAAS,EAAK,GAAG;AAChD,iBACE,kBAAC,UAAD;WAEE,MAAK;WACL,gBAAc;WACd,UAAU;WACV,eAAe;YACb,IAAM,IAAY,IACd,EAAM,MAAM,QAAQ,MAAO,MAAO,EAAK,GAAG,GAC1C,CAAC,GAAG,EAAM,OAAO,EAAK,GAAG;AAC7B,cAAM,SAAS,EAAU;;WAE3B,WAAW,yJACT,IACI,iDACA;qBAdR,CAiBE,kBAAC,OAAD;YAAK,WAAU;sBAAf,CACE,kBAAC,QAAD;aAAM,WAAU;uBAAe,EAAK;aAAY,CAAA,EAC/C,EAAK,YAAY,kBAAC,GAAD;aAAO,SAAQ;uBAAU;aAAc,CAAA,CACrD;eACL,EAAK,eACJ,kBAAC,KAAD;YAAG,WAAU;sBACV,EAAK;YACJ,CAAA,CAEC;aAzBF,EAAK,GAyBH;WAEX;SAEA,CAAA,EACM,CAAA;QACd,kBAAC,GAAD,EAAA,UAAiB,+DAEC,CAAA;QAClB,kBAAC,GAAD,EAAe,CAAA;QACN,EAAA,CAAA;OAEb,CAAA;MAEF,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD;QACE,MAAK;QACL,SAAQ;QACR,eAAe,EAAiB,GAAM;QACtC,UAAU;kBACX;QAEQ,CAAA,EACT,kBAAC,GAAD;QAAQ,MAAK;QAAS,UAAU;kBAC7B,IAAY,eAAe;QACrB,CAAA,CACL;;MACD;;IACM,CAAA,CACD;;EACT,CAAA"}
+{"version":3,"file":"InviteMemberDialog.js","names":[],"sources":["../../src/components/InviteMemberDialog.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { AlertCircle } from 'lucide-react';\nimport {\n  ResponsiveDialog,\n  ResponsiveDialogContent,\n  ResponsiveDialogDescription,\n  ResponsiveDialogHeader,\n  ResponsiveDialogTitle,\n  Button,\n  Badge,\n} from '@burdenoff/fe-libs/ui';\nimport {\n  FormField,\n  FormItem,\n  FormLabel,\n  FormControl,\n  FormMessage,\n  FormDescription,\n  Input,\n  useForm,\n  FormProvider,\n  z,\n} from '@burdenoff/fe-libs/form';\nimport { useWorkspacesStore } from '../store/workspacesStore';\nimport { useCreateInvitation } from '../hooks/useMemberMutations';\nimport { useWorkspaceRoles } from '../hooks/useWorkspaceRoles';\n\nconst inviteMemberSchema = z.object({\n  email: z.string().email('Invalid email address'),\n  // Using a lambda default instead of `.default([])` to keep input type required\n  // (zod v4 widens defaulted inputs to `T | undefined`, which breaks useForm typing).\n  roleIds: z.array(z.string()),\n});\n\ntype InviteMemberFormData = z.infer<typeof inviteMemberSchema>;\n\ninterface InviteMemberDialogProps {\n  /** Workspace ID to invite the member to (from URL params) */\n  workspaceId?: string;\n}\n\nexport function InviteMemberDialog({ workspaceId }: InviteMemberDialogProps) {\n  const { isInviteMemberDialogOpen, closeInviteMemberDialog } = useWorkspacesStore();\n  const { mutate: createInvitation, isPending } = useCreateInvitation(workspaceId);\n  const { data: availableRoles = [], isLoading: isLoadingRoles } = useWorkspaceRoles(workspaceId);\n  const [error, setError] = useState<string | null>(null);\n\n  const form = useForm<InviteMemberFormData>({\n    schema: inviteMemberSchema,\n    defaultValues: {\n      email: '',\n      roleIds: [],\n    },\n  });\n\n  const onSubmit = (data: InviteMemberFormData) => {\n    setError(null);\n\n    if (!workspaceId) {\n      setError('No workspace selected. Please select a workspace first.');\n      return;\n    }\n\n    createInvitation(\n      {\n        email: data.email,\n        roleIds: data.roleIds,\n        workspaceId,\n      },\n      {\n        onSuccess: () => {\n          closeInviteMemberDialog();\n          form.reset();\n          setError(null);\n        },\n        onError: (err) => {\n          const errorMessage = err instanceof Error ? err.message : 'Failed to send invitation';\n          console.error('Failed to create invitation:', err);\n          setError(errorMessage);\n        },\n      }\n    );\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    if (!open) {\n      closeInviteMemberDialog();\n      form.reset();\n      setError(null);\n    }\n  };\n\n  return (\n    <ResponsiveDialog open={isInviteMemberDialogOpen} onOpenChange={handleOpenChange}>\n      <ResponsiveDialogContent className=\"sm:max-w-[500px]\">\n        <ResponsiveDialogHeader>\n          <ResponsiveDialogTitle>Invite Member</ResponsiveDialogTitle>\n          <ResponsiveDialogDescription>\n            Invite a new member to this workspace by email. They'll receive an invitation link to\n            join.\n          </ResponsiveDialogDescription>\n        </ResponsiveDialogHeader>\n\n        <FormProvider {...form}>\n          <form onSubmit={form.handleSubmit(onSubmit)} className=\"space-y-4\">\n            {error && (\n              <div className=\"flex items-center gap-2 p-3 text-sm text-destructive bg-destructive/10 border border-destructive/20 rounded-md\">\n                <AlertCircle className=\"size-4 flex-shrink-0\" />\n                <span>{error}</span>\n              </div>\n            )}\n\n            <FormField\n              control={form.control}\n              name=\"email\"\n              render={({ field }) => (\n                <FormItem>\n                  <FormLabel>Email Address *</FormLabel>\n                  <FormControl>\n                    <Input\n                      type=\"email\"\n                      placeholder=\"member@example.com\"\n                      {...field}\n                      disabled={isPending}\n                      onChange={(e) => {\n                        field.onChange(e);\n                        setError(null); // Clear error when user types\n                      }}\n                    />\n                  </FormControl>\n                  <FormDescription>\n                    Enter the email address of the person you want to invite\n                  </FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <FormField\n              control={form.control}\n              name=\"roleIds\"\n              render={({ field }) => (\n                <FormItem>\n                  <div className=\"flex items-center justify-between gap-2\">\n                    <FormLabel>Roles (Optional)</FormLabel>\n                    {field.value.length > 0 && (\n                      <Badge variant=\"secondary\">{field.value.length} selected</Badge>\n                    )}\n                  </div>\n                  <FormControl>\n                    <div className=\"grid grid-cols-1 gap-2 sm:grid-cols-2\">\n                      {isLoadingRoles ? (\n                        <p className=\"text-sm text-muted-foreground\">Loading roles…</p>\n                      ) : availableRoles.length === 0 ? (\n                        <p className=\"text-sm text-muted-foreground\">\n                          No assignable roles were returned for this workspace.\n                        </p>\n                      ) : (\n                        availableRoles.map((role) => {\n                          const isSelected = field.value.includes(role.id);\n                          return (\n                            <button\n                              key={role.id}\n                              type=\"button\"\n                              aria-pressed={isSelected}\n                              disabled={isPending}\n                              onClick={() => {\n                                const nextValue = isSelected\n                                  ? field.value.filter((id) => id !== role.id)\n                                  : [...field.value, role.id];\n                                field.onChange(nextValue);\n                              }}\n                              className={`rounded-md border p-3 text-left transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 ${\n                                isSelected\n                                  ? 'border-primary bg-primary/10 text-foreground'\n                                  : 'border-border bg-background text-foreground hover:bg-accent'\n                              }`}\n                            >\n                              <div className=\"flex items-center justify-between gap-2\">\n                                <span className=\"font-medium\">{role.name}</span>\n                                {role.isSystem && <Badge variant=\"outline\">System</Badge>}\n                              </div>\n                              {role.description && (\n                                <p className=\"mt-1 text-xs text-muted-foreground\">\n                                  {role.description}\n                                </p>\n                              )}\n                            </button>\n                          );\n                        })\n                      )}\n                    </div>\n                  </FormControl>\n                  <FormDescription>\n                    Choose the roles to assign once the invitation is accepted.\n                  </FormDescription>\n                  <FormMessage />\n                </FormItem>\n              )}\n            />\n\n            <div className=\"flex justify-end gap-3 pt-4\">\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                onClick={() => handleOpenChange(false)}\n                disabled={isPending}\n              >\n                Cancel\n              </Button>\n              <Button type=\"submit\" disabled={isPending}>\n                {isPending ? 'Sending...' : 'Send Invitation'}\n              </Button>\n            </div>\n          </form>\n        </FormProvider>\n      </ResponsiveDialogContent>\n    </ResponsiveDialog>\n  );\n}\n"],"mappings":"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"}

package/dist/components/MemberListItem.js

@@ -1,118 +1,103 @@
-import { nativeImpact as e, nativeNotify as t } from "../utils/nativeBridge.js";
-import { useRemoveWorkspaceMember as n } from "../hooks/useMemberMutations.js";
-import { formatRelativeTime as r } from "../utils/formatters.js";
-import { useState as i } from "react";
-import { MoreHorizontal as a, UserMinus as o } from "lucide-react";
-import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
-import { AlertDialog as u, AlertDialogAction as d, AlertDialogCancel as f, AlertDialogContent as p, AlertDialogDescription as m, AlertDialogFooter as h, AlertDialogHeader as g, AlertDialogTitle as _, Badge as v, Button as y, Card as b, CardContent as x, DropdownMenu as S, DropdownMenuContent as C, DropdownMenuTrigger as w } from "@burdenoff/fe-libs/ui";
+import { useWorkspacesContext as e } from "../providers/WorkspacesProvider.js";
+import { nativeImpact as t, nativeNotify as n } from "../utils/nativeBridge.js";
+import { useRemoveWorkspaceMember as r } from "../hooks/useMemberMutations.js";
+import { formatRelativeTime as i } from "../utils/formatters.js";
+import { useMemo as a, useState as o } from "react";
+import { MoreHorizontal as s, UserMinus as c } from "lucide-react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+import { AlertDialog as f, AlertDialogAction as p, AlertDialogCancel as m, AlertDialogContent as h, AlertDialogDescription as g, AlertDialogFooter as _, AlertDialogHeader as v, AlertDialogTitle as y, Badge as b, Button as x, Card as S, CardContent as C, DropdownMenu as w, DropdownMenuContent as T, DropdownMenuTrigger as E } from "@burdenoff/fe-libs/ui";
+import { ActorIdentity as D, useActorProfiles as O } from "@burdenoff/fe-libs/shared";
 //#region src/components/MemberListItem.tsx
-function T(e, t) {
-	for (let n of t) {
-		let t = e?.[n];
-		if (typeof t == "string" && t.trim()) return t;
-	}
-	return null;
-}
-function E(e) {
-	return e.split(/\s+|@/).map((e) => e.trim()).filter(Boolean).slice(0, 2).map((e) => e[0]?.toUpperCase() ?? "").join("") || "U";
-}
-function D({ member: D, selected: O = !1, onToggleSelect: k, canRemove: A = !1 }) {
-	let [j, M] = i(!1), { mutate: N, isPending: P } = n(D.workspaceId), F = D.context?.metadata, I = T(F, [
-		"displayName",
-		"name",
-		"email"
-	]) ?? `User ${D.userId}`, L = T(F, ["avatarUrl", "avatar"]);
-	return /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(b, {
-		className: `hover:bg-accent/5 transition-all duration-200 ${O ? "ring-2 ring-primary/25 border-primary/50" : ""}`,
-		children: /* @__PURE__ */ c(x, {
+function k({ member: k, selected: A = !1, onToggleSelect: j, canRemove: M = !1 }) {
+	let [N, P] = o(!1), { mutate: F, isPending: I } = r(k.workspaceId), { apiGatewayUrl: L, authToken: R, organizationId: z } = e(), B = O(a(() => [{
+		actorId: k.userId,
+		actorType: "user"
+	}], [k.userId]), {
+		apiGatewayUrl: L,
+		authToken: R,
+		orgId: z
+	})[k.userId];
+	return /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u(S, {
+		className: `hover:bg-bg-canvas transition-all duration-200 ${A ? "ring-2 ring-action-primary-bg/25 border-action-primary-bg/50" : ""}`,
+		children: /* @__PURE__ */ u(C, {
 			className: "p-4",
-			children: /* @__PURE__ */ l("div", {
+			children: /* @__PURE__ */ d("div", {
 				className: "flex items-center justify-between gap-4",
-				children: [/* @__PURE__ */ l("div", {
+				children: [/* @__PURE__ */ d("div", {
 					className: "flex items-center gap-3 flex-1 min-w-0",
-					children: [
-						k && /* @__PURE__ */ c("input", {
-							type: "checkbox",
-							checked: O,
-							onChange: (e) => k(e.target.checked),
-							className: "h-4 w-4 rounded border-border text-primary",
-							"aria-label": `Select member ${D.userId}`
-						}),
-						/* @__PURE__ */ c("div", {
-							className: "w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0 transition-colors",
-							children: L ? /* @__PURE__ */ c("img", {
-								src: L,
-								alt: I,
-								className: "h-full w-full rounded-full object-cover"
-							}) : /* @__PURE__ */ c("span", {
-								className: "text-sm font-semibold text-primary",
-								children: E(I)
-							})
-						}),
-						/* @__PURE__ */ l("div", {
-							className: "flex-1 min-w-0",
-							children: [/* @__PURE__ */ l("div", {
-								className: "flex items-center gap-2",
-								children: [/* @__PURE__ */ c("p", {
-									className: "font-medium text-sm text-primary truncate",
-									children: I
-								}), /* @__PURE__ */ c(v, {
-									variant: "secondary",
-									className: "text-xs",
-									children: "Workspace member"
-								})]
-							}), /* @__PURE__ */ l("p", {
-								className: "text-xs text-muted-foreground",
-								children: ["Joined ", r(D.createdAt)]
+					children: [j && /* @__PURE__ */ u("input", {
+						type: "checkbox",
+						checked: A,
+						onChange: (e) => j(e.target.checked),
+						className: "size-4 rounded border-border-default text-action-primary-bg",
+						"aria-label": `Select member ${B?.displayName ?? ""}`
+					}), /* @__PURE__ */ d("div", {
+						className: "flex-1 min-w-0",
+						children: [B ? /* @__PURE__ */ u(D, {
+							profile: B,
+							variant: "cell"
+						}) : null, /* @__PURE__ */ d("div", {
+							className: "mt-1 flex items-center gap-2",
+							children: [/* @__PURE__ */ u(b, {
+								variant: "secondary",
+								className: "text-xs",
+								children: "Workspace member"
+							}), /* @__PURE__ */ d("span", {
+								className: "text-xs text-text-secondary",
+								children: ["Joined ", i(k.createdAt)]
 							})]
-						})
-					]
-				}), A && /* @__PURE__ */ l(S, { children: [/* @__PURE__ */ c(w, {
+						})]
+					})]
+				}), M && /* @__PURE__ */ d(w, { children: [/* @__PURE__ */ u(E, {
 					asChild: !0,
-					children: /* @__PURE__ */ l(y, {
+					children: /* @__PURE__ */ d(x, {
 						variant: "ghost",
 						size: "icon",
-						className: "h-8 w-8 flex-shrink-0",
-						children: [/* @__PURE__ */ c(a, { className: "h-4 w-4" }), /* @__PURE__ */ c("span", {
+						className: "size-8 flex-shrink-0",
+						children: [/* @__PURE__ */ u(s, { className: "size-4" }), /* @__PURE__ */ u("span", {
 							className: "sr-only",
 							children: "Open member actions"
 						})]
 					})
-				}), /* @__PURE__ */ c(C, {
+				}), /* @__PURE__ */ u(T, {
 					align: "end",
-					children: /* @__PURE__ */ l("button", {
+					children: /* @__PURE__ */ d("button", {
 						type: "button",
-						onClick: () => M(!0),
-						className: "flex w-full items-center rounded-sm px-2 py-1.5 text-sm text-destructive outline-none transition-colors hover:bg-accent hover:text-destructive focus:bg-accent focus:text-destructive",
-						children: [/* @__PURE__ */ c(o, { className: "mr-2 h-4 w-4" }), "Remove Member"]
+						onClick: () => P(!0),
+						className: "flex w-full items-center rounded-sm px-2 py-1.5 text-sm text-status-danger-text outline-none transition-colors hover:bg-action-ghost-bg-hover focus:bg-action-ghost-bg-hover",
+						children: [/* @__PURE__ */ u(c, { className: "mr-2 size-4" }), "Remove Member"]
 					})
 				})] })]
 			})
 		})
-	}), /* @__PURE__ */ c(u, {
-		open: j,
-		onOpenChange: M,
-		children: /* @__PURE__ */ l(p, { children: [/* @__PURE__ */ l(g, { children: [/* @__PURE__ */ c(_, { children: "Remove Member" }), /* @__PURE__ */ c(m, { children: "Are you sure you want to remove this member from the workspace? This action cannot be undone." })] }), /* @__PURE__ */ l(h, { children: [/* @__PURE__ */ c(f, {
-			disabled: P,
+	}), /* @__PURE__ */ u(f, {
+		open: N,
+		onOpenChange: P,
+		children: /* @__PURE__ */ d(h, { children: [/* @__PURE__ */ d(v, { children: [/* @__PURE__ */ u(y, { children: "Remove Member" }), /* @__PURE__ */ d(g, { children: [
+			"Are you sure you want to remove ",
+			B?.displayName ?? "this member",
+			" from the workspace? This action cannot be undone."
+		] })] }), /* @__PURE__ */ d(_, { children: [/* @__PURE__ */ u(m, {
+			disabled: I,
 			children: "Cancel"
-		}), /* @__PURE__ */ c(d, {
+		}), /* @__PURE__ */ u(p, {
 			onClick: () => {
-				e("medium"), N(D.id, {
+				t("medium"), F(k.id, {
 					onSuccess: () => {
-						t("success"), M(!1);
+						n("success"), P(!1);
 					},
 					onError: () => {
-						t("error");
+						n("error");
 					}
 				});
 			},
-			disabled: P,
-			className: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
-			children: P ? "Removing..." : "Remove Member"
+			disabled: I,
+			className: "bg-status-danger-bg text-status-danger-text hover:bg-status-danger-bg/90",
+			children: I ? "Removing..." : "Remove Member"
 		})] })] })
 	})] });
 }
 //#endregion
-export { D as MemberListItem };
+export { k as MemberListItem };
 
 //# sourceMappingURL=MemberListItem.js.map