@sanity/workflow-studio-plugin 0.31.0 → 0.32.0

package/dist/_chunks-cjs/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 
-var jsxRuntime = require("react/jsx-runtime"), Timeline = require("@sanity/icons/Timeline"), ui = require("@sanity/ui"), workflowReact = require("@sanity/workflow-react"), react = require("react"), structure = require("sanity/structure"), workflowEngine = require("@sanity/workflow-engine"), Checkmark = require("@sanity/icons/Checkmark"), Close = require("@sanity/icons/Close"), formatDistanceToNow = require("date-fns/formatDistanceToNow"), workflowComponents = require("@sanity/workflow-components"), csm = require("@sanity/client/csm"), telemetry = require("@sanity/telemetry"), workflowStudio = require("@sanity/workflow-studio"), sanity = require("sanity"), Calendar = require("@sanity/icons/Calendar"), User = require("@sanity/icons/User"), Search = require("@sanity/icons/Search"), ChevronRight = require("@sanity/icons/ChevronRight"), Edit = require("@sanity/icons/Edit"), content = require("@sanity/util/content"), InfoOutline = require("@sanity/icons/InfoOutline"), Document = require("@sanity/icons/Document"), WarningOutline = require("@sanity/icons/WarningOutline"), router = require("sanity/router"), types = require("@sanity/types"), Launch = require("@sanity/icons/Launch"), ErrorOutline = require("@sanity/icons/ErrorOutline"), Empty$1 = require("@sanity/icons/Empty"), ErrorFilled = require("@sanity/icons/ErrorFilled"), RemoveCircle = require("@sanity/icons/RemoveCircle"), Add = require("@sanity/icons/Add"), Ulist = require("@sanity/icons/Ulist"), CheckmarkCircle = require("@sanity/icons/CheckmarkCircle"), Bolt = require("@sanity/icons/Bolt"), ChevronDown = require("@sanity/icons/ChevronDown"), pluralize = require("pluralize-esm"), EllipsisHorizontal = require("@sanity/icons/EllipsisHorizontal"), Clock = require("@sanity/icons/Clock"), Cog = require("@sanity/icons/Cog"), ArrowUp = require("@sanity/icons/ArrowUp"), rxjs = require("rxjs"), operators = require("rxjs/operators"), Transfer = require("@sanity/icons/Transfer");
+var jsxRuntime = require("react/jsx-runtime"), Timeline = require("@sanity/icons/Timeline"), ui = require("@sanity/ui"), workflowReact = require("@sanity/workflow-react"), react = require("react"), structure = require("sanity/structure"), workflowEngine = require("@sanity/workflow-engine"), Checkmark = require("@sanity/icons/Checkmark"), Close = require("@sanity/icons/Close"), formatDistanceToNow = require("date-fns/formatDistanceToNow"), workflowComponents = require("@sanity/workflow-components"), csm = require("@sanity/client/csm"), telemetry = require("@sanity/telemetry"), workflowStudio = require("@sanity/workflow-studio"), sanity = require("sanity"), Calendar = require("@sanity/icons/Calendar"), User = require("@sanity/icons/User"), Search = require("@sanity/icons/Search"), Edit = require("@sanity/icons/Edit"), content = require("@sanity/util/content"), InfoOutline = require("@sanity/icons/InfoOutline"), Document = require("@sanity/icons/Document"), WarningOutline = require("@sanity/icons/WarningOutline"), router = require("sanity/router"), types = require("@sanity/types"), Launch = require("@sanity/icons/Launch"), ErrorOutline = require("@sanity/icons/ErrorOutline"), Empty$1 = require("@sanity/icons/Empty"), ErrorFilled = require("@sanity/icons/ErrorFilled"), RemoveCircle = require("@sanity/icons/RemoveCircle"), AddUser = require("@sanity/icons/AddUser"), Add = require("@sanity/icons/Add"), Ulist = require("@sanity/icons/Ulist"), CheckmarkCircle = require("@sanity/icons/CheckmarkCircle"), Bolt = require("@sanity/icons/Bolt"), ChevronDown = require("@sanity/icons/ChevronDown"), pluralize = require("pluralize-esm"), ChevronRight = require("@sanity/icons/ChevronRight"), styledComponents = require("styled-components"), EllipsisHorizontal = require("@sanity/icons/EllipsisHorizontal"), Clock = require("@sanity/icons/Clock"), Cog = require("@sanity/icons/Cog"), ArrowUp = require("@sanity/icons/ArrowUp"), rxjs = require("rxjs"), operators = require("rxjs/operators"), Transfer = require("@sanity/icons/Transfer");
 
 function _interopDefaultCompat(e) {
     return e && typeof e == "object" && "default" in e ? e : {
@@ -441,6 +441,14 @@ function formatDate(value) {
     });
 }
 
+function formatDueMoment(value) {
+    return storedDateKind(value) === "date" ? formatDate(value) : formatShortDateTime(value);
+}
+
+function dueMomentSentence(value, now) {
+    return `${isDueDatePast(value, now) ? "Was due" : "Due"} ${formatDueMoment(value)}`;
+}
+
 function formatBoolean(value) {
     return value ? "True" : "False";
 }
@@ -699,19 +707,10 @@ function isOpenActivityStatus(status) {
     return !workflowEngine.isTerminalActivityStatus(status);
 }
 
-function assigneeMatches(member, who) {
-    return member.type === "user" ? member.id === who.userId : who.roles.includes(member.role);
-}
-
 function changedAssignee(current, next) {
     return next.find(item => !current.some(existing => workflowComponents.sameAssignee(item, existing))) ?? current.find(item => !next.some(existing => workflowComponents.sameAssignee(item, existing)));
 }
 
-function singleAssigneePick(current, next) {
-    const changed = changedAssignee(current ? [ current ] : [], next);
-    if (changed !== void 0) return current && workflowComponents.sameAssignee(changed, current) ? null : changed;
-}
-
 function isAssigneeShape(value) {
     if (typeof value != "object" || value === null) return !1;
     const {type: type, id: id, role: role} = value;
@@ -725,7 +724,7 @@ function isActorShape(value) {
 }
 
 function assigneesOf(entries) {
-    return entries.flatMap(entry => entry._type === "assignees" ? entry.value : []);
+    return [ ...workflowEngine.assignmentMembers(entries) ];
 }
 
 function userIdsOf(assignees) {
@@ -743,43 +742,36 @@ function assigneeEdit(current, next) {
     };
 }
 
-function isItemAssignedTo(item, who) {
-    return item.assignee != null && assigneeMatches(item.assignee, who);
+function assignmentHolding(assignees, who) {
+    const match = workflowComponents.assignmentMatch(assignees, who);
+    return match === void 0 ? "other" : match === "user" ? "you" : "role";
 }
 
-function matchingAssignees(state, who) {
-    return state.flatMap(entry => entry._type === "assignees" ? entry.value.filter(a => assigneeMatches(a, who)) : entry._type === "assignee" && entry.value !== null && assigneeMatches(entry.value, who) ? [ entry.value ] : []);
+function holdingMatchesAssignment(holding, assignment) {
+    return assignment === void 0 ? holding !== "other" : holding === assignment;
 }
 
-function isActivityAssignedTo(args) {
-    return matchingAssignees(args.state, args.who).length > 0;
+function activityHolding(args) {
+    return assignmentHolding(assigneesOf(args.state), args.who);
 }
 
-function isRoleAssignedTo(args) {
-    return matchingAssignees(args.state, args.who).some(member => member.type === "role");
-}
-
-function isItemRoleAssignedTo(item, who) {
-    return isItemAssignedTo(item, who) && item.assignee?.type === "role";
+function itemHolding(item, who) {
+    return assignmentHolding(item.assignee ?? [], who);
 }
 
 function assignedWork(args) {
-    const {instance: instance, committed: committed, who: who} = args, evaluation = args.staleEvaluation === "keep" || isEvaluationCurrent(args) ? args.evaluation : void 0, byActivity = stateByActivity(instance), stateOf = t => byActivity.get(t.activity.name) ?? [], activities = (evaluation?.currentStage.activities ?? []).filter(t => isActivityAssignedTo({
+    const {instance: instance, committed: committed, who: who} = args, evaluation = args.staleEvaluation === "keep" || isEvaluationCurrent(args) ? args.evaluation : void 0, byActivity = stateByActivity(instance), stateOf = t => byActivity.get(t.activity.name) ?? [], activities = (evaluation?.currentStage.activities ?? []).filter(t => holdingMatchesAssignment(activityHolding({
         state: stateOf(t),
         who: who
-    })), items = deriveTodoItems({
+    }), args.assignment)), items = deriveTodoItems({
         instance: instance,
         committed: committed,
         evaluation: evaluation
-    }).rows.filter(row => isItemAssignedTo(row.item, who));
+    }).rows.filter(row => holdingMatchesAssignment(itemHolding(row.item, who), args.assignment));
     return {
         activities: activities,
         openItems: items.filter(row => !isTodoDone(row.item)),
-        doneItems: items.filter(row => isTodoDone(row.item)),
-        roleMatched: activities.some(t => isRoleAssignedTo({
-            state: stateOf(t),
-            who: who
-        })) || items.some(row => isItemRoleAssignedTo(row.item, who))
+        doneItems: items.filter(row => isTodoDone(row.item))
     };
 }
 
@@ -804,11 +796,18 @@ function hasOpenAssignedWork(work) {
 }
 
 function assignedTaskCount(args) {
-    return openAssignedCount(assignedWork(args));
+    return openAssignedCount(assignedWork({
+        ...args,
+        assignment: "you"
+    }));
+}
+
+function hasForMeRows(work) {
+    return work.some(({shown: shown}) => hasAssignedRows(shown));
 }
 
 function forMeWorkOf(entries, identity) {
-    const work = identity ? entries.map(entry => {
+    const section = assignment => identity === void 0 ? [] : entries.map(entry => {
         const base = {
             instance: entry.instance,
             committed: entry.committed,
@@ -818,18 +817,22 @@ function forMeWorkOf(entries, identity) {
         return {
             entry: entry,
             who: identity,
-            count: assignedTaskCount(base),
+            count: openAssignedCount(assignedWork({
+                ...base,
+                assignment: assignment
+            })),
             shown: assignedWork({
                 ...base,
+                assignment: assignment,
                 staleEvaluation: "keep"
             })
         };
-    }) : [];
+    }), assignedToUser = section("you"), assignedToRoles = section("role");
     return {
-        work: work,
-        count: work.reduce((n, {count: count}) => n + count, 0),
-        hasRows: work.some(({shown: shown}) => hasAssignedRows(shown)),
-        hasRoleMatched: work.some(({shown: shown}) => shown.roleMatched)
+        assignedToUser: assignedToUser,
+        assignedToRoles: assignedToRoles,
+        count: assignedToUser.reduce((n, {count: count}) => n + count, 0),
+        hasRows: hasForMeRows([ ...assignedToUser, ...assignedToRoles ])
     };
 }
 
@@ -909,8 +912,20 @@ const ACTIVITY_STATUS_LABEL = {
     done: "Done",
     failed: "Failed",
     skipped: "Skipped"
+}, TASK_STATUS_LABEL = {
+    ...ACTIVITY_STATUS_LABEL,
+    active: "In progress"
+}, HOLDING_SUFFIX = {
+    you: "with you",
+    role: "with your role",
+    other: void 0
 };
 
+function taskStatusLine(args) {
+    const label = TASK_STATUS_LABEL[args.status], suffix = workflowEngine.isTerminalActivityStatus(args.status) ? void 0 : HOLDING_SUFFIX[args.holding];
+    return suffix === void 0 ? label : `${label} · ${suffix}`;
+}
+
 function isHandsOff(args) {
     return args.classification === "autonomous" && args.completesWithoutCaller === "yes";
 }
@@ -997,9 +1012,10 @@ function deriveActivityPresentation(args) {
     }), blockedReason = status === "active" && actions.length > 0 && actions.every(a => !a.allowed) ? actions.find(a => a.disabledReason)?.disabledReason : void 0, ticks = tickActionNames({
         actions: actions,
         state: args.state
-    }), buttonActions = visibleActions.filter(a => !ticks.has(a.action.name)), settled = workflowEngine.isTerminalActivityStatus(status);
+    }), buttonActions = visibleActions.filter(a => !ticks.has(a.action.name)), settled = workflowEngine.isTerminalActivityStatus(status), holderGate = settled ? void 0 : args.activityEval.actions.find(action => action.holderGate !== void 0)?.holderGate;
     return {
         blockedReason: blockedReason,
+        holderGate: holderGate?.holders,
         settled: settled,
         triggeredActions: settled ? [] : args.activityEval.actions.filter(a => a.triggered === !0),
         manualTarget: kind === "manual" ? manualLink(activity) : void 0,
@@ -1127,7 +1143,7 @@ function deriveActivityDetail(args) {
         title: activityLabel(activityEval.activity),
         state: state,
         editableByName: new Map(activityEditables.map(f => [ f.name, f ])),
-        assignFields: new Map(activityEditables.filter(f => f.type === "assignees" && f.editable).map(f => [ f.name, f ]))
+        assignFields: new Map(activityEditables.filter(f => (f.type === "assignee" || f.type === "assignees") && f.editable).map(f => [ f.name, f ]))
     };
 }
 
@@ -1171,6 +1187,35 @@ function useWorkflowInstanceEntry(instanceId, options = {}) {
     }, [ instanceId, evaluate, requestEvaluation, releaseEvaluation ]), useHeldWorkflowEntry(instanceId);
 }
 
+const DIM = {
+    opacity: .6
+};
+
+function Breadcrumb({segments: segments, emphasizeCurrent: emphasizeCurrent = !1}) {
+    /* @__PURE__ */
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+        children: segments.map((segment, i) => /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, {
+            children: [ i > 0 ? /* @__PURE__ */ jsxRuntime.jsx(Separator, {}) : null, 
+            /* @__PURE__ */ jsxRuntime.jsx("span", {
+                style: emphasizeCurrent && i < segments.length - 1 ? DIM : void 0,
+                children: segment
+            }) ]
+        }, `${i}-${segment}`))
+    });
+}
+
+function Separator() {
+    /* @__PURE__ */
+    return jsxRuntime.jsx("span", {
+        "aria-hidden": !0,
+        style: {
+            ...DIM,
+            margin: "0 0.35em"
+        },
+        children: "/"
+    });
+}
+
 const WorkflowToolOpened = telemetry.defineEvent({
     name: "Workflows Studio Plugin Tool Opened",
     version: 3,
@@ -1202,7 +1247,7 @@ const WorkflowDefinitionDetailViewed = telemetry.defineEvent({
     description: "The form strip's instance line was clicked, opening the document view"
 }), WorkflowDocumentLinkClicked = telemetry.defineEvent({
     name: "Workflows Studio Plugin Document Link Clicked",
-    version: 3,
+    version: 4,
     description: "A document link was clicked, opening the referenced document's editor"
 }), WorkflowStartDialogOpened = telemetry.defineEvent({
     name: "Workflows Studio Plugin Start Dialog Opened",
@@ -1218,15 +1263,15 @@ const WorkflowDefinitionDetailViewed = telemetry.defineEvent({
     description: "A fresh document's auto-start ran — one start request per configured workflow"
 }), WorkflowActionControlUsed = telemetry.defineEvent({
     name: "Workflows Studio Plugin Action Control Used",
-    version: 3,
+    version: 4,
     description: "An action-firing control was used, attributed to its UI surface"
 }), WorkflowFieldControlUsed = telemetry.defineEvent({
     name: "Workflows Studio Plugin Field Control Used",
-    version: 2,
+    version: 3,
     description: "A field-editing control committed an edit, attributed to its UI surface"
 }), WorkflowActivityDialogOpened = telemetry.defineEvent({
     name: "Workflows Studio Plugin Activity Dialog Opened",
-    version: 2,
+    version: 3,
     description: "The activity detail dialog was opened"
 }), WorkflowBoardWorkflowSelected = telemetry.defineEvent({
     name: "Workflows Studio Plugin Board Workflow Selected",
@@ -1238,11 +1283,11 @@ const WorkflowDefinitionDetailViewed = telemetry.defineEvent({
     description: "A cold-start seeded preview title diverged from the live preview pipeline"
 }), WorkflowTodoToggled = telemetry.defineEvent({
     name: "Workflows Studio Plugin Todo Toggled",
-    version: 1,
+    version: 2,
     description: "A todo checkbox was toggled, attributed to its UI surface and write seam"
 }), WorkflowTodoEdited = telemetry.defineEvent({
     name: "Workflows Studio Plugin Todo Edited",
-    version: 1,
+    version: 2,
     description: "A non-toggle todo-list write, attributed to its UI surface and gesture"
 }), WorkflowAbortDialogOpened = telemetry.defineEvent({
     name: "Workflows Studio Plugin Abort Dialog Opened",
@@ -1265,26 +1310,6 @@ function LogEventOnMount(props) {
     return useLogEventOnMount(props.event, props.data), null;
 }
 
-function isEmptyValue(value) {
-    return value == null || value === "" || Array.isArray(value) && value.length === 0;
-}
-
-function effectiveValidation(kind, validation) {
-    return kind !== "progress" ? validation : {
-        min: validation?.min ?? 0,
-        max: validation?.max ?? 100
-    };
-}
-
-function scalarValidationIssue(args) {
-    const issues = workflowEngine.scalarValidationIssues({
-        entryType: args.kind,
-        validation: effectiveValidation(args.kind, args.validation),
-        value: args.value
-    });
-    return issues === void 0 ? void 0 : `${args.label}: ${issues.join("; ")}`;
-}
-
 function countBy(rows, keysOf) {
     const counts = /* @__PURE__ */ new Map;
     for (const row of rows) for (const key of keysOf(row)) counts.set(key, (counts.get(key) ?? 0) + 1);
@@ -1402,16 +1427,18 @@ function useSelfActor() {
 }
 
 function useAssignmentIdentity() {
-    const state = useSelfState();
-    if (state.kind !== "resolved") return state;
-    const {id: id, roles: roles} = state.self;
-    return {
+    const state = useSelfState(), id = state.kind === "resolved" ? state.self.id : void 0, roles = state.kind === "resolved" ? state.self.roles : void 0;
+    return react.useMemo(() => id === void 0 || roles === void 0 ? state.kind === "pending" ? {
+        kind: "pending"
+    } : {
+        kind: "unavailable"
+    } : {
         kind: "resolved",
         identity: {
             userId: id,
-            roles: roles.map(r => r.name)
+            roles: roles.map(role => role.name)
         }
-    };
+    }, [ id, roles, state.kind ]);
 }
 
 function identityOf(state) {
@@ -1441,15 +1468,35 @@ function projectMembersFrom(users) {
 }
 
 function useProjectMembers() {
-    const {users: users, roles: roles, loading: loading, error: error} = workflowStudio.useStudioProjectUsers();
-    return {
-        members: react.useMemo(() => projectMembersFrom(users), [ users ]),
+    const {users: users, roles: roles, loading: loading, error: error} = workflowStudio.useStudioProjectUsers(), members = react.useMemo(() => projectMembersFrom(users), [ users ]), message = react.useMemo(() => error === void 0 ? void 0 : workflowEngine.errorMessage(error), [ error ]);
+    return react.useMemo(() => ({
+        members: members,
         roles: roles,
         loading: loading,
-        error: error === void 0 ? void 0 : workflowEngine.errorMessage(error)
+        error: message
+    }), [ loading, members, message, roles ]);
+}
+
+function isEmptyValue(value) {
+    return value == null || value === "" || Array.isArray(value) && value.length === 0;
+}
+
+function effectiveValidation(kind, validation) {
+    return kind !== "progress" ? validation : {
+        min: validation?.min ?? 0,
+        max: validation?.max ?? 100
     };
 }
 
+function scalarValidationIssue(args) {
+    const issues = workflowEngine.scalarValidationIssues({
+        entryType: args.kind,
+        validation: effectiveValidation(args.kind, args.validation),
+        value: args.value
+    });
+    return issues === void 0 ? void 0 : `${args.label}: ${issues.join("; ")}`;
+}
+
 const passthrough = raw => ({
     value: raw
 }), paramConverter = {
@@ -1812,31 +1859,19 @@ function MemberPicker({selectedIds: selectedIds, onSelect: onSelect, unassignRow
     });
 }
 
-function AssigneePicker({value: value, onChange: onChange, eligibleRoles: eligibleRoles, roleAliases: roleAliases}) {
+function AssigneePicker({value: value, onChange: onChange, eligibleRoles: eligibleRoles, roleAliases: roleAliases, maxUsers: maxUsers}) {
     const state = useProjectMembers();
     /* @__PURE__ */
     return jsxRuntime.jsx(workflowComponents.AssigneePicker, {
         ...state,
         eligibleRoles: eligibleRoles,
+        maxUsers: maxUsers,
         onChange: onChange,
         roleAliases: roleAliases,
         value: value
     });
 }
 
-function SingleAssigneePicker({current: current, onPick: onPick, eligibleRoles: eligibleRoles, roleAliases: roleAliases}) {
-    /* @__PURE__ */
-    return jsxRuntime.jsx(AssigneePicker, {
-        eligibleRoles: eligibleRoles,
-        onChange: next => {
-            const picked = singleAssigneePick(current, next);
-            picked !== void 0 && onPick(picked);
-        },
-        roleAliases: roleAliases,
-        value: current ? [ current ] : []
-    });
-}
-
 function MemberPickerButton({label: label = "Select member…", onChange: onChange, selectedIds: selectedIds, unassignRow: unassignRow = !1, value: value}) {
     const [open, setOpen] = react.useState(!1), {imageUrl: imageUrl} = useUserDisplay(value?.id ?? ""), selected = selectedIds ?? (value ? /* @__PURE__ */ new Set([ value.id ]) : /* @__PURE__ */ new Set), toggle = () => setOpen(v => !v);
     /* @__PURE__ */
@@ -2507,39 +2542,6 @@ function ParamsActionButton({actionEval: actionEval, instanceId: instanceId, act
     });
 }
 
-const DIM = {
-    opacity: .6
-};
-
-function Breadcrumb({segments: segments, emphasizeCurrent: emphasizeCurrent = !1}) {
-    /* @__PURE__ */
-    return jsxRuntime.jsx(jsxRuntime.Fragment, {
-        children: segments.map((segment, i) => /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, {
-            children: [ i > 0 ? /* @__PURE__ */ jsxRuntime.jsx(Separator, {}) : null, 
-            /* @__PURE__ */ jsxRuntime.jsx("span", {
-                style: emphasizeCurrent && i < segments.length - 1 ? DIM : void 0,
-                children: segment
-            }) ]
-        }, `${i}-${segment}`))
-    });
-}
-
-function Separator() {
-    /* @__PURE__ */
-    return jsxRuntime.jsx("span", {
-        "aria-hidden": !0,
-        style: {
-            ...DIM,
-            alignItems: "center",
-            display: "inline-flex",
-            height: "0.7em",
-            margin: "0 0.5em",
-            overflow: "hidden"
-        },
-        children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight.ChevronRightIcon, {})
-    });
-}
-
 function stageTitle(definition, stageName) {
     return workflowEngine.findStageNode({
         definition: definition,
@@ -2754,10 +2756,81 @@ function docFaceChrome(args) {
     }
 }
 
+function useEditIntentLink(bareId) {
+    return react.useMemo(() => bareId === void 0 ? void 0 : function(linkProps) {
+        /* @__PURE__ */
+        return jsxRuntime.jsx(router.IntentLink, {
+            ...linkProps,
+            intent: "edit",
+            params: {
+                id: bareId
+            }
+        });
+    }, [ bareId ]);
+}
+
+function useSpaceToken(index) {
+    const value = ui.useTheme_v2().space[index];
+    if (value === void 0) throw new Error(`theme is missing space token ${index}`);
+    return value;
+}
+
+function useRadiusToken(index) {
+    const value = ui.useTheme_v2().radius[index];
+    if (value === void 0) throw new Error(`theme is missing radius token ${index}`);
+    return value;
+}
+
+function useContainerToken(index) {
+    const value = ui.useTheme_v2().container[index];
+    if (value === void 0) throw new Error(`theme is missing container token ${index}`);
+    return value;
+}
+
+function useTextCapHeight() {
+    const textSize = ui.useTheme_v2().font.text.sizes[1];
+    if (!textSize) throw new Error("useTextCapHeight: theme is missing text size 1");
+    return textSize.lineHeight - textSize.ascenderHeight - textSize.descenderHeight;
+}
+
+function useCapTrimFor(size) {
+    return (useTextCapHeight() - size) / 2;
+}
+
+function useTextIconSize() {
+    const textSize = ui.useTheme_v2().font.text.sizes[1];
+    if (!textSize) throw new Error("useTextIconSize: theme is missing text size 1");
+    return textSize.iconSize;
+}
+
+function useAvatarSize() {
+    const avatarSize = ui.useTheme_v2().avatar.sizes[0];
+    if (!avatarSize) throw new Error("useAvatarSize: theme is missing avatar size 0");
+    return avatarSize.size;
+}
+
+function useAvatarCapTrim() {
+    return useCapTrimFor(useAvatarSize());
+}
+
+function useBadgeCapTrim() {
+    const badgePadding = useSpaceToken(1);
+    return {
+        marginBottom: -badgePadding,
+        marginTop: -badgePadding
+    };
+}
+
 function chipPadding(fill) {
     return fill ? 3 : 2;
 }
 
+function useChipTrim() {
+    return {
+        margin: -useSpaceToken(chipPadding(!1))
+    };
+}
+
 function LinkChip({hint: hint, children: children, as: as = "a", fill: fill = !1, ...anchorProps}) {
     /* @__PURE__ */
     return jsxRuntime.jsx(HoverHint, {
@@ -2956,12 +3029,18 @@ function InlineChipFace({bareId: bareId, schemaType: schemaType}) {
     return jsxRuntime.jsxs(ui.Flex, {
         align: "center",
         gap: 2,
+        style: {
+            minWidth: 0
+        },
         children: [ 
         /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
             size: 1,
             children: renderTypeIcon(schemaType.icon)
         }), preview.isLoading ? /* @__PURE__ */ jsxRuntime.jsx(TitleSkeleton, {}) : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
             size: 1,
+            style: {
+                minWidth: 0
+            },
             textOverflow: "ellipsis",
             weight: "medium",
             children: preview.value?.title ?? /* @__PURE__ */ jsxRuntime.jsx("em", {
@@ -3022,16 +3101,7 @@ function DocRefShell({face: face, layout: layout, source: source}) {
         e.stopPropagation(), telemetry2.log(WorkflowDocumentLinkClicked, {
             source: source
         });
-    }, EditIntentLink = react.useMemo(() => bareId === void 0 ? void 0 : function(linkProps) {
-        /* @__PURE__ */
-        return jsxRuntime.jsx(router.IntentLink, {
-            ...linkProps,
-            intent: "edit",
-            params: {
-                id: bareId
-            }
-        });
-    }, [ bareId ]);
+    }, EditIntentLink = useEditIntentLink(bareId);
     if (isCompact(layout)) /* @__PURE__ */
     return jsxRuntime.jsx(CompactDocRef, {
         face: face,
@@ -3194,8 +3264,8 @@ const fieldValueRenderer = {
     array: field => /* @__PURE__ */ jsxRuntime.jsx(ArrayValueRows, {
         rows: field.value
     }),
-    assignee: field => field.value ? /* @__PURE__ */ jsxRuntime.jsx(AssigneeBadges, {
-        assignees: [ field.value ]
+    assignee: field => field.value.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(AssigneeBadges, {
+        assignees: field.value
     }) : /* @__PURE__ */ jsxRuntime.jsx(Empty, {}),
     assignees: field => field.value.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(AssigneeBadges, {
         assignees: field.value
@@ -3366,8 +3436,8 @@ function ReadOnlyAssigneeValue({value: value}) {
         padding: 2,
         radius: 2,
         tone: "transparent",
-        children: value ? /* @__PURE__ */ jsxRuntime.jsx(AssigneeBadges, {
-            assignees: [ value ]
+        children: value.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(AssigneeBadges, {
+            assignees: value
         }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
             muted: !0,
             size: 1,
@@ -3406,7 +3476,7 @@ function ReadOnlyValueFace({entry: entry}) {
     });
 }
 
-const VALUE_FACE_KINDS = /* @__PURE__ */ new Set([ "assignees", "object", "array" ]);
+const VALUE_FACE_KINDS = /* @__PURE__ */ new Set([ "assignee", "assignees", "object", "array" ]);
 
 function ReadOnlyField({entry: entry}) {
     return workflowEngine.isSingleDocRefEntry(entry) ? /* @__PURE__ */ jsxRuntime.jsx(DocPicker, {
@@ -3422,8 +3492,6 @@ function ReadOnlyField({entry: entry}) {
         value: entry.value?.releaseName ?? ""
     }) : entry._type === "actor" ? /* @__PURE__ */ jsxRuntime.jsx(ReadOnlyActorValue, {
         value: entry.value
-    }) : entry._type === "assignee" ? /* @__PURE__ */ jsxRuntime.jsx(ReadOnlyAssigneeValue, {
-        value: entry.value
     }) : VALUE_FACE_KINDS.has(entry._type) ? /* @__PURE__ */ jsxRuntime.jsx(ReadOnlyValueFace, {
         entry: entry
     }) : /* @__PURE__ */ jsxRuntime.jsx(FieldInput$1, {
@@ -3649,49 +3717,30 @@ function ActorField({field: field, instanceId: instanceId, onSave: onSave, onUns
     });
 }
 
-function useAssigneePick(args) {
-    const {onSave: onSave, onUnset: onUnset} = args, {saving: saving, save: save} = useSaveField({
-        instanceId: args.instanceId
-    });
-    return {
-        saving: saving,
-        pick: picked => {
-            if (!saving) {
-                if (picked === null) {
-                    onUnset !== void 0 && save(onUnset);
-                    return;
-                }
-                save(() => onSave(picked));
-            }
-        }
-    };
-}
-
-function AssigneeField({field: field, instanceId: instanceId, onSave: onSave, onUnset: onUnset}) {
-    const [open, setOpen] = react.useState(!1), cur = isAssigneeShape(field.value) ? field.value : null, {pick: pick} = useAssigneePick({
-        instanceId: instanceId,
-        onSave: onSave,
-        onUnset: onUnset
+function AssigneeField({field: field, instanceId: instanceId, onSave: onSave}) {
+    const [open, setOpen] = react.useState(!1), cur = Array.isArray(field.value) ? field.value.filter(isAssigneeShape) : [], {saving: saving, save: save} = useSaveField({
+        instanceId: instanceId
     });
     return field.editable ? /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, {
         align: "center",
         children: /* @__PURE__ */ jsxRuntime.jsx(DismissablePopover, {
-            content: /* @__PURE__ */ jsxRuntime.jsx(SingleAssigneePicker, {
-                current: cur,
+            content: /* @__PURE__ */ jsxRuntime.jsx(AssigneePicker, {
                 eligibleRoles: field.roles,
-                onPick: picked => {
-                    setOpen(!1), pick(picked);
+                maxUsers: 1,
+                onChange: next => {
+                    saving || save(() => onSave(next));
                 },
-                roleAliases: field.roleAliases
+                roleAliases: field.roleAliases,
+                value: cur
             }),
             onDismiss: () => setOpen(!1),
             open: open,
             children: /* @__PURE__ */ jsxRuntime.jsx(EditableValueButton, {
-                hint: cur ? "Reassign" : "Assign",
+                hint: cur.length > 0 ? "Change assignment" : "Assign",
                 hintDisabled: open,
                 onClick: () => setOpen(v => !v),
-                children: cur ? /* @__PURE__ */ jsxRuntime.jsx(AssigneeBadges, {
-                    assignees: [ cur ]
+                children: cur.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(AssigneeBadges, {
+                    assignees: cur
                 }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
                     muted: !0,
                     size: 1,
@@ -3951,8 +4000,7 @@ function fieldArm({arm: arm, entry: entry, onUnset: onUnset, onAppend: onAppend,
         ...arm,
         onUnset: onUnset
     }) : field.type === "assignee" ? /* @__PURE__ */ jsxRuntime.jsx(AssigneeField, {
-        ...arm,
-        onUnset: onUnset
+        ...arm
     }) : field.type === "assignees" ? /* @__PURE__ */ jsxRuntime.jsx(ValueDisplay, {
         field: field,
         value: field.value
@@ -4013,6 +4061,17 @@ function EditableField({field: field, entry: entry, description: description, in
     });
 }
 
+function Hairline({weight: weight, style: style}) {
+    const {color: color} = ui.useTheme_v2();
+    /* @__PURE__ */
+    return jsxRuntime.jsx("div", {
+        style: {
+            borderTop: `${weight}px solid ${color.border}`,
+            ...style
+        }
+    });
+}
+
 function useDrainEffects(instanceId) {
     const {drainEffectsFor: drainEffectsFor} = useWorkflowContext(), toast = useWorkflowToast(), [busy, setBusy] = react.useState(!1);
     return {
@@ -4274,7 +4333,28 @@ function TaskControls({actions: actions, instanceId: instanceId, remedies: remed
     });
 }
 
-function MetaRow({children: children, fillHeight: fillHeight, label: label}) {
+const LABEL = "Open in document";
+
+function OpenDocumentLink({gdr: gdr, source: source}) {
+    const state = useDocLink(gdr), telemetry2 = workflowReact.useWorkflowTelemetry(), link = useEditIntentLink(state.kind === "linked" ? state.bareId : void 0);
+    return link === void 0 ? /* @__PURE__ */ jsxRuntime.jsx(DocPreviewLink, {
+        gdr: gdr,
+        layout: "inline",
+        source: source
+    }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Button, {
+        as: link,
+        fontSize: 1,
+        iconRight: Launch.LaunchIcon,
+        mode: "bleed",
+        onClick: () => telemetry2.log(WorkflowDocumentLinkClicked, {
+            source: source
+        }),
+        padding: 2,
+        text: LABEL
+    });
+}
+
+function MetaRow({children: children, fillHeight: fillHeight, label: label}) {
     /* @__PURE__ */
     return jsxRuntime.jsxs(ui.Flex, {
         gap: 4,
@@ -4297,11 +4377,88 @@ function MetaRow({children: children, fillHeight: fillHeight, label: label}) {
         }), 
         /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
             flex: 1,
+            style: {
+                minWidth: 0
+            },
             children: children
         }) ]
     });
 }
 
+function RowAssignees({assignees: assignees, hint: hint}) {
+    const ids = userIdsOf(assignees), vocabulary = useProjectMembers(), roles = assignees.flatMap(item => item.type === "role" ? [ workflowComponents.memberRoleFor(vocabulary, item.role) ] : []), displays = useUserDisplays(ids);
+    if (ids.length === 0 && roles.length === 0) return null;
+    const bothKinds = roles.length > 0 && displays.length > 0;
+    /* @__PURE__ */
+    return jsxRuntime.jsx(HoverHint, {
+        content: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
+            gap: 3,
+            children: [ roles.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(HintSection, {
+                names: roles.map(workflowComponents.roleLabel),
+                ...bothKinds ? {
+                    label: "Roles"
+                } : {}
+            }) : null, displays.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(HintSection, {
+                names: disambiguatedNames(displays),
+                ...bothKinds ? {
+                    label: "Members"
+                } : {}
+            }) : null, hint === void 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                muted: !0,
+                size: 1,
+                children: hint
+            }) ]
+        }),
+        children: /* @__PURE__ */ jsxRuntime.jsx(workflowComponents.AssigneeStack, {
+            members: displays.map(display => ({
+                id: display.id,
+                displayName: display.name,
+                imageUrl: display.imageUrl
+            })),
+            roles: roles
+        })
+    });
+}
+
+function HintSection({label: label, names: names}) {
+    /* @__PURE__ */
+    return jsxRuntime.jsxs(ui.Stack, {
+        gap: 2,
+        children: [ label === void 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+            size: 1,
+            weight: "medium",
+            children: label
+        }), 
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+            size: 1,
+            children: names.join(", ")
+        }) ]
+    });
+}
+
+function SectionHeading({children: children}) {
+    /* @__PURE__ */
+    return jsxRuntime.jsx(ui.Text, {
+        size: 1,
+        weight: "medium",
+        children: children
+    });
+}
+
+function OverlineHeading({children: children}) {
+    /* @__PURE__ */
+    return jsxRuntime.jsx(ui.Text, {
+        muted: !0,
+        size: 0,
+        style: {
+            letterSpacing: "0.06em",
+            textTransform: "uppercase"
+        },
+        weight: "semibold",
+        children: children
+    });
+}
+
 function CheckmarkCircleFilledIcon(props) {
     /* @__PURE__ */
     return jsxRuntime.jsx("svg", {
@@ -4355,58 +4512,6 @@ function ActivityStatusIcon({status: status}) {
     });
 }
 
-function useSpaceToken(index) {
-    const value = ui.useTheme_v2().space[index];
-    if (value === void 0) throw new Error(`theme is missing space token ${index}`);
-    return value;
-}
-
-function useRadiusToken(index) {
-    const value = ui.useTheme_v2().radius[index];
-    if (value === void 0) throw new Error(`theme is missing radius token ${index}`);
-    return value;
-}
-
-function useContainerToken(index) {
-    const value = ui.useTheme_v2().container[index];
-    if (value === void 0) throw new Error(`theme is missing container token ${index}`);
-    return value;
-}
-
-function useTextCapHeight() {
-    const textSize = ui.useTheme_v2().font.text.sizes[1];
-    if (!textSize) throw new Error("useTextCapHeight: theme is missing text size 1");
-    return textSize.lineHeight - textSize.ascenderHeight - textSize.descenderHeight;
-}
-
-function useCapTrimFor(size) {
-    return (useTextCapHeight() - size) / 2;
-}
-
-function useTextIconSize() {
-    const textSize = ui.useTheme_v2().font.text.sizes[1];
-    if (!textSize) throw new Error("useTextIconSize: theme is missing text size 1");
-    return textSize.iconSize;
-}
-
-function useAvatarSize() {
-    const avatarSize = ui.useTheme_v2().avatar.sizes[0];
-    if (!avatarSize) throw new Error("useAvatarSize: theme is missing avatar size 0");
-    return avatarSize.size;
-}
-
-function useAvatarCapTrim() {
-    return useCapTrimFor(useAvatarSize());
-}
-
-function useBadgeCapTrim() {
-    const badgePadding = useSpaceToken(1);
-    return {
-        marginBottom: -badgePadding,
-        marginTop: -badgePadding
-    };
-}
-
 function SpinnerSlot({busy: busy, reserve: reserve = !0}) {
     const size = useTextIconSize(), trim = useCapTrimFor(size), spinning = useDelayedFlag(busy, LOADING_CUE_DELAY_MS);
     return !spinning && !reserve ? null : /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, {
@@ -4497,55 +4602,8 @@ function AvatarButton({avatar: avatar, onClick: onClick, onMouseDown: onMouseDow
     });
 }
 
-function RowAssignees({assignees: assignees, hint: hint}) {
-    const ids = userIdsOf(assignees), vocabulary = useProjectMembers(), roles = assignees.flatMap(item => item.type === "role" ? [ workflowComponents.memberRoleFor(vocabulary, item.role) ] : []), displays = useUserDisplays(ids);
-    if (ids.length === 0 && roles.length === 0) return null;
-    const bothKinds = roles.length > 0 && displays.length > 0;
-    /* @__PURE__ */
-    return jsxRuntime.jsx(HoverHint, {
-        content: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
-            gap: 3,
-            children: [ roles.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(HintSection, {
-                names: roles.map(workflowComponents.roleLabel),
-                ...bothKinds ? {
-                    label: "Roles"
-                } : {}
-            }) : null, displays.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(HintSection, {
-                names: disambiguatedNames(displays),
-                ...bothKinds ? {
-                    label: "Members"
-                } : {}
-            }) : null, hint === void 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-                muted: !0,
-                size: 1,
-                children: hint
-            }) ]
-        }),
-        children: /* @__PURE__ */ jsxRuntime.jsx(workflowComponents.AssigneeStack, {
-            members: displays.map(display => ({
-                id: display.id,
-                displayName: display.name,
-                imageUrl: display.imageUrl
-            })),
-            roles: roles
-        })
-    });
-}
-
-function HintSection({label: label, names: names}) {
-    /* @__PURE__ */
-    return jsxRuntime.jsxs(ui.Stack, {
-        gap: 2,
-        children: [ label === void 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-            size: 1,
-            weight: "medium",
-            children: label
-        }), 
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-            size: 1,
-            children: names.join(", ")
-        }) ]
-    });
+function assignActivityIcon(assigneeCount) {
+    return assigneeCount > 0 ? AddUser.AddUserIcon : User.UserIcon;
 }
 
 function AssignActivityControl({instanceId: instanceId, state: state, surface: surface, assignees: assignees = []}) {
@@ -4605,7 +4663,7 @@ function AssignActivityControl({instanceId: instanceId, state: state, surface: s
             "aria-label": "Assign",
             as: "span",
             fontSize: 1,
-            icon: User.UserIcon,
+            icon: assignActivityIcon(current.length),
             mode: "bleed",
             onClick: handleClick,
             onMouseDown: stopRowMouseDown,
@@ -4638,7 +4696,7 @@ function rowMatches(row, filter) {
     if (filter === void 0) return !0;
     switch (filter.kind) {
       case "mine":
-        return isItemAssignedTo(row.item, filter.identity);
+        return holdingMatchesAssignment(itemHolding(row.item, filter.identity), filter.assignment);
 
       case "activity":
         return row.activityName === filter.activity || row.tick?.activity === filter.activity;
@@ -4838,20 +4896,18 @@ function DueDateControl({item: item, editable: editable, onPatch: onPatch}) {
 }
 
 function AssigneeControl({item: item, editable: editable, eligibleRoles: eligibleRoles, onPatch: onPatch, roleAliases: roleAliases}) {
-    const [open, setOpen] = react.useState(!1), current = item.assignee ?? null, chip = current ? /* @__PURE__ */ jsxRuntime.jsx(RowAssignees, {
-        assignees: [ current ]
+    const [open, setOpen] = react.useState(!1), current = item.assignee ?? [], chip = current.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(RowAssignees, {
+        assignees: current
     }) : null;
     return editable ? /* @__PURE__ */ jsxRuntime.jsx(DismissablePopover, {
-        content: 
-        /* @__PURE__ */ jsxRuntime.jsx(SingleAssigneePicker, {
-            current: current,
+        content: /* @__PURE__ */ jsxRuntime.jsx(AssigneePicker, {
             eligibleRoles: eligibleRoles,
-            onPick: picked => {
-                setOpen(!1), onPatch({
-                    assignee: picked
-                });
-            },
-            roleAliases: roleAliases
+            maxUsers: 1,
+            onChange: picked => onPatch({
+                assignee: [ ...picked ]
+            }),
+            roleAliases: roleAliases,
+            value: current
         }),
         onDismiss: () => setOpen(!1),
         open: open,
@@ -5368,7 +5424,7 @@ function ActionsMenuButton({actions: actions, instanceId: instanceId, activity:
 
 const FOOTER_GAP_PX = 8, MORE_ACTIONS_LABEL = "More actions";
 
-function TerminalFooter({actions: actions, activity: activity, instanceId: instanceId}) {
+function TerminalFooter({actions: actions, activity: activity, instanceId: instanceId, surface: surface}) {
     const lock = useActionClusterState(), [only, ...rest] = actions;
     return only ? /* @__PURE__ */ jsxRuntime.jsx(ActionClusterProvider, {
         value: lock,
@@ -5378,12 +5434,13 @@ function TerminalFooter({actions: actions, activity: activity, instanceId: insta
                 activity: activity,
                 instanceId: instanceId,
                 placement: "terminal-footer",
-                surface: "activity-dialog"
+                surface: surface
             })
         }) : /* @__PURE__ */ jsxRuntime.jsx(FittedActions, {
             actions: actions,
             activity: activity,
-            instanceId: instanceId
+            instanceId: instanceId,
+            surface: surface
         })
     }) : null;
 }
@@ -5406,7 +5463,7 @@ function FooterRow({children: children, onElement: onElement}) {
     });
 }
 
-function FittedActions({actions: actions, activity: activity, instanceId: instanceId}) {
+function FittedActions({actions: actions, activity: activity, instanceId: instanceId, surface: surface}) {
     const [footerEl, setFooterEl] = react.useState(null), [measureEl, setMeasureEl] = react.useState(null), footerSize = ui.useElementSize(footerEl), measureSize = ui.useElementSize(measureEl), [inline, setInline] = react.useState(void 0);
     react.useLayoutEffect(() => {
         if (measureEl === null || footerSize === null || measureSize === null) return;
@@ -5434,7 +5491,7 @@ function FittedActions({actions: actions, activity: activity, instanceId: instan
                 activity: activity,
                 instanceId: instanceId,
                 placement: "terminal-footer",
-                surface: "activity-dialog"
+                surface: surface
             }, a.action.name)), overflow.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(ActionsMenuButton, {
                 actions: overflow,
                 activity: activity,
@@ -5442,7 +5499,7 @@ function FittedActions({actions: actions, activity: activity, instanceId: instan
                 label: MORE_ACTIONS_LABEL,
                 mode: "default",
                 placement: "terminal-footer",
-                surface: "activity-dialog"
+                surface: surface
             }) : null ]
         }) ]
     });
@@ -5485,33 +5542,43 @@ function MeasureRow({actions: actions, activity: activity, onElement: onElement}
     });
 }
 
-function ActivityDetailDialog({entry: entry, activityName: activityName, breadcrumb: breadcrumb, definition: definition, document: document, source: source, onClose: onClose}) {
+function ActivityDetailBody({activityName: activityName, definition: definition, document: document, entry: entry, layout: layout, source: source, surface: surface, todoSurface: todoSurface}) {
     const detail = deriveActivityDetail({
         entry: entry,
         activityName: activityName
-    }), faultingActivity2 = useInstanceFault(entry)?.activity;
+    }), faultingActivity2 = useInstanceFault(entry)?.activity, identity = useAssignmentIdentity();
     if (!detail) return null;
-    const instanceId = entry.instance._id, notice = blockedNotice(detail), fault = /* @__PURE__ */ jsxRuntime.jsx(InstanceFaultNote, {
-        entry: entry,
-        scope: {
-            kind: "task",
-            activityName: activityName
-        }
-    }), faulted = faultingActivity2 === activityName, hasBody = detail.state.length > 0 || notice !== void 0 || faulted;
+    const instanceId = entry.instance._id, notice = activityNotice(detail), faulted = faultingActivity2 === activityName, hasBody = detail.state.length > 0 || notice !== void 0 || faulted, common = {
+        activityName: activityName,
+        definition: definition,
+        detail: detail,
+        docLinkSource: layout === "panel" ? "task-panel-subject" : "dialog-subject",
+        instanceId: instanceId,
+        surface: surface
+    }, work = hasBody ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(InstanceFaultNote, {
+            entry: entry,
+            scope: {
+                kind: "task",
+                activityName: activityName
+            }
+        }), detail.state.map(field => /* @__PURE__ */ jsxRuntime.jsx(FieldRow, {
+            activityName: activityName,
+            detail: detail,
+            entry: entry,
+            field: field,
+            instanceId: instanceId,
+            layout: layout,
+            surface: surface,
+            todoSurface: todoSurface
+        }, field._key)), notice ]
+    }) : null, who = identityOf(identity);
     /* @__PURE__ */
-    return jsxRuntime.jsxs(ui.Dialog, {
-        footer: detail.presentation.terminalActions.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(TerminalFooter, {
-            actions: detail.presentation.terminalActions,
-            activity: activityName,
-            instanceId: instanceId
-        }) : void 0,
-        header: /* @__PURE__ */ jsxRuntime.jsx(Breadcrumb, {
-            emphasizeCurrent: !0,
-            segments: [ ...breadcrumb, detail.title ]
-        }),
-        id: "workflow-activity-detail",
-        onClose: onClose,
-        width: 1,
+    return jsxRuntime.jsxs(ui.Flex, {
+        direction: "column",
+        flex: 1,
+        overflow: "hidden",
         children: [ 
         /* @__PURE__ */ jsxRuntime.jsx(LogEventOnMount, {
             data: {
@@ -5519,86 +5586,264 @@ function ActivityDetailDialog({entry: entry, activityName: activityName, breadcr
                 source: source
             },
             event: WorkflowActivityDialogOpened
+        }), layout === "panel" ? /* @__PURE__ */ jsxRuntime.jsx(PanelBody, {
+            ...common,
+            document: document,
+            holding: who === void 0 ? "other" : activityHolding({
+                state: detail.state,
+                who: who
+            }),
+            children: work
+        }) : /* @__PURE__ */ jsxRuntime.jsx(DialogBody, {
+            ...common,
+            document: document,
+            separated: hasBody,
+            children: work
+        }) ]
+    });
+}
+
+function PanelBody({children: children, document: document, holding: holding, ...props}) {
+    const {definition: definition, detail: detail} = props, description = detail.activityEval.activity.description;
+    /* @__PURE__ */
+    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
+            flex: 1,
+            overflow: "auto",
+            padding: 4,
+            children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
+                gap: 5,
+                children: [ description ? /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                    size: 1,
+                    children: description
+                }) : null, 
+                /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
+                    gap: 4,
+                    children: [ 
+                    /* @__PURE__ */ jsxRuntime.jsx(OverlineHeading, {
+                        children: "Details of this task"
+                    }), 
+                    /* @__PURE__ */ jsxRuntime.jsx(TaskStatusRow, {
+                        detail: detail,
+                        holding: holding
+                    }), children, 
+                    /* @__PURE__ */ jsxRuntime.jsx(AutomationNarration, {
+                        definition: definition,
+                        detail: detail
+                    }) ]
+                }), 
+                /* @__PURE__ */ jsxRuntime.jsx(TaskActions, {
+                    ...props
+                }) ]
+            })
+        }), document ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+            children: [ 
+            /* @__PURE__ */ jsxRuntime.jsx(Hairline, {
+                weight: 1
+            }), 
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
+                padding: 2,
+                children: /* @__PURE__ */ jsxRuntime.jsx(OpenDocumentLink, {
+                    gdr: document,
+                    source: props.docLinkSource
+                })
+            }) ]
+        }) : null ]
+    });
+}
+
+function TaskStatusRow({detail: detail, holding: holding}) {
+    const {status: status} = detail.activityEval;
+    /* @__PURE__ */
+    return jsxRuntime.jsxs(ui.Flex, {
+        align: "center",
+        gap: 3,
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+            muted: !0,
+            size: 1,
+            children: "Status"
+        }), 
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
+            align: "center",
+            gap: 2,
+            children: [ 
+            /* @__PURE__ */ jsxRuntime.jsx(ActivityStatusIcon, {
+                status: status
+            }), 
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                size: 1,
+                children: taskStatusLine({
+                    status: status,
+                    holding: holding
+                })
+            }) ]
+        }) ]
+    });
+}
+
+function AutomationNarration({definition: definition, detail: detail}) {
+    const {triggeredActions: triggeredActions} = detail.presentation;
+    return triggeredActions.length === 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, {
+        align: "center",
+        gap: 2,
+        wrap: "wrap",
+        children: triggeredActions.map(a => /* @__PURE__ */ jsxRuntime.jsx(AutomationActionRow, {
+            actionEval: a,
+            definition: definition
+        }, a.action.name))
+    });
+}
+
+function TaskActions({activityName: activityName, detail: detail, instanceId: instanceId, surface: surface}) {
+    const {actions: actions, manualTarget: manualTarget, terminalActions: terminalActions} = detail.presentation, lock = useActionClusterState();
+    return actions.length + terminalActions.length === 0 && !manualTarget ? null : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(Hairline, {
+            weight: 1
         }), 
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
+            gap: 4,
+            children: [ 
+            /* @__PURE__ */ jsxRuntime.jsx(OverlineHeading, {
+                children: "Your actions"
+            }), 
+            /* @__PURE__ */ jsxRuntime.jsx(ActionClusterProvider, {
+                value: lock,
+                children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
+                    align: "center",
+                    gap: 2,
+                    wrap: "wrap",
+                    children: [ [ ...actions, ...terminalActions ].map(a => /* @__PURE__ */ jsxRuntime.jsx(ActivityActionRow, {
+                        actionEval: a,
+                        activity: activityName,
+                        instanceId: instanceId,
+                        placement: "task-actions",
+                        surface: surface
+                    }, a.action.name)), manualTarget ? /* @__PURE__ */ jsxRuntime.jsx(ManualTargetButton, {
+                        target: manualTarget
+                    }) : null ]
+                })
+            }) ]
+        }) ]
+    });
+}
+
+function ManualTargetButton({target: target}) {
+    /* @__PURE__ */
+    return jsxRuntime.jsx(ui.Button, {
+        as: "a",
+        fontSize: 1,
+        href: target.href,
+        mode: "ghost",
+        padding: 2,
+        rel: "noreferrer",
+        target: "_blank",
+        text: target.label,
+        tone: "caution"
+    });
+}
+
+function DialogBody({children: children, document: document, separated: separated, ...props}) {
+    const {activityName: activityName, detail: detail, instanceId: instanceId, surface: surface} = props;
+    /* @__PURE__ */
+    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(DialogColumn, {
+            meta: /* @__PURE__ */ jsxRuntime.jsx(MetaBlock, {
+                ...props,
+                document: document
+            }),
+            separated: separated,
+            children: children
+        }), detail.presentation.terminalActions.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(TerminalFooter, {
+            actions: detail.presentation.terminalActions,
+            activity: activityName,
+            instanceId: instanceId,
+            surface: surface
+        }) : null ]
+    });
+}
+
+function DialogColumn({children: children, meta: meta, separated: separated}) {
+    /* @__PURE__ */
+    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ 
         /* @__PURE__ */ jsxRuntime.jsx(ui.Card, {
-            borderBottom: hasBody,
+            borderBottom: separated,
             style: {
                 position: "sticky",
                 top: 0,
                 zIndex: 2
             },
-            children: /* @__PURE__ */ jsxRuntime.jsx(MetaBlock, {
-                activityName: activityName,
-                definition: definition,
-                detail: detail,
-                document: document,
-                instanceId: instanceId
+            children: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
+                padding: 4,
+                children: meta
+            })
+        }), children === null ? null : /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
+            flex: 1,
+            overflow: "auto",
+            padding: 4,
+            children: /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, {
+                gap: 5,
+                children: children
+            })
+        }) ]
+    });
+}
+
+function MetaBlock({document: document, ...props}) {
+    const {detail: detail} = props, description = detail.activityEval.activity.description, status = detail.activityEval.status;
+    /* @__PURE__ */
+    return jsxRuntime.jsxs(ui.Stack, {
+        gap: 4,
+        children: [ description ? /* @__PURE__ */ jsxRuntime.jsx(MetaRow, {
+            label: "Description",
+            children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                size: 1,
+                children: description
             })
-        }), hasBody ? /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
-            padding: 4,
-            children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
-                gap: 5,
-                children: [ fault, detail.state.map(field => /* @__PURE__ */ jsxRuntime.jsx(FieldRow, {
-                    activityName: activityName,
-                    detail: detail,
-                    entry: entry,
-                    field: field,
-                    instanceId: instanceId
-                }, field._key)), notice ]
+        }) : null, 
+        /* @__PURE__ */ jsxRuntime.jsx(MetaRow, {
+            label: "Status",
+            children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
+                align: "center",
+                gap: 2,
+                children: [ 
+                /* @__PURE__ */ jsxRuntime.jsx(ActivityStatusIcon, {
+                    status: status
+                }), 
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                    size: 1,
+                    children: ACTIVITY_STATUS_LABEL[status]
+                }) ]
             })
-        }) : null ]
+        }), document ? /* @__PURE__ */ jsxRuntime.jsx(MetaRow, {
+            label: "Studio document",
+            children: /* @__PURE__ */ jsxRuntime.jsx(DocumentMetaValue, {
+                document: document
+            })
+        }) : null, 
+        /* @__PURE__ */ jsxRuntime.jsx(TopActions, {
+            ...props
+        }) ]
     });
 }
 
-function MetaBlock({detail: detail, definition: definition, document: document, instanceId: instanceId, activityName: activityName}) {
-    const description = detail.activityEval.activity.description, status = detail.activityEval.status;
+function DocumentMetaValue({document: document}) {
     /* @__PURE__ */
     return jsxRuntime.jsx(ui.Box, {
-        padding: 4,
-        children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
-            gap: 4,
-            children: [ description ? /* @__PURE__ */ jsxRuntime.jsx(MetaRow, {
-                label: "Description",
-                children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-                    size: 1,
-                    children: description
-                })
-            }) : null, 
-            /* @__PURE__ */ jsxRuntime.jsx(MetaRow, {
-                label: "Status",
-                children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
-                    align: "center",
-                    gap: 2,
-                    children: [ 
-                    /* @__PURE__ */ jsxRuntime.jsx(ActivityStatusIcon, {
-                        status: status
-                    }), 
-                    /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-                        size: 1,
-                        children: ACTIVITY_STATUS_LABEL[status]
-                    }) ]
-                })
-            }), document ? /* @__PURE__ */ jsxRuntime.jsx(MetaRow, {
-                label: "Studio document",
-                children: /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, {
-                    children: /* @__PURE__ */ jsxRuntime.jsx(DocPreviewLink, {
-                        gdr: document,
-                        layout: "inline",
-                        source: "dialog-subject"
-                    })
-                })
-            }) : null, 
-            /* @__PURE__ */ jsxRuntime.jsx(TopActions, {
-                activityName: activityName,
-                definition: definition,
-                detail: detail,
-                instanceId: instanceId
-            }) ]
+        style: useChipTrim(),
+        children: /* @__PURE__ */ jsxRuntime.jsx(DocPreviewLink, {
+            gdr: document,
+            layout: "inline",
+            source: "dialog-subject"
         })
     });
 }
 
-function TopActions({detail: detail, definition: definition, instanceId: instanceId, activityName: activityName}) {
+function TopActions({activityName: activityName, definition: definition, detail: detail, instanceId: instanceId, surface: surface}) {
     const p = detail.presentation;
     return p.actions.length === 0 && p.triggeredActions.length === 0 && !p.manualTarget ? null : /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
         align: "center",
@@ -5609,17 +5854,9 @@ function TopActions({detail: detail, definition: definition, instanceId: instanc
             activity: activityName,
             instanceId: instanceId,
             placement: "dialog-strip",
-            surface: "activity-dialog"
-        }, a.action.name)), p.manualTarget ? /* @__PURE__ */ jsxRuntime.jsx(ui.Button, {
-            as: "a",
-            fontSize: 1,
-            href: p.manualTarget.href,
-            mode: "ghost",
-            padding: 2,
-            rel: "noreferrer",
-            target: "_blank",
-            text: p.manualTarget.label,
-            tone: "caution"
+            surface: surface
+        }, a.action.name)), p.manualTarget ? /* @__PURE__ */ jsxRuntime.jsx(ManualTargetButton, {
+            target: p.manualTarget
         }) : null, p.triggeredActions.map(a => /* @__PURE__ */ jsxRuntime.jsx(AutomationActionRow, {
             actionEval: a,
             definition: definition
@@ -5627,7 +5864,7 @@ function TopActions({detail: detail, definition: definition, instanceId: instanc
     });
 }
 
-function FieldRow({field: field, detail: detail, entry: entry, activityName: activityName, instanceId: instanceId}) {
+function FieldRow({field: field, detail: detail, entry: entry, activityName: activityName, instanceId: instanceId, layout: layout, surface: surface, todoSurface: todoSurface}) {
     const head = /* @__PURE__ */ jsxRuntime.jsx(FieldHead, {
         label: field.title ?? field.name,
         ...field.description === void 0 ? {} : {
@@ -5647,10 +5884,10 @@ function FieldRow({field: field, detail: detail, entry: entry, activityName: act
                 activity: activityName
             },
             showEmpty: !0,
-            surface: "activity-dialog"
+            surface: todoSurface
         }) ]
     });
-    if (field._type === "assignees") {
+    if (field._type === "assignee" || field._type === "assignees") {
         const assignField = detail.assignFields.get(field.name);
         /* @__PURE__ */
         return jsxRuntime.jsxs(ui.Stack, {
@@ -5660,8 +5897,9 @@ function FieldRow({field: field, detail: detail, entry: entry, activityName: act
                 align: "center",
                 gap: 2,
                 wrap: "wrap",
-                children: [ 
-                /* @__PURE__ */ jsxRuntime.jsx(FieldValue, {
+                children: [ layout === "panel" ? /* @__PURE__ */ jsxRuntime.jsx(RowAssignees, {
+                    assignees: field.value
+                }) : /* @__PURE__ */ jsxRuntime.jsx(FieldValue, {
                     field: field
                 }), assignField ? /* @__PURE__ */ jsxRuntime.jsx(AssignActivityControl, {
                     instanceId: instanceId,
@@ -5669,7 +5907,7 @@ function FieldRow({field: field, detail: detail, entry: entry, activityName: act
                         kind: "editable",
                         field: assignField
                     },
-                    surface: "activity-dialog"
+                    surface: surface
                 }) : null ]
             }) ]
         });
@@ -5678,7 +5916,7 @@ function FieldRow({field: field, detail: detail, entry: entry, activityName: act
     return editable ? /* @__PURE__ */ jsxRuntime.jsx(EditableFieldControl, {
         field: editable,
         instanceId: instanceId,
-        surface: "activity-dialog"
+        surface: surface
     }) : /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
         gap: 2,
         children: [ head, 
@@ -5688,18 +5926,85 @@ function FieldRow({field: field, detail: detail, entry: entry, activityName: act
     });
 }
 
-function blockedNotice(detail) {
-    const reason = detail.presentation.blockedReason;
-    if (reason) /* @__PURE__ */
-    return jsxRuntime.jsx(ui.Card, {
+function activityNotice(detail) {
+    const reason = detail.presentation.blockedReason, holders = detail.presentation.holderGate;
+    if (!reason && holders === void 0) return;
+    let content2;
+    return holders === void 0 ? content2 = /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+        size: 1,
+        children: reason === void 0 ? "" : describeDisabledReason(reason)
+    }) : holders.length === 0 ? content2 = /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+        size: 1,
+        children: "Only a task holder can act, but no holder is selected."
+    }) : content2 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
+        align: "center",
+        gap: 2,
+        wrap: "wrap",
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+            size: 1,
+            children: "Only someone holding this task can act. Assigned to"
+        }), 
+        /* @__PURE__ */ jsxRuntime.jsx(RowAssignees, {
+            assignees: holders
+        }) ]
+    }), /* @__PURE__ */ jsxRuntime.jsx(ui.Card, {
         border: !0,
         padding: 3,
         radius: 2,
         tone: "caution",
-        children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-            size: 1,
-            children: describeDisabledReason(reason)
+        children: content2
+    });
+}
+
+function ActivityDetailDialog({entry: entry, activityName: activityName, breadcrumb: breadcrumb, definition: definition, document: document, source: source, onClose: onClose}) {
+    const detail = deriveActivityDetail({
+        entry: entry,
+        activityName: activityName
+    });
+    return detail ? /* @__PURE__ */ jsxRuntime.jsx(ui.Dialog, {
+        header: /* @__PURE__ */ jsxRuntime.jsx(Breadcrumb, {
+            emphasizeCurrent: !0,
+            segments: [ ...breadcrumb, detail.title ]
+        }),
+        id: "workflow-activity-detail",
+        onClose: onClose,
+        width: 1,
+        children: /* @__PURE__ */ jsxRuntime.jsx(ActivityDetailBody, {
+            activityName: activityName,
+            definition: definition,
+            document: document,
+            entry: entry,
+            layout: "dialog",
+            source: source,
+            surface: "activity-dialog",
+            todoSurface: "activity-dialog"
         })
+    }) : null;
+}
+
+const FOR_ME_SECTION_COPY = {
+    assignedTitle: "Tasks assigned to you",
+    roleDescription: "Unassigned tasks, sent to role groups you're part of",
+    roleTitle: "Tasks sent to your roles"
+};
+
+function ForMeSectionHeading({description: description, title: title}) {
+    /* @__PURE__ */
+    return jsxRuntime.jsxs(ui.Stack, {
+        gap: 2,
+        paddingLeft: 2,
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+            as: "h3",
+            size: 2,
+            weight: "semibold",
+            children: title
+        }), typeof description == "string" ? /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+            muted: !0,
+            size: 1,
+            children: description
+        }) : description ]
     });
 }
 
@@ -5719,36 +6024,23 @@ function CountedLabel({count: count, label: label}) {
     });
 }
 
-function CountedHeading({count: count, title: title}) {
-    /* @__PURE__ */
-    return jsxRuntime.jsx(CountedLabel, {
-        count: count,
-        label: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-            size: 1,
-            weight: "semibold",
-            children: title
-        })
-    });
-}
-
-function GroupHeading({busy: busy, count: count, title: title, end: end}) {
+function GroupHeading({busy: busy, count: count, title: title, action: action}) {
     /* @__PURE__ */
     return jsxRuntime.jsxs(ui.Flex, {
         align: "center",
-        gap: 3,
+        gap: 2,
         paddingLeft: 2,
-        paddingY: end === void 0 ? 3 : 1,
+        paddingY: action === void 0 ? 3 : 1,
         children: [ 
-        /* @__PURE__ */ jsxRuntime.jsx(CountedHeading, {
+        /* @__PURE__ */ jsxRuntime.jsx(CountedLabel, {
             count: count,
-            title: title
-        }), busy === void 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(SpinnerSlot, {
+            label: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                size: 2,
+                weight: "medium",
+                children: title
+            })
+        }), action, busy === void 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(SpinnerSlot, {
             busy: busy
-        }), end === void 0 ? null : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-            children: [ 
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, {
-                flex: 1
-            }), end ]
         }) ]
     });
 }
@@ -6207,13 +6499,10 @@ function peopleFaceOf(kind, entry) {
         kind: "assignees",
         assignees: entry?._type === "assignees" ? entry.value : []
     };
-    if (kind === "assignee") {
-        const value = entry?._type === "assignee" ? entry.value : null;
-        return {
-            kind: "assignees",
-            assignees: value ? [ value ] : []
-        };
-    }
+    if (kind === "assignee") return {
+        kind: "assignees",
+        assignees: entry?._type === "assignee" ? entry.value : []
+    };
 }
 
 function faceOf(args) {
@@ -6771,24 +7060,21 @@ function ActorPill({entry: entry, pill: pill, editability: editability, surface:
 }
 
 function AssigneePill({entry: entry, pill: pill, editability: editability, surface: surface}) {
-    const [open, setOpen] = react.useState(!1), {set: set, unset: unset} = useFieldCommit({
+    const [open, setOpen] = react.useState(!1), {set: set, saving: saving, save: save} = usePillWrite({
         entry: entry,
         editability: editability,
         surface: surface
-    }), current = pill.entry?._type === "assignee" ? pill.entry.value : null, {pick: pick} = useAssigneePick({
-        instanceId: entry.instance._id,
-        onSave: set,
-        onUnset: unset
-    });
+    }), current = pill.entry?._type === "assignee" ? pill.entry.value : [];
     /* @__PURE__ */
     return jsxRuntime.jsx(PillPopover, {
-        content: /* @__PURE__ */ jsxRuntime.jsx(SingleAssigneePicker, {
-            current: current,
+        content: /* @__PURE__ */ jsxRuntime.jsx(AssigneePicker, {
             eligibleRoles: editability.roles,
-            onPick: picked => {
-                setOpen(!1), pick(picked);
+            maxUsers: 1,
+            onChange: next => {
+                saving || save(() => set(next));
             },
-            roleAliases: editability.roleAliases
+            roleAliases: editability.roleAliases,
+            value: current
         }),
         onDismiss: () => setOpen(!1),
         onToggle: () => setOpen(v => !v),
@@ -7080,100 +7366,6 @@ function conditionLines(description) {
     });
 }
 
-function Hairline({weight: weight, style: style}) {
-    const {color: color} = ui.useTheme_v2();
-    /* @__PURE__ */
-    return jsxRuntime.jsx("div", {
-        style: {
-            borderTop: `${weight}px solid ${color.border}`,
-            ...style
-        }
-    });
-}
-
-function StageGlyph(props) {
-    /* @__PURE__ */
-    return jsxRuntime.jsxs("svg", {
-        "data-sanity-icon": "stage",
-        fill: "none",
-        height: "1em",
-        viewBox: "0 0 25 25",
-        width: "1em",
-        xmlns: "http://www.w3.org/2000/svg",
-        ...props,
-        children: [ 
-        /* @__PURE__ */ jsxRuntime.jsx("path", {
-            d: "M14.7998 12.5C14.7998 11.2295 13.7705 10.2002 12.5 10.2002C11.2295 10.2002 10.2002 11.2295 10.2002 12.5C10.2002 13.7705 11.2295 14.7998 12.5 14.7998V16C10.5668 16 9 14.4332 9 12.5C9 10.5668 10.5668 9 12.5 9C14.4332 9 16 10.5668 16 12.5C16 14.4332 14.4332 16 12.5 16V14.7998C13.7705 14.7998 14.7998 13.7705 14.7998 12.5Z",
-            fill: "currentColor"
-        }), 
-        /* @__PURE__ */ jsxRuntime.jsx("path", {
-            d: "M4.5 12.5C4.5 12.1687 4.76863 11.9 5.1 11.9H9.5V13.1H5.1C4.76863 13.1 4.5 12.8314 4.5 12.5V12.5Z",
-            fill: "currentColor"
-        }), 
-        /* @__PURE__ */ jsxRuntime.jsx("path", {
-            d: "M15.5 11.9H19.9C20.2314 11.9 20.5 12.1687 20.5 12.5V12.5C20.5 12.8314 20.2314 13.1 19.9 13.1H15.5V11.9Z",
-            fill: "currentColor"
-        }) ]
-    });
-}
-
-function StageFace({completed: completed = !1, detail: detail, glyph: glyph = !0, title: title}) {
-    const tone = completed ? "default" : "primary";
-    /* @__PURE__ */
-    return jsxRuntime.jsxs(ui.Flex, {
-        align: "center",
-        as: "span",
-        gap: 2,
-        children: [ glyph ? /* @__PURE__ */ jsxRuntime.jsx(sanity.TextWithTone, {
-            size: 1,
-            tone: tone,
-            children: completed ? /* @__PURE__ */ jsxRuntime.jsx(CheckmarkCircleFilledIcon, {
-                style: {
-                    color: "inherit"
-                }
-            }) : /* @__PURE__ */ jsxRuntime.jsx(StageGlyph, {
-                style: {
-                    color: "inherit"
-                }
-            })
-        }) : null, 
-        /* @__PURE__ */ jsxRuntime.jsx(sanity.TextWithTone, {
-            size: 1,
-            tone: tone,
-            weight: "medium",
-            children: title
-        }), detail === void 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-            muted: !0,
-            size: 1,
-            children: detail
-        }) ]
-    });
-}
-
-function StageChip({completed: completed = !1, detail: detail, interactive: interactive = !1, title: title}) {
-    const {color: color} = ui.useTheme_v2();
-    /* @__PURE__ */
-    return jsxRuntime.jsx(ui.Card, {
-        padding: 3,
-        radius: 4,
-        style: {
-            boxShadow: `inset 0 0 0 1px ${completed ? color.badge.default.fg : color.focusRing}`,
-            cursor: interactive ? "help" : "default"
-        },
-        tone: completed ? "default" : "primary",
-        ...interactive ? {
-            tabIndex: 0
-        } : {},
-        children: /* @__PURE__ */ jsxRuntime.jsx(StageFace, {
-            completed: completed,
-            title: title,
-            ...detail === void 0 ? {} : {
-                detail: detail
-            }
-        })
-    });
-}
-
 function StartIncompleteBadge({style: style}) {
     /* @__PURE__ */
     return jsxRuntime.jsx(ui.Badge, {
@@ -7204,7 +7396,7 @@ function abortedToast(title) {
     return {
         id: TOAST_ID.abort,
         status: "info",
-        title: `Aborted “${title}”`
+        title: `Canceled “${title}”`
     };
 }
 
@@ -7213,7 +7405,7 @@ function abortAlreadySettledToast(title) {
         id: TOAST_ID.abort,
         status: "info",
         title: `“${title}” had already finished`,
-        description: "Nothing was aborted — the workflow reached a terminal state first."
+        description: "Nothing was canceled — the workflow reached a terminal state first."
     };
 }
 
@@ -7221,8 +7413,8 @@ function abortUnconfirmedToast(args) {
     return {
         id: TOAST_ID.abort,
         status: "warning",
-        title: `Couldn’t confirm “${args.title}” was aborted`,
-        description: `${describeError(args.err)} — the abort may still have committed, so check the workflow’s state before trying again.`
+        title: `Couldn’t confirm “${args.title}” was canceled`,
+        description: `${describeError(args.err)} — the cancellation may still have committed, so check the workflow’s state before trying again.`
     };
 }
 
@@ -7268,7 +7460,7 @@ function AbortWorkflowDialog({entry: entry, onClose: onClose}) {
                     mode: "bleed",
                     onClick: onClose,
                     padding: 2,
-                    text: "Cancel"
+                    text: "Keep workflow"
                 }), 
                 /* @__PURE__ */ jsxRuntime.jsx(ui.Button, {
                     disabled: reason === void 0,
@@ -7278,12 +7470,12 @@ function AbortWorkflowDialog({entry: entry, onClose: onClose}) {
                         confirm();
                     },
                     padding: 2,
-                    text: "Abort workflow",
+                    text: "Cancel workflow",
                     tone: "critical"
                 }) ]
             })
         }),
-        header: "Abort workflow",
+        header: "Cancel workflow",
         id: `abort-workflow-${instance._id}`,
         onClose: () => {
             pending || onClose();
@@ -7296,7 +7488,7 @@ function AbortWorkflowDialog({entry: entry, onClose: onClose}) {
                 children: [ 
                 /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, {
                     size: 1,
-                    children: [ "Abort the ", 
+                    children: [ "Cancel the ", 
                     /* @__PURE__ */ jsxRuntime.jsx("strong", {
                         children: title
                     }), " workflow? This cannot be undone." ]
@@ -7768,7 +7960,7 @@ function InstanceCardMenu({entry: entry, title: title}) {
                     /* @__PURE__ */ jsxRuntime.jsx(ui.MenuDivider, {}), 
                     /* @__PURE__ */ jsxRuntime.jsx(ui.MenuItem, {
                         onClick: () => setDialog("abort"),
-                        text: "Abort workflow…",
+                        text: "Cancel workflow…",
                         tone: "critical"
                     }) ]
                 }) : null ]
@@ -7787,90 +7979,97 @@ function InstanceCardMenu({entry: entry, title: title}) {
     });
 }
 
+const HeaderHoverZone = styledComponents.styled.div`
+  position: relative;
+
+  /* Resting opacity cannot be inline: it outranks this hover rule. */
+  & > [data-header-fill] {
+    opacity: 0;
+  }
+
+  & > button:hover ~ [data-header-fill] {
+    opacity: 1;
+  }
+
+  /* Bleed paints surrounding-card white; :not() leaves Sanity hover/open tones. */
+  & [data-ui='MenuButton'] {
+    cursor: pointer;
+  }
+
+  & [data-ui='MenuButton']:not(:hover):not([aria-expanded='true']) {
+    background-color: transparent;
+  }
+`;
+
 function InstanceCard({entry: entry, children: children, defaultOpen: defaultOpen}) {
-    const definition = useDefinition(entry), {instance: instance} = entry, settled = !isLiveEntry(entry), [open, setOpen] = react.useState(defaultOpen ?? !settled), title = instanceTitle(instance, definition), menuSlot = useSpaceToken(2) * 2 + useTextIconSize();
+    const definition = useDefinition(entry), {instance: instance} = entry, settled = !isLiveEntry(entry), [open, setOpen] = react.useState(defaultOpen ?? !settled), title = instanceTitle(instance, definition);
     /* @__PURE__ */
     return jsxRuntime.jsxs(ui.Card, {
         border: !0,
         overflow: "hidden",
         radius: 4,
         children: [ 
-        /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, {
-            style: {
-                position: "relative"
-            },
+        /* @__PURE__ */ jsxRuntime.jsxs(HeaderHoverZone, {
             children: [ 
             /* @__PURE__ */ jsxRuntime.jsx(ui.Card, {
                 "aria-expanded": open,
+                "aria-label": title,
                 as: "button",
                 onClick: () => setOpen(value => !value),
-                padding: 3,
                 style: {
-                    display: "block",
-                    textAlign: "left",
+                    backgroundColor: "transparent",
+                    cursor: "pointer",
+                    inset: 0,
+                    position: "absolute",
                     width: "100%"
-                },
-                ...open ? {
-                    tone: "transparent"
-                } : {},
-                children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
-                    align: "center",
-                    gap: 3,
-                    children: [ 
-                    /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-                        muted: !0,
-                        size: 1,
-                        children: open ? /* @__PURE__ */ jsxRuntime.jsx(ChevronDown.ChevronDownIcon, {}) : /* @__PURE__ */ jsxRuntime.jsx(ChevronRight.ChevronRightIcon, {})
-                    }), 
-                    /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
-                        flex: 1,
-                        gap: 2,
-                        style: {
-                            minWidth: 0
-                        },
-                        children: [ 
-                        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-                            size: 1,
-                            textOverflow: "ellipsis",
-                            weight: "medium",
-                            children: title
-                        }), 
-                        /* @__PURE__ */ jsxRuntime.jsx(HeaderStage, {
-                            entry: entry
-                        }) ]
-                    }), 
-                    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
-                        align: "center",
-                        flex: "none",
-                        children: [ 
-                        /* @__PURE__ */ jsxRuntime.jsx(HeaderBadges, {
-                            instance: instance,
-                            settled: settled
-                        }), 
-                        /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
-                            flex: "none",
-                            style: {
-                                width: menuSlot
-                            }
-                        }) ]
-                    }) ]
-                })
+                }
+            }), 
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Card, {
+                "data-header-fill": !0,
+                style: {
+                    inset: 0,
+                    pointerEvents: "none",
+                    position: "absolute"
+                },
+                tone: "transparent"
             }), 
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, {
+            /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
                 align: "center",
+                gap: 2,
+                padding: 3,
                 style: {
-                    bottom: 0,
-                    position: "absolute",
-                    right: 0,
-                    top: 0
+                    pointerEvents: "none",
+                    position: "relative"
                 },
-                children: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
-                    paddingRight: 3,
+                children: [ 
+                /* @__PURE__ */ jsxRuntime.jsx(HeaderTitleLine, {
+                    entry: entry
+                }), 
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
+                    flex: "none",
+                    style: {
+                        pointerEvents: "auto"
+                    },
                     children: /* @__PURE__ */ jsxRuntime.jsx(InstanceCardMenu, {
                         entry: entry,
                         title: title
                     })
-                })
+                }), 
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
+                    flex: 1
+                }), 
+                /* @__PURE__ */ jsxRuntime.jsx(HeaderBadges, {
+                    instance: instance,
+                    settled: settled
+                }), 
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
+                    paddingRight: 1,
+                    children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                        muted: !0,
+                        size: 1,
+                        children: open ? /* @__PURE__ */ jsxRuntime.jsx(ChevronDown.ChevronDownIcon, {}) : /* @__PURE__ */ jsxRuntime.jsx(ChevronRight.ChevronRightIcon, {})
+                    })
+                }) ]
             }) ]
         }), open ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
             children: [ 
@@ -7885,24 +8084,39 @@ function InstanceCard({entry: entry, children: children, defaultOpen: defaultOpe
     });
 }
 
-function HeaderStage({entry: entry}) {
+function HeaderTitleLine({entry: entry}) {
     const definition = useDefinition(entry), badgeTrim = useBadgeCapTrim(), face = instanceStageFace({
         definition: definition,
         instance: entry.instance
     });
     /* @__PURE__ */
-    return jsxRuntime.jsx(ui.Flex, {
+    return jsxRuntime.jsxs(ui.Flex, {
         align: "center",
-        children: face === void 0 ? /* @__PURE__ */ jsxRuntime.jsx(StartIncompleteBadge, {
+        gap: 2,
+        style: {
+            minWidth: 0
+        },
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+            size: 1,
+            textOverflow: "ellipsis",
+            weight: "medium",
+            children: instanceTitle(entry.instance, definition)
+        }), face === void 0 ? /* @__PURE__ */ jsxRuntime.jsx(StartIncompleteBadge, {
             style: badgeTrim
-        }) : /* @__PURE__ */ jsxRuntime.jsx(StageFace, {
-            ...face.detail === void 0 ? {} : {
-                detail: face.detail
-            },
-            completed: face.completed,
-            glyph: !1,
-            title: face.title
-        })
+        }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+            children: [ 
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                muted: !0,
+                size: 1,
+                textOverflow: "ellipsis",
+                children: `/ ${face.title}`
+            }), face.detail === void 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                muted: !0,
+                size: 1,
+                children: face.detail
+            }) ]
+        }) ]
     });
 }
 
@@ -7913,7 +8127,10 @@ function HeaderBadges({instance: instance, settled: settled}) {
         align: "center",
         flex: "none",
         gap: 2,
-        style: badgeTrim,
+        style: {
+            ...badgeTrim,
+            pointerEvents: "auto"
+        },
         children: [ 
         /* @__PURE__ */ jsxRuntime.jsx(AbortedBadge, {
             instance: instance
@@ -7952,6 +8169,90 @@ function PartOfBand({instance: instance}) {
     });
 }
 
+function StageGlyph(props) {
+    /* @__PURE__ */
+    return jsxRuntime.jsxs("svg", {
+        "data-sanity-icon": "stage",
+        fill: "none",
+        height: "1em",
+        viewBox: "0 0 25 25",
+        width: "1em",
+        xmlns: "http://www.w3.org/2000/svg",
+        ...props,
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx("path", {
+            d: "M14.7998 12.5C14.7998 11.2295 13.7705 10.2002 12.5 10.2002C11.2295 10.2002 10.2002 11.2295 10.2002 12.5C10.2002 13.7705 11.2295 14.7998 12.5 14.7998V16C10.5668 16 9 14.4332 9 12.5C9 10.5668 10.5668 9 12.5 9C14.4332 9 16 10.5668 16 12.5C16 14.4332 14.4332 16 12.5 16V14.7998C13.7705 14.7998 14.7998 13.7705 14.7998 12.5Z",
+            fill: "currentColor"
+        }), 
+        /* @__PURE__ */ jsxRuntime.jsx("path", {
+            d: "M4.5 12.5C4.5 12.1687 4.76863 11.9 5.1 11.9H9.5V13.1H5.1C4.76863 13.1 4.5 12.8314 4.5 12.5V12.5Z",
+            fill: "currentColor"
+        }), 
+        /* @__PURE__ */ jsxRuntime.jsx("path", {
+            d: "M15.5 11.9H19.9C20.2314 11.9 20.5 12.1687 20.5 12.5V12.5C20.5 12.8314 20.2314 13.1 19.9 13.1H15.5V11.9Z",
+            fill: "currentColor"
+        }) ]
+    });
+}
+
+function StageFace({completed: completed = !1, detail: detail, title: title}) {
+    const tone = completed ? "default" : "primary";
+    /* @__PURE__ */
+    return jsxRuntime.jsxs(ui.Flex, {
+        align: "center",
+        as: "span",
+        gap: 2,
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(sanity.TextWithTone, {
+            size: 1,
+            tone: tone,
+            children: completed ? /* @__PURE__ */ jsxRuntime.jsx(CheckmarkCircleFilledIcon, {
+                style: {
+                    color: "inherit"
+                }
+            }) : /* @__PURE__ */ jsxRuntime.jsx(StageGlyph, {
+                style: {
+                    color: "inherit"
+                }
+            })
+        }), 
+        /* @__PURE__ */ jsxRuntime.jsx(sanity.TextWithTone, {
+            size: 1,
+            tone: tone,
+            weight: "medium",
+            children: title
+        }), detail === void 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+            muted: !0,
+            size: 1,
+            children: detail
+        }) ]
+    });
+}
+
+function StageChip({completed: completed = !1, detail: detail, interactive: interactive = !1, title: title}) {
+    const {color: color} = ui.useTheme_v2();
+    /* @__PURE__ */
+    return jsxRuntime.jsx(ui.Card, {
+        padding: 3,
+        radius: 4,
+        style: {
+            boxShadow: `inset 0 0 0 1px ${completed ? color.badge.default.fg : color.focusRing}`,
+            cursor: interactive ? "help" : "default"
+        },
+        tone: completed ? "default" : "primary",
+        ...interactive ? {
+            tabIndex: 0
+        } : {},
+        children: /* @__PURE__ */ jsxRuntime.jsx(StageFace, {
+            completed: completed,
+            title: title,
+            ...detail === void 0 ? {} : {
+                detail: detail
+            }
+        })
+    });
+}
+
 const NODE_ICON = {
     done: CheckmarkCircle.CheckmarkCircleIcon
 };
@@ -8018,6 +8319,7 @@ function SpineNodeView({definition: definition, node: node, transitions: transit
         "data-testid": `spine-node-${node.name}`,
         flush: !0,
         children: /* @__PURE__ */ jsxRuntime.jsx(InertPill, {
+            filled: node.state === "upcoming" || node.state === "revisit",
             children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
                 align: "center",
                 gap: 2,
@@ -8035,14 +8337,16 @@ function SpineNodeView({definition: definition, node: node, transitions: transit
     });
 }
 
-function InertPill({children: children}) {
+function InertPill({children: children, filled: filled = !1}) {
     const {color: color} = ui.useTheme_v2();
     /* @__PURE__ */
     return jsxRuntime.jsx(ui.Card, {
         padding: 3,
         radius: 4,
         style: {
-            backgroundColor: "transparent",
+            ...filled ? {} : {
+                backgroundColor: "transparent"
+            },
             boxShadow: `inset 0 0 0 1px ${color.border}`,
             cursor: "help"
         },
@@ -8188,9 +8492,7 @@ function InstanceSnapshotBody({entry: entry, onOpenActivity: onOpenActivity, sur
             /* @__PURE__ */ jsxRuntime.jsx(ui.Card, {
                 borderBottom: !0,
                 padding: 2,
-                ...definition ? {} : {
-                    tone: "caution"
-                },
+                tone: definition ? "transparent" : "caution",
                 children: definition ? /* @__PURE__ */ jsxRuntime.jsx(WorkflowSpine, {
                     definition: definition,
                     evaluation: entry.evaluation,
@@ -8344,21 +8646,6 @@ function InvalidDocNotice({invalid: invalid}) {
     });
 }
 
-function RoleAssignedNotice() {
-    /* @__PURE__ */
-    return jsxRuntime.jsx(ui.Box, {
-        padding: 2,
-        children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
-            muted: !0,
-            size: 1,
-            style: {
-                fontStyle: "italic"
-            },
-            children: "Including tasks assigned to your role"
-        })
-    });
-}
-
 function TabSwitch({ariaControls: ariaControls, idPrefix: idPrefix, options: options, selected: selected, onSelect: onSelect}) {
     /* @__PURE__ */
     return jsxRuntime.jsx(ui.TabList, {
@@ -9125,7 +9412,7 @@ function StartWorkflowMenuItem({mapping: mapping, docId: docId, initialValue: in
     }) : item;
 }
 
-function ForMeList({entry: entry, work: work, identity: identity, onOpenActivity: onOpenActivity}) {
+function ForMeList({entry: entry, work: work, identity: identity, assignment: assignment, onOpenActivity: onOpenActivity}) {
     const definition = useDefinition(entry), {instance: instance} = entry, itemCount = work.openItems.length + work.doneItems.length;
     if (!hasAssignedRows(work)) return null;
     const activityState = stateByActivity(instance), breadcrumb = instanceBreadcrumb(instance, definition);
@@ -9149,7 +9436,8 @@ function ForMeList({entry: entry, work: work, identity: identity, onOpenActivity
                 entry: entry,
                 filter: {
                     kind: "mine",
-                    identity: identity
+                    identity: identity,
+                    assignment: assignment
                 },
                 surface: "document-view-for-me"
             }) : null ]
@@ -9264,10 +9552,7 @@ function WorkflowsPanel({entries: entries, documentId: documentId, docTypeMappin
             padding: 3,
             children: [ 
             /* @__PURE__ */ jsxRuntime.jsx(GroupHeading, {
-                busy: booting,
-                count: active.length,
-                end: 
-                /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
+                action: /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, {
                     style: {
                         visibility: view === "for-me" ? "hidden" : "visible"
                     },
@@ -9281,6 +9566,7 @@ function WorkflowsPanel({entries: entries, documentId: documentId, docTypeMappin
                         tone: "default"
                     })
                 }),
+                busy: booting,
                 title: "Active Workflows"
             }), 
             /* @__PURE__ */ jsxRuntime.jsx(TabSwitch, {
@@ -9384,21 +9670,50 @@ function OverviewEmptyState({mappings: mappings, docId: docId, initialValue: ini
 
 function ForMeTab({forMe: forMe, assignedWorkUnknown: assignedWorkUnknown, onOpenActivity: onOpenActivity}) {
     return forMe.hasRows ? /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
-        gap: GROUP_GAP,
+        gap: 6,
         paddingBottom: 4,
-        children: [ forMe.hasRoleMatched ? /* @__PURE__ */ jsxRuntime.jsx(RoleAssignedNotice, {}) : null, forMe.work.map(({entry: entry, who: who, shown: shown}) => /* @__PURE__ */ jsxRuntime.jsx(ForMeList, {
-            entry: entry,
-            identity: who,
-            work: shown,
-            onOpenActivity: activityName => onOpenActivity({
-                instanceId: entry.instance._id,
-                activityName: activityName,
-                stage: entry.instance.currentStage
-            })
-        }, entry.instance._id)) ]
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(DocumentForMeSection, {
+            assignment: "you",
+            onOpenActivity: onOpenActivity,
+            title: FOR_ME_SECTION_COPY.assignedTitle,
+            work: forMe.assignedToUser
+        }), 
+        /* @__PURE__ */ jsxRuntime.jsx(DocumentForMeSection, {
+            assignment: "role",
+            description: FOR_ME_SECTION_COPY.roleDescription,
+            onOpenActivity: onOpenActivity,
+            title: FOR_ME_SECTION_COPY.roleTitle,
+            work: forMe.assignedToRoles
+        }) ]
     }) : assignedWorkUnknown ? null : /* @__PURE__ */ jsxRuntime.jsx(ForMeEmptyState, {});
 }
 
+function DocumentForMeSection({assignment: assignment, description: description, onOpenActivity: onOpenActivity, title: title, work: work}) {
+    return hasForMeRows(work) ? /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
+        gap: 3,
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(ForMeSectionHeading, {
+            description: description,
+            title: title
+        }), 
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, {
+            gap: GROUP_GAP,
+            children: work.map(({entry: entry, who: who, shown: shown}) => /* @__PURE__ */ jsxRuntime.jsx(ForMeList, {
+                assignment: assignment,
+                entry: entry,
+                identity: who,
+                work: shown,
+                onOpenActivity: activityName => onOpenActivity({
+                    instanceId: entry.instance._id,
+                    activityName: activityName,
+                    stage: entry.instance.currentStage
+                })
+            }, entry.instance._id))
+        }) ]
+    }) : null;
+}
+
 function SectionActivityDialog({entry: entry, activityName: activityName, onClose: onClose}) {
     const definition = useDefinition(entry), {instance: instance} = entry;
     /* @__PURE__ */
@@ -9420,6 +9735,44 @@ function workflowDefaultDocumentNode() {
     return S => S.document().views([ S.view.form(), workflowsView(S) ]);
 }
 
+function publishedMutation(args) {
+    const {draft: draft, published: published, publishedId: publishedId} = args;
+    if (draft !== null) return {
+        before: published === null ? null : {
+            ...published,
+            _id: publishedId
+        },
+        after: {
+            ...draft,
+            _id: publishedId
+        },
+        action: published === null ? "create" : "update"
+    };
+}
+
+function deletionMutation(document, id) {
+    if (document !== null) return {
+        before: {
+            ...document,
+            _id: id
+        },
+        after: null,
+        action: "delete"
+    };
+}
+
+function lakeMutationForDocumentAction(args) {
+    const {action: action, draft: draft, published: published} = args, publishedId = csm.getPublishedId(args.id);
+    if (action === "publish") return publishedMutation({
+        draft: draft,
+        published: published,
+        publishedId: publishedId
+    });
+    if (action === "unpublish") return deletionMutation(published, publishedId);
+    const current = draft ?? published;
+    return deletionMutation(current, current?._id ?? args.id);
+}
+
 function lockTitleFor(args) {
     const {denials: denials, entries: entries} = args;
     if (denials.length === 0) return;
@@ -9781,6 +10134,34 @@ function useDefaultLayout(props) {
     return react.useMemo(() => props.renderDefault(props), [ props ]);
 }
 
+const WARM_DEMAND_MS = 3e4, WARM_DEMAND_LIMIT = 4;
+
+function useWarmDemand(args) {
+    const {acquire: acquire, release: release} = args, warm = react.useRef(/* @__PURE__ */ new Map), cool = react.useCallback(id => {
+        const expiry = warm.current.get(id);
+        expiry !== void 0 && (clearTimeout(expiry), warm.current.delete(id), release(id));
+    }, [ release ]);
+    react.useEffect(() => () => {
+        for (const expiry of warm.current.values()) clearTimeout(expiry);
+        warm.current.clear();
+    }, []);
+    const acquireWarm = react.useCallback(id => {
+        acquire(id), cool(id);
+    }, [ acquire, cool ]), releaseWarm = react.useCallback(id => {
+        const expiry = warm.current.get(id);
+        for (expiry === void 0 ? acquire(id) : clearTimeout(expiry), release(id), warm.current.delete(id), 
+        warm.current.set(id, setTimeout(() => cool(id), WARM_DEMAND_MS)); warm.current.size > WARM_DEMAND_LIMIT; ) {
+            const oldest = warm.current.keys().next().value;
+            if (oldest === void 0) return;
+            cool(oldest);
+        }
+    }, [ acquire, release, cool ]);
+    return {
+        acquire: acquireWarm,
+        release: releaseWarm
+    };
+}
+
 const notReady = (..._args) => Promise.reject(new Error("workflow session not ready yet")), NO_REGISTERED_DOCUMENTS = [], DEMAND_RELEASE_GRACE_MS = 500;
 
 function workspaceParts(config) {
@@ -9845,17 +10226,6 @@ function DiscoverySubscription(props) {
     }, [ instances, invalid, registered, onSnapshot ]), null;
 }
 
-function engineOptionsFrom(config) {
-    return {
-        ...config.effectHandlers ? {
-            effectHandlers: config.effectHandlers
-        } : {},
-        ...config.resourceClients ? {
-            resourceClients: config.resourceClients
-        } : {}
-    };
-}
-
 function WorkflowProvider(props) {
     const {config: config} = props, defaultLayout = useDefaultLayout(props), studioClient = sanity.useClient({
         apiVersion: WORKFLOW_API_VERSION
@@ -9869,11 +10239,18 @@ function WorkflowProvider(props) {
             id: `${projectId}.${contentDataset}`
         },
         tag: config.tag
-    }), [ projectId, workflowDataset, contentDataset, config.tag ]), engine = workflowStudio.useWorkflowEngine({
+    }), [ projectId, workflowDataset, contentDataset, config.tag ]), effects = react.useMemo(() => ({
+        missingHandler: "skip",
+        ...config.effectHandlers ? {
+            handlers: config.effectHandlers
+        } : {}
+    }), [ config.effectHandlers ]), engine = workflowStudio.useWorkflowEngine({
         workflowResource: binding.engineResource,
         tag: config.tag,
-        missingHandler: "skip",
-        ...engineOptionsFrom(config)
+        effects: effects,
+        ...config.resourceClients ? {
+            resourceClients: config.resourceClients
+        } : {}
     }), grantsFromPath = workflowEngine.aclPathForResource({
         type: "dataset",
         id: `${projectId}.${workflowDataset}`
@@ -9883,8 +10260,14 @@ function WorkflowProvider(props) {
         registerActive(id), retainRegistration(id);
     }, [ registerActive, retainRegistration ]), unregister = react.useCallback(id => {
         unregisterActive(id), releaseRegistration(id);
-    }, [ unregisterActive, releaseRegistration ]), {ids: requested, acquire: requestInstance, release: releaseInstance} = workflowReact.useRefcountedIds(), {ids: evaluationDemand, acquire: requestEvaluation, release: releaseEvaluation} = workflowReact.useRefcountedIds({
+    }, [ unregisterActive, releaseRegistration ]), {ids: requested, acquire: acquireRequested, release: dropRequested} = workflowReact.useRefcountedIds(), {acquire: requestInstance, release: releaseInstance} = useWarmDemand({
+        acquire: acquireRequested,
+        release: dropRequested
+    }), {ids: evaluationDemand, acquire: acquireEvaluation, release: dropEvaluation} = workflowReact.useRefcountedIds({
         releaseDelayMs: DEMAND_RELEASE_GRACE_MS
+    }), {acquire: requestEvaluation, release: releaseEvaluation} = useWarmDemand({
+        acquire: acquireEvaluation,
+        release: dropEvaluation
     }), [seeded, setSeeded] = react.useState(/* @__PURE__ */ new Map), seedInstance = react.useCallback(instance => {
         setSeeded(prev => new Map(prev).set(instance._id, instance));
     }, []), [startRequest2, setStartRequest] = react.useState(void 0), openStartDialog = react.useCallback(r => setStartRequest(r), []), closeStartDialog = react.useCallback(() => setStartRequest(void 0), []), [entriesStore] = react.useState(createEntriesStore);
@@ -9997,7 +10380,7 @@ function WorkflowProvider(props) {
         mappingStarts: starts,
         mappingFields: fields,
         latestDefinitionVersions: latestVersions,
-        effectHandlers: engine.effectHandlers,
+        effectHandlers: engine.effects.handlers,
         autoStartByType: autoStartByType,
         autoStartDefinitions: autoStartDefinitions
     }), [ register, unregister, isDocResolved, entriesStore, actualTypes, requestInstance, releaseInstance, requestEvaluation, releaseEvaluation, seedInstance, openStartDialog, closeStartDialog, startRequest2, loading, discoveryInvalid, fireActionFor, editFieldFor, previewFieldFor, discardFieldPreviewFor, drainEffectsFor, completeEffectFor, engine, binding, mappings, config.previewHydration, issues, starts, fields, latestVersions, autoStartByType, autoStartDefinitions ]);
@@ -10102,7 +10485,43 @@ function logOnce(messages, logged) {
     for (const message of messages) logged.has(message) || (logged.add(message), console.warn(`[workflow-studio-plugin] ${message}`));
 }
 
-function AssigneesInput({value: value, onChange: onChange, eligibleRoles: eligibleRoles, roleAliases: roleAliases}) {
+function sameGuardIds(previous, next) {
+    return previous.length === next.length && previous.every((guard, index) => guard._id === next[index]?._id);
+}
+
+function useActionLockDenials(args) {
+    const [denials, setDenials] = react.useState([]), applyDenials = denied => setDenials(previous => sameGuardIds(previous, denied) ? previous : denied), currentMutation = react.useEffectEvent(() => lakeMutationForDocumentAction({
+        action: args.action,
+        id: args.id,
+        draft: args.draft,
+        published: args.published
+    }));
+    return react.useEffect(() => {
+        if (applyDenials([]), args.guards.length === 0) return;
+        const mutation = currentMutation();
+        if (mutation === void 0) return;
+        let cancelled = !1;
+        return (async () => {
+            const denied = await workflowEngine.documentActionDenials({
+                mutation: mutation,
+                resource: args.resource,
+                guards: args.guards,
+                dereference: args.dereference,
+                ...args.identity !== void 0 ? {
+                    identity: args.identity
+                } : {}
+            });
+            cancelled || applyDenials(denied);
+        })().catch(error => {
+            console.error("[workflow-studio-plugin] document-action guard evaluation failed:", error);
+        }), () => {
+            cancelled = !0;
+        };
+    }, [ args.id, args.draft?._id, args.draft?._rev, args.published?._id, args.published?._rev, args.guards, args.action, args.resource, args.identity, args.dereference ]), 
+    denials;
+}
+
+function AssigneesInput({value: value, onChange: onChange, eligibleRoles: eligibleRoles, roleAliases: roleAliases, maxUsers: maxUsers}) {
     const [open, setOpen] = react.useState(!1), remove = index => onChange(value.filter((_, i) => i !== index));
     /* @__PURE__ */
     return jsxRuntime.jsxs(ui.Stack, {
@@ -10137,6 +10556,7 @@ function AssigneesInput({value: value, onChange: onChange, eligibleRoles: eligib
             children: /* @__PURE__ */ jsxRuntime.jsx(DismissablePopover, {
                 content: /* @__PURE__ */ jsxRuntime.jsx(AssigneePicker, {
                     eligibleRoles: eligibleRoles,
+                    maxUsers: maxUsers,
                     onChange: next => onChange([ ...next ]),
                     roleAliases: roleAliases,
                     value: value
@@ -10503,6 +10923,13 @@ const docRefInput = ({entry: entry, docType: docType, releaseId: releaseId, valu
         roleAliases: roleAliases,
         value: value ?? []
     }),
+    assignee: ({entry: entry, roleAliases: roleAliases, value: value, onChange: onChange}) => /* @__PURE__ */ jsxRuntime.jsx(AssigneesInput, {
+        eligibleRoles: entry.roles,
+        maxUsers: 1,
+        onChange: onChange,
+        roleAliases: roleAliases,
+        value: value ?? []
+    }),
     array: ({entry: entry, value: value, onChange: onChange}) => {
         const editor = arrayEditorKind(entry);
         if (editor === "notes") /* @__PURE__ */ return jsxRuntime.jsx(NotesStartInput, {
@@ -11332,9 +11759,9 @@ function StripLines({active: active, docId: docId, finished: finished, initialVa
 
 function lineHint(entry, identity) {
     const forMe = forMeWorkOf([ entry ], identity);
-    return forMe.work.some(({shown: shown}) => hasOpenAssignedWork(shown)) ? {
+    return forMe.assignedToUser.some(({shown: shown}) => hasOpenAssignedWork(shown)) ? {
         content: /* @__PURE__ */ jsxRuntime.jsx(AssignedTasksHint, {
-            work: forMe.work
+            work: forMe.assignedToUser
         }),
         wide: !0
     } : unassignedLineHint({
@@ -11545,31 +11972,21 @@ const workflowsTool = {
 }, LOCKABLE_ACTIONS = /* @__PURE__ */ new Map([ [ "delete", "delete" ], [ "publish", "publish" ], [ "unpublish", "unpublish" ] ]);
 
 function useDocumentActionLock(action, props) {
-    const {binding: binding} = useWorkflowContext(), identity = sanity.useCurrentUser()?.id, doc = props.draft ?? props.published, {entries: entries} = useWorkflowsForDocument(doc?._id ?? props.id), active = react.useMemo(() => entries.filter(isLiveEntry), [ entries ]), guards = react.useMemo(() => active.flatMap(entry => entry.guards ?? []), [ active ]), [denials, setDenials] = react.useState([]), resource = binding.contentResource, applyDenials = denied => setDenials(prev => prev.length === 0 && denied.length === 0 ? prev : denied);
-    return react.useEffect(() => {
-        if (!doc || guards.length === 0) {
-            applyDenials([]);
-            return;
-        }
-        let cancelled = !1;
-        return (async () => {
-            const denied = await workflowEngine.documentActionDenials({
-                doc: doc,
-                resource: resource,
-                action: action,
-                guards: guards,
-                ...identity !== void 0 ? {
-                    identity: identity
-                } : {}
-            });
-            cancelled || applyDenials(denied);
-        })().catch(err => {
-            console.error("[workflow-studio-plugin] document-action guard evaluation failed:", err), 
-            cancelled || applyDenials([]);
-        }), () => {
-            cancelled = !0;
-        };
-    }, [ doc?._id, doc?._rev, guards, action, resource, identity ]), lockTitleFor({
+    const {binding: binding} = useWorkflowContext(), client = sanity.useClient({
+        apiVersion: WORKFLOW_API_VERSION
+    }), dereference = react.useMemo(() => workflowEngine.clientGuardDereference(client), [ client ]), identity = sanity.useCurrentUser()?.id, doc = props.draft ?? props.published, {entries: entries} = useWorkflowsForDocument(doc?._id ?? props.id), active = react.useMemo(() => entries.filter(isLiveEntry), [ entries ]), guards = react.useMemo(() => active.flatMap(entry => entry.guards ?? []), [ active ]), resource = binding.contentResource, denials = useActionLockDenials({
+        action: action,
+        id: props.id,
+        draft: props.draft,
+        published: props.published,
+        resource: resource,
+        guards: guards,
+        dereference: dereference,
+        ...identity !== void 0 ? {
+            identity: identity
+        } : {}
+    });
+    return lockTitleFor({
         denials: denials,
         entries: active
     });
@@ -11635,6 +12052,8 @@ function WorkflowRootInput(props) {
 
 exports.AbortWorkflowDialog = AbortWorkflowDialog;
 
+exports.ActivityDetailBody = ActivityDetailBody;
+
 exports.ActivityDetailDialog = ActivityDetailDialog;
 
 exports.ActivityLog = ActivityLog;
@@ -11645,9 +12064,11 @@ exports.AlertChip = AlertChip;
 
 exports.AlertGlyph = AlertGlyph;
 
+exports.Breadcrumb = Breadcrumb;
+
 exports.CodeChip = CodeChip;
 
-exports.CountedHeading = CountedHeading;
+exports.CountedLabel = CountedLabel;
 
 exports.DismissablePopover = DismissablePopover;
 
@@ -11657,6 +12078,12 @@ exports.DocRefFace = DocRefFace;
 
 exports.EmptyState = EmptyState;
 
+exports.FOR_ME_SECTION_COPY = FOR_ME_SECTION_COPY;
+
+exports.ForMeEmptyState = ForMeEmptyState;
+
+exports.ForMeSectionHeading = ForMeSectionHeading;
+
 exports.HoverHint = HoverHint;
 
 exports.InstanceFaultNote = InstanceFaultNote;
@@ -11677,9 +12104,13 @@ exports.MetricPair = MetricPair;
 
 exports.NoteBanner = NoteBanner;
 
+exports.OverlineHeading = OverlineHeading;
+
 exports.RUN_SEARCH_PARAM = RUN_SEARCH_PARAM;
 
-exports.RoleAssignedNotice = RoleAssignedNotice;
+exports.RowAssignees = RowAssignees;
+
+exports.SectionHeading = SectionHeading;
 
 exports.SpinnerSlot = SpinnerSlot;
 
@@ -11705,20 +12136,30 @@ exports.activityLabel = activityLabel;
 
 exports.assigneesOf = assigneesOf;
 
+exports.assignmentHolding = assignmentHolding;
+
 exports.countBy = countBy;
 
 exports.definitionFingerprint = definitionFingerprint;
 
 exports.definitionsRouteOf = definitionsRouteOf;
 
+exports.deriveActivityDetail = deriveActivityDetail;
+
 exports.describeError = describeError;
 
 exports.disambiguatedNames = disambiguatedNames;
 
 exports.dueDatesOf = dueDatesOf;
 
+exports.dueMomentSentence = dueMomentSentence;
+
 exports.findActivity = findActivity;
 
+exports.formatDate = formatDate;
+
+exports.formatShortAgo = formatShortAgo;
+
 exports.formatShortDateTime = formatShortDateTime;
 
 exports.formatTimeAgo = formatTimeAgo;