@burdenoff/microfe-planmagnet 2026.925.18 → 2026.926.2

package/dist/planmagnet/pages/TeamInviteMemberPagePage.js

@@ -1,170 +1,170 @@
 import { usePlanMagnet as e, usePlanMagnetNavigate as t } from "../providers/PlanMagnetProvider.js";
-import { useState as n } from "react";
-import { Save as r, UserPlus as i, X as a } from "lucide-react";
-import { gql as o } from "@apollo/client";
-import { useQuery as s } from "@apollo/client/react";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
-import { Button as u, Card as d, CardContent as f, CardHeader as p, CardTitle as m, Input as h } from "@burdenoff/fe-libs/ui";
+import { throwOnError as n } from "../utils/mutationResult.js";
+import { isValidInviteEmail as r } from "../utils/email.js";
+import { useState as i } from "react";
+import { Send as a, UserPlus as o, X as s } from "lucide-react";
+import { gql as c } from "@apollo/client";
+import { useMutation as l, useQuery as u } from "@apollo/client/react";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+import { Button as m, Card as h, CardContent as g, CardHeader as _, CardTitle as v, Input as y } from "@burdenoff/fe-libs/ui";
 //#region src/planmagnet/pages/TeamInviteMemberPagePage.tsx
-var g = o`
-  query GetProjectsForInvite($workspaceId: ID!, $pagination: PlanmagnetPaginationInput) {
-    planmagnetProjects(workspaceId: $workspaceId, pagination: $pagination) {
-      items {
-        id
-        name
-        key
-        methodology
-      }
-      totalCount
+var b = c`
+  query PlanmagnetInviteRoles($scopeId: String!) {
+    roles(
+      scopeId: $scopeId
+      filter: { product: "planmagnet", includePlatformRoles: false }
+      pagination: { limit: 50 }
+    ) {
+      id
+      name
+      description
+    }
+  }
+`, x = c`
+  mutation PlanmagnetInviteMember($input: CreateInvitationInput!) {
+    createInvitation(input: $input) {
+      id
+      email
+      status
+      expiresAt
     }
   }
 `;
-function _() {
-	let { workspaceId: o } = e(), _ = t(), { data: v, loading: y, error: b } = s(g, {
-		variables: {
-			workspaceId: o,
-			pagination: { first: 100 }
-		},
-		skip: !o
-	}), [x, S] = n({
-		email: "",
-		role: "developer",
-		projectId: "",
-		department: "Engineering"
-	}), C = [
-		"developer",
-		"designer",
-		"product manager",
-		"qa engineer",
-		"engineering manager",
-		"data engineer"
-	], w = [
-		"Engineering",
-		"Product",
-		"Design",
-		"Quality",
-		"Data"
-	], T = (v?.planmagnetProjects?.items ?? []).reduce((e, t) => {
-		let n = t.methodology ?? "general";
-		return e.some((e) => e.id === n) || e.push({
-			id: n,
-			name: `${n.charAt(0).toUpperCase()}${n.slice(1)} Team`
-		}), e;
-	}, []);
-	return y && !v ? /* @__PURE__ */ c("div", {
-		className: "flex items-center justify-center p-12",
-		children: /* @__PURE__ */ c("div", { className: "animate-spin h-8 w-8 border-2 border-primary border-t-transparent rounded-full" })
-	}) : b ? /* @__PURE__ */ l("div", {
-		className: "p-6 text-red-500",
-		children: ["Error: ", b.message]
-	}) : /* @__PURE__ */ l("div", {
-		className: "space-y-6 p-6 max-w-4xl",
+function S() {
+	let { workspaceId: c } = e(), S = t(), C = u(b, {
+		variables: { scopeId: c },
+		skip: !c
+	}), [w, T] = l(x), [E, D] = i(""), [O, k] = i(!1), [A, j] = i(""), [M, N] = i(null), [P, F] = i(null), I = C.data?.roles ?? [], L = I.find((e) => e.id === A) ?? null, R = r(E), z = R && !!L && !T.loading && !!c;
+	return /* @__PURE__ */ p("div", {
+		className: "max-w-3xl space-y-6 p-6",
 		children: [
-			/* @__PURE__ */ l("div", {
+			/* @__PURE__ */ p("div", {
 				className: "flex items-center justify-between",
-				children: [/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("h1", {
+				children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("h1", {
 					className: "text-2xl font-semibold",
 					children: "Invite Team Member"
-				}), /* @__PURE__ */ c("p", {
+				}), /* @__PURE__ */ f("p", {
 					className: "text-sm text-muted-foreground",
-					children: "Add a new member to your workspace."
-				})] }), /* @__PURE__ */ l("div", {
-					className: "flex gap-2",
-					children: [/* @__PURE__ */ l(u, {
-						variant: "outline",
-						size: "sm",
-						onClick: () => _("/team/team-page"),
-						children: [/* @__PURE__ */ c(a, { className: "mr-1 h-4 w-4" }), "Cancel"]
-					}), /* @__PURE__ */ l(u, {
-						size: "sm",
-						disabled: !0,
-						title: "Not available yet — see the notice below",
-						children: [/* @__PURE__ */ c(r, { className: "mr-1 h-4 w-4" }), "Send Invite"]
-					})]
+					children: "Invite someone to this workspace with a PlanMagnet access level."
+				})] }), /* @__PURE__ */ p(m, {
+					variant: "outline",
+					size: "sm",
+					onClick: () => S("/team/team-page"),
+					children: [/* @__PURE__ */ f(s, { className: "mr-1 h-4 w-4" }), "Back to team"]
 				})]
 			}),
-			/* @__PURE__ */ l("div", {
-				className: "rounded-md border border-border bg-muted p-4 text-sm text-muted-foreground",
-				children: [/* @__PURE__ */ c("strong", {
-					className: "text-foreground",
-					children: "Not available yet."
-				}), " Invitations cannot be sent — there is no team or membership model behind this form, so nothing entered here is stored and no email is sent. The form is shown so the fields and options are visible."]
+			P && /* @__PURE__ */ p("div", {
+				role: "status",
+				className: "rounded-md border border-border bg-muted p-3 text-sm text-status-success-text",
+				"data-testid": "invite-sent",
+				children: [
+					"Invitation sent to ",
+					P,
+					". They get this access when they accept it."
+				]
+			}),
+			M && /* @__PURE__ */ f("p", {
+				role: "alert",
+				className: "text-sm text-destructive",
+				"data-testid": "invite-error",
+				children: M
 			}),
-			/* @__PURE__ */ l(d, { children: [/* @__PURE__ */ c(p, { children: /* @__PURE__ */ l(m, {
+			/* @__PURE__ */ p(h, { children: [/* @__PURE__ */ f(_, { children: /* @__PURE__ */ p(v, {
 				className: "flex items-center gap-2",
-				children: [/* @__PURE__ */ c(i, { className: "h-4 w-4" }), "Invitation Details"]
-			}) }), /* @__PURE__ */ l(f, {
+				children: [/* @__PURE__ */ f(o, { className: "h-4 w-4" }), "Invitation details"]
+			}) }), /* @__PURE__ */ p(g, {
 				className: "space-y-4",
-				children: [/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-					className: "text-sm font-medium",
-					children: "Email Address"
-				}), /* @__PURE__ */ c(h, {
-					type: "email",
-					value: x.email,
-					onChange: (e) => S({
-						...x,
-						email: e.target.value
-					}),
-					className: "mt-1",
-					placeholder: "colleague@company.com"
-				})] }), /* @__PURE__ */ l("div", {
-					className: "grid grid-cols-3 gap-4",
-					children: [
-						/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
+				children: [
+					/* @__PURE__ */ p("div", { children: [
+						/* @__PURE__ */ f("label", {
+							htmlFor: "invite-email",
 							className: "text-sm font-medium",
-							children: "Role"
-						}), /* @__PURE__ */ c("select", {
-							className: "mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm capitalize",
-							value: x.role,
-							onChange: (e) => S({
-								...x,
-								role: e.target.value
-							}),
-							children: C.map((e) => /* @__PURE__ */ c("option", {
-								value: e,
-								children: e
-							}, e))
-						})] }),
-						/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-							className: "text-sm font-medium",
-							children: "Department"
-						}), /* @__PURE__ */ c("select", {
-							className: "mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
-							value: x.department,
-							onChange: (e) => S({
-								...x,
-								department: e.target.value
-							}),
-							children: w.map((e) => /* @__PURE__ */ c("option", {
-								value: e,
-								children: e
-							}, e))
-						})] }),
-						/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("label", {
-							className: "text-sm font-medium",
-							children: "Team"
-						}), /* @__PURE__ */ l("select", {
-							className: "mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
-							value: x.projectId,
-							onChange: (e) => S({
-								...x,
-								projectId: e.target.value
-							}),
-							children: [/* @__PURE__ */ c("option", {
-								value: "",
-								children: "No team"
-							}), T.map((e) => /* @__PURE__ */ c("option", {
-								value: e.id,
-								children: e.name
-							}, e.id))]
-						})] })
-					]
-				})]
+							children: "Email address"
+						}),
+						/* @__PURE__ */ f(y, {
+							id: "invite-email",
+							type: "email",
+							value: E,
+							onChange: (e) => {
+								D(e.target.value), F(null);
+							},
+							onBlur: () => k(!0),
+							"aria-invalid": O && !R,
+							"aria-describedby": "invite-email-help",
+							className: "mt-1",
+							placeholder: "colleague@company.com"
+						}),
+						O && E.trim() !== "" && !R ? /* @__PURE__ */ f("p", {
+							id: "invite-email-help",
+							role: "alert",
+							className: "mt-1 text-xs text-destructive",
+							children: "Enter a full email address, like name@company.com."
+						}) : /* @__PURE__ */ f("p", {
+							id: "invite-email-help",
+							className: "mt-1 text-xs text-muted-foreground",
+							children: "They receive an email with a link to accept."
+						})
+					] }),
+					/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("label", {
+						htmlFor: "invite-role",
+						className: "text-sm font-medium",
+						children: "Access level"
+					}), C.loading && !C.data ? /* @__PURE__ */ f("p", {
+						className: "mt-1 text-sm text-muted-foreground",
+						children: "Loading access levels…"
+					}) : C.error ? /* @__PURE__ */ p("p", {
+						role: "alert",
+						className: "mt-1 text-sm text-destructive",
+						children: ["Access levels could not be loaded: ", C.error.message]
+					}) : I.length === 0 ? /* @__PURE__ */ f("p", {
+						className: "mt-1 text-sm text-muted-foreground",
+						children: "No PlanMagnet access levels are set up for this workspace yet."
+					}) : /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ p("select", {
+						id: "invite-role",
+						className: "mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
+						value: A,
+						onChange: (e) => j(e.target.value),
+						"data-testid": "invite-role",
+						children: [/* @__PURE__ */ f("option", {
+							value: "",
+							children: "Choose an access level"
+						}), I.map((e) => /* @__PURE__ */ f("option", {
+							value: e.id,
+							children: e.name
+						}, e.id))]
+					}), L?.description && /* @__PURE__ */ f("p", {
+						className: "mt-1 text-xs text-muted-foreground",
+						children: L.description
+					})] })] }),
+					/* @__PURE__ */ f("div", {
+						className: "flex justify-end",
+						children: /* @__PURE__ */ p(m, {
+							size: "sm",
+							onClick: async () => {
+								if (!(!z || !L)) {
+									N(null), F(null);
+									try {
+										F((await n(w({ variables: { input: {
+											email: E.trim(),
+											roleIds: [L.id],
+											workspaceId: c
+										} } }))).data?.createInvitation.email ?? E.trim()), D(""), k(!1);
+									} catch (e) {
+										N(e instanceof Error ? e.message : "The invitation could not be sent.");
+									}
+								}
+							},
+							disabled: !z,
+							"data-testid": "invite-send",
+							children: [/* @__PURE__ */ f(a, { className: "mr-1 h-4 w-4" }), T.loading ? "Sending…" : "Send invite"]
+						})
+					})
+				]
 			})] })
 		]
 	});
 }
 //#endregion
-export { _ as TeamInviteMemberPagePage };
+export { S as TeamInviteMemberPagePage };
 
 //# sourceMappingURL=TeamInviteMemberPagePage.js.map

package/dist/planmagnet/pages/TeamInviteMemberPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"TeamInviteMemberPagePage.js","names":[],"sources":["../../../src/planmagnet/pages/TeamInviteMemberPagePage.tsx"],"sourcesContent":["// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-nocheck\nimport { useState } from 'react';\nimport { gql } from '@apollo/client';\nimport { useQuery } from '@apollo/client/react';\nimport { Card, CardContent, CardHeader, CardTitle, Button, Input } from '@burdenoff/fe-libs/ui';\nimport { Save, X, UserPlus } from 'lucide-react';\nimport { usePlanMagnet, usePlanMagnetNavigate } from '../providers/PlanMagnetProvider';\n\nconst GET_PROJECTS_FOR_INVITE = gql`\n  query GetProjectsForInvite($workspaceId: ID!, $pagination: PlanmagnetPaginationInput) {\n    planmagnetProjects(workspaceId: $workspaceId, pagination: $pagination) {\n      items {\n        id\n        name\n        key\n        methodology\n      }\n      totalCount\n    }\n  }\n`;\n\ninterface ProjectNode {\n  id: string;\n  name: string;\n  key: string;\n  methodology: string | null;\n}\n\ninterface ProjectsData {\n  projects: { items: ProjectNode[]; totalCount: number };\n}\n\nexport function TeamInviteMemberPagePage() {\n  const { workspaceId } = usePlanMagnet();\n  const navigate = usePlanMagnetNavigate();\n\n  const { data, loading, error } = useQuery<ProjectsData>(GET_PROJECTS_FOR_INVITE, {\n    variables: {\n      workspaceId,\n      pagination: { first: 100 },\n    },\n    skip: !workspaceId,\n  });\n\n  const [form, setForm] = useState({\n    email: '',\n    role: 'developer',\n    projectId: '',\n    department: 'Engineering',\n  });\n  const roles = [\n    'developer',\n    'designer',\n    'product manager',\n    'qa engineer',\n    'engineering manager',\n    'data engineer',\n  ] as const;\n  const departments = ['Engineering', 'Product', 'Design', 'Quality', 'Data'] as const;\n\n  const projects = data?.planmagnetProjects?.items ?? [];\n\n  const teams = projects.reduce(\n    (acc, p) => {\n      const method = p.methodology ?? 'general';\n      if (!acc.some((t) => t.id === method)) {\n        acc.push({\n          id: method,\n          name: `${method.charAt(0).toUpperCase()}${method.slice(1)} Team`,\n        });\n      }\n      return acc;\n    },\n    [] as Array<{ id: string; name: string }>\n  );\n\n  // NOTE: nothing here can send an invitation. wspace-planmagnet-svc has no Team or\n  // membership model, and this MFE only talks to the workspaces gateway, which exposes\n  // no invite mutation — the \"teams\" on the Team page are derived from project\n  // methodologies, not real teams. The previous handler only called navigate('/team/team-page'),\n  // so a user filled in an email, clicked Send Invite, was redirected, and no invitation\n  // existed — indistinguishable from success. The submit control is disabled until there\n  // is something to invite into (BOFF-7822); the notice above the form says so.\n\n  // Only before the first load: a refetch must not blank the page (it\n\n  // unmounts every component on it and loses their state).\n\n  if (loading && !data) {\n    return (\n      <div className=\"flex items-center justify-center p-12\">\n        <div className=\"animate-spin h-8 w-8 border-2 border-primary border-t-transparent rounded-full\" />\n      </div>\n    );\n  }\n\n  if (error) {\n    return <div className=\"p-6 text-red-500\">Error: {error.message}</div>;\n  }\n\n  return (\n    <div className=\"space-y-6 p-6 max-w-4xl\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">Invite Team Member</h1>\n          <p className=\"text-sm text-muted-foreground\">Add a new member to your workspace.</p>\n        </div>\n        <div className=\"flex gap-2\">\n          <Button variant=\"outline\" size=\"sm\" onClick={() => navigate('/team/team-page')}>\n            <X className=\"mr-1 h-4 w-4\" />\n            Cancel\n          </Button>\n          <Button size=\"sm\" disabled title=\"Not available yet — see the notice below\">\n            <Save className=\"mr-1 h-4 w-4\" />\n            Send Invite\n          </Button>\n        </div>\n      </div>\n      <div className=\"rounded-md border border-border bg-muted p-4 text-sm text-muted-foreground\">\n        <strong className=\"text-foreground\">Not available yet.</strong> Invitations cannot be sent —\n        there is no team or membership model behind this form, so nothing entered here is stored and\n        no email is sent. The form is shown so the fields and options are visible.\n      </div>\n      <Card>\n        <CardHeader>\n          <CardTitle className=\"flex items-center gap-2\">\n            <UserPlus className=\"h-4 w-4\" />\n            Invitation Details\n          </CardTitle>\n        </CardHeader>\n        <CardContent className=\"space-y-4\">\n          <div>\n            <label className=\"text-sm font-medium\">Email Address</label>\n            <Input\n              type=\"email\"\n              value={form.email}\n              onChange={(e) => setForm({ ...form, email: e.target.value })}\n              className=\"mt-1\"\n              placeholder=\"colleague@company.com\"\n            />\n          </div>\n          <div className=\"grid grid-cols-3 gap-4\">\n            <div>\n              <label className=\"text-sm font-medium\">Role</label>\n              <select\n                className=\"mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm capitalize\"\n                value={form.role}\n                onChange={(e) => setForm({ ...form, role: e.target.value })}\n              >\n                {roles.map((r) => (\n                  <option key={r} value={r}>\n                    {r}\n                  </option>\n                ))}\n              </select>\n            </div>\n            <div>\n              <label className=\"text-sm font-medium\">Department</label>\n              <select\n                className=\"mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm\"\n                value={form.department}\n                onChange={(e) => setForm({ ...form, department: e.target.value })}\n              >\n                {departments.map((d) => (\n                  <option key={d} value={d}>\n                    {d}\n                  </option>\n                ))}\n              </select>\n            </div>\n            <div>\n              <label className=\"text-sm font-medium\">Team</label>\n              <select\n                className=\"mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm\"\n                value={form.projectId}\n                onChange={(e) => setForm({ ...form, projectId: e.target.value })}\n              >\n                <option value=\"\">No team</option>\n                {teams.map((t) => (\n                  <option key={t.id} value={t.id}>\n                    {t.name}\n                  </option>\n                ))}\n              </select>\n            </div>\n          </div>\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"TeamInviteMemberPagePage.js","names":[],"sources":["../../../src/planmagnet/pages/TeamInviteMemberPagePage.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { gql } from '@apollo/client';\nimport { useMutation, useQuery } from '@apollo/client/react';\nimport { Button, Card, CardContent, CardHeader, CardTitle, Input } from '@burdenoff/fe-libs/ui';\nimport { Send, UserPlus, X } from 'lucide-react';\nimport { usePlanMagnet, usePlanMagnetNavigate } from '../providers/PlanMagnetProvider';\nimport { throwOnError } from '../utils/mutationResult';\nimport { isValidInviteEmail } from '../utils/email';\n\n/**\n * Invite a member (H12, BOFF-7833). The previous page offered job titles (developer, designer, …) in its\n * \"Role\" picker plus invented Department and Team pickers, none of which any backend accepts, and its Send\n * button was disabled on the belief that no invite mutation existed. The platform's createInvitation does\n * exist, validates the email and the role ids, and assigns the roles when the invitee accepts. The access\n * levels offered here are PlanMagnet's own RBAC roles for this workspace, as the platform returns them.\n */\n\nconst INVITE_ROLES = gql`\n  query PlanmagnetInviteRoles($scopeId: String!) {\n    roles(\n      scopeId: $scopeId\n      filter: { product: \"planmagnet\", includePlatformRoles: false }\n      pagination: { limit: 50 }\n    ) {\n      id\n      name\n      description\n    }\n  }\n`;\n\nconst CREATE_INVITATION = gql`\n  mutation PlanmagnetInviteMember($input: CreateInvitationInput!) {\n    createInvitation(input: $input) {\n      id\n      email\n      status\n      expiresAt\n    }\n  }\n`;\n\ninterface InviteRole {\n  id: string;\n  name: string;\n  description: string | null;\n}\n\nexport function TeamInviteMemberPagePage() {\n  const { workspaceId } = usePlanMagnet();\n  const navigate = usePlanMagnetNavigate();\n\n  const roles = useQuery<{ roles: InviteRole[] }>(INVITE_ROLES, {\n    variables: { scopeId: workspaceId },\n    skip: !workspaceId,\n  });\n  const [invite, inviteState] = useMutation<{\n    createInvitation: { id: string; email: string; status: string; expiresAt: string | null };\n  }>(CREATE_INVITATION);\n\n  const [email, setEmail] = useState('');\n  const [emailTouched, setEmailTouched] = useState(false);\n  const [roleId, setRoleId] = useState('');\n  const [error, setError] = useState<string | null>(null);\n  const [sentTo, setSentTo] = useState<string | null>(null);\n\n  const available = roles.data?.roles ?? [];\n  const chosen = available.find((r) => r.id === roleId) ?? null;\n  const emailOk = isValidInviteEmail(email);\n  const canSend = emailOk && !!chosen && !inviteState.loading && !!workspaceId;\n\n  const send = async () => {\n    if (!canSend || !chosen) return;\n    setError(null);\n    setSentTo(null);\n    try {\n      const result = await throwOnError(\n        invite({ variables: { input: { email: email.trim(), roleIds: [chosen.id], workspaceId } } })\n      );\n      setSentTo(result.data?.createInvitation.email ?? email.trim());\n      setEmail('');\n      setEmailTouched(false);\n    } catch (e) {\n      setError(e instanceof Error ? e.message : 'The invitation could not be sent.');\n    }\n  };\n\n  return (\n    <div className=\"max-w-3xl space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">Invite Team Member</h1>\n          <p className=\"text-sm text-muted-foreground\">\n            Invite someone to this workspace with a PlanMagnet access level.\n          </p>\n        </div>\n        <Button variant=\"outline\" size=\"sm\" onClick={() => navigate('/team/team-page')}>\n          <X className=\"mr-1 h-4 w-4\" />\n          Back to team\n        </Button>\n      </div>\n\n      {sentTo && (\n        <div\n          role=\"status\"\n          className=\"rounded-md border border-border bg-muted p-3 text-sm text-status-success-text\"\n          data-testid=\"invite-sent\"\n        >\n          Invitation sent to {sentTo}. They get this access when they accept it.\n        </div>\n      )}\n      {error && (\n        <p role=\"alert\" className=\"text-sm text-destructive\" data-testid=\"invite-error\">\n          {error}\n        </p>\n      )}\n\n      <Card>\n        <CardHeader>\n          <CardTitle className=\"flex items-center gap-2\">\n            <UserPlus className=\"h-4 w-4\" />\n            Invitation details\n          </CardTitle>\n        </CardHeader>\n        <CardContent className=\"space-y-4\">\n          <div>\n            <label htmlFor=\"invite-email\" className=\"text-sm font-medium\">\n              Email address\n            </label>\n            <Input\n              id=\"invite-email\"\n              type=\"email\"\n              value={email}\n              onChange={(e) => {\n                setEmail(e.target.value);\n                setSentTo(null);\n              }}\n              onBlur={() => setEmailTouched(true)}\n              aria-invalid={emailTouched && !emailOk}\n              aria-describedby=\"invite-email-help\"\n              className=\"mt-1\"\n              placeholder=\"colleague@company.com\"\n            />\n            {emailTouched && email.trim() !== '' && !emailOk ? (\n              <p id=\"invite-email-help\" role=\"alert\" className=\"mt-1 text-xs text-destructive\">\n                Enter a full email address, like name@company.com.\n              </p>\n            ) : (\n              <p id=\"invite-email-help\" className=\"mt-1 text-xs text-muted-foreground\">\n                They receive an email with a link to accept.\n              </p>\n            )}\n          </div>\n\n          <div>\n            <label htmlFor=\"invite-role\" className=\"text-sm font-medium\">\n              Access level\n            </label>\n            {roles.loading && !roles.data ? (\n              <p className=\"mt-1 text-sm text-muted-foreground\">Loading access levels…</p>\n            ) : roles.error ? (\n              <p role=\"alert\" className=\"mt-1 text-sm text-destructive\">\n                Access levels could not be loaded: {roles.error.message}\n              </p>\n            ) : available.length === 0 ? (\n              <p className=\"mt-1 text-sm text-muted-foreground\">\n                No PlanMagnet access levels are set up for this workspace yet.\n              </p>\n            ) : (\n              <>\n                <select\n                  id=\"invite-role\"\n                  className=\"mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm\"\n                  value={roleId}\n                  onChange={(e) => setRoleId(e.target.value)}\n                  data-testid=\"invite-role\"\n                >\n                  <option value=\"\">Choose an access level</option>\n                  {available.map((r) => (\n                    <option key={r.id} value={r.id}>\n                      {r.name}\n                    </option>\n                  ))}\n                </select>\n                {chosen?.description && (\n                  <p className=\"mt-1 text-xs text-muted-foreground\">{chosen.description}</p>\n                )}\n              </>\n            )}\n          </div>\n\n          <div className=\"flex justify-end\">\n            <Button size=\"sm\" onClick={send} disabled={!canSend} data-testid=\"invite-send\">\n              <Send className=\"mr-1 h-4 w-4\" />\n              {inviteState.loading ? 'Sending…' : 'Send invite'}\n            </Button>\n          </div>\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/planmagnet/pages/TeamTeamPagePage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TeamTeamPagePage.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/pages/TeamTeamPagePage.tsx"],"names":[],"mappings":"AAkEA,wBAAgB,gBAAgB,4CAyK/B"}
+{"version":3,"file":"TeamTeamPagePage.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/pages/TeamTeamPagePage.tsx"],"names":[],"mappings":"AAkEA,wBAAgB,gBAAgB,4CAqL/B"}