dsh-modellix 0.1.0 → 0.1.1

package/lib/client.js

@@ -911,7 +911,7 @@ const MODAL_DIALOG_SELECTOR = "[role=\"dialog\"][aria-modal=\"true\"]";
 * therefore uses only the ARIA modal contract and a marker owned by this
 * plugin; it does not depend on host classes or DOM structure.
 */
-function useExternalDialogGate(requestedOpen) {
+function useExternalDialogGate(requestedOpen, externalDialogOwner) {
 	const [decision, setDecision] = (0, react.useState)({
 		requestedOpen: false,
 		allowed: false
@@ -931,7 +931,7 @@ function useExternalDialogGate(requestedOpen) {
 		const reconcile = () => {
 			reconciliationQueued = false;
 			if (disposed) return;
-			const allowed = !hasVisibleExternalDialog(ownerDocument);
+			const allowed = !hasVisibleExternalDialog(ownerDocument, resolveExternalDialogOwner(externalDialogOwner));
 			setDecision((current) => current.requestedOpen && current.allowed === allowed ? current : {
 				requestedOpen: true,
 				allowed
@@ -962,12 +962,12 @@ function useExternalDialogGate(requestedOpen) {
 			disposed = true;
 			observer?.disconnect();
 		};
-	}, [requestedOpen]);
+	}, [externalDialogOwner, requestedOpen]);
 	return requestedOpen && decision.requestedOpen && decision.allowed;
 }
 /** Adds the focus behavior intentionally absent from the public Modal primitive. */
 function useDialogA11y(options) {
-	const { open, container, initialFocusSelector, mandatory, onEscape } = options;
+	const { open, container, externalDialogOwner, initialFocusSelector, mandatory, onEscape } = options;
 	const onEscapeRef = (0, react.useRef)(onEscape);
 	const restoreTargetRef = (0, react.useRef)(null);
 	onEscapeRef.current = onEscape;
@@ -1019,13 +1019,14 @@ function useDialogA11y(options) {
 			document.removeEventListener("keydown", onKeyDown, true);
 			unlockInert();
 			unlockScroll();
-			if (!hasVisibleExternalDialog(document)) {
+			if (!hasVisibleExternalDialog(document, resolveExternalDialogOwner(externalDialogOwner))) {
 				restoreFocus(restoreTargetRef.current, dialogRoot, appRoot);
 				restoreTargetRef.current = null;
 			}
 		};
 	}, [
 		container,
+		externalDialogOwner,
 		initialFocusSelector,
 		mandatory,
 		open
@@ -1111,8 +1112,11 @@ function restoreFocus(previous, dialog, appRoot) {
 		if (fallback !== void 0 && focus(fallback)) return;
 	}
 }
-function hasVisibleExternalDialog(ownerDocument) {
-	return [...ownerDocument.querySelectorAll(MODAL_DIALOG_SELECTOR)].some((candidate) => candidate.querySelector(MODELLIX_DIALOG_SENTINEL) === null && isVisibleDialog(candidate));
+function hasVisibleExternalDialog(ownerDocument, allowedOwner = null) {
+	return [...ownerDocument.querySelectorAll(MODAL_DIALOG_SELECTOR)].some((candidate) => candidate !== allowedOwner && candidate.querySelector(MODELLIX_DIALOG_SENTINEL) === null && isVisibleDialog(candidate));
+}
+function resolveExternalDialogOwner(owner) {
+	return owner?.current?.closest(MODAL_DIALOG_SELECTOR) ?? null;
 }
 function isVisibleDialog(candidate) {
 	if (candidate.tagName === "DIALOG" && !candidate.hasAttribute("open")) return false;
@@ -1276,7 +1280,7 @@ function CredentialStatus({ configured, source, verification, t }) {
 	});
 }
 function CredentialModal(props) {
-	const { open, mandatory, title, description, services, onServicesChange, busy, errorCode, onSave, onSaved, onCancel, laterLabel = "cancel", t } = props;
+	const { open, mandatory, title, description, services, onServicesChange, busy, errorCode, onSave, onSaved, onCancel, laterLabel = "cancel", t, externalDialogOwner } = props;
 	const [draft, setDraft] = (0, react.useState)("");
 	const [visible, setVisible] = (0, react.useState)(false);
 	const [displayedErrorCode, setDisplayedErrorCode] = (0, react.useState)(errorCode);
@@ -1286,7 +1290,7 @@ function CredentialModal(props) {
 	const helpId = `${keyId}-help`;
 	const errorId = `${keyId}-error`;
 	const errorPresentation = displayedErrorCode === null ? null : presentClientError(displayedErrorCode);
-	const surfaceOpen = useExternalDialogGate(open);
+	const surfaceOpen = useExternalDialogGate(open, externalDialogOwner);
 	const clear = (0, react.useCallback)(() => {
 		draftRef.current = "";
 		setDraft("");
@@ -1301,6 +1305,7 @@ function CredentialModal(props) {
 	useDialogA11y({
 		open: surfaceOpen,
 		container: contentRef,
+		externalDialogOwner,
 		initialFocusSelector: "[data-mdlx-initial-focus]",
 		mandatory,
 		onEscape: close
@@ -1686,6 +1691,11 @@ var CredentialDialogCoordinator = class {
 		if (this.#snapshot.activeOwner !== null) return;
 		this.#publish({ activeOwner: owner });
 	}
+	/** Lets an explicit Credential editor adopt a queued shell recovery prompt. */
+	openCredential(owner) {
+		if (this.#snapshot.activeOwner !== null && this.#snapshot.activeOwner !== "shell:credential-recovery") return;
+		this.#publish({ activeOwner: owner });
+	}
 	presentRecovery(token) {
 		if (token === this.#snapshot.dismissedRecoveryToken) return;
 		if (token === this.#snapshot.recoveryToken) {
@@ -1989,6 +1999,9 @@ function ModellixDesignView({ controller, settingsController, t }) {
 	(0, react.useEffect)(() => {
 		if (state.pending !== null) setOutcomeAnnouncement("");
 	}, [state.pending]);
+	(0, react.useEffect)(() => {
+		setOutcomeAnnouncement("");
+	}, [t]);
 	(0, react.useEffect)(() => {
 		if (snapshot === null) return;
 		const transition = designOutcomeTransition(previousOutcome.current, snapshot);
@@ -2081,7 +2094,7 @@ function ModellixDesignView({ controller, settingsController, t }) {
 							settings?.credential.writable === true && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
 								type: "button",
 								variant: "primary",
-								onClick: () => credentialDialogs.open(credentialDialogOwner),
+								onClick: () => credentialDialogs.openCredential(credentialDialogOwner),
 								children: t("configureToContinue")
 							}),
 							settings?.credential.source === "env" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
@@ -3177,6 +3190,7 @@ const en = {
 //#region src/client/SettingsSection.tsx
 function ModellixSettingsSection({ controller, t }) {
 	const state = useResourceState(controller.store);
+	const settingsSectionRef = (0, react.useRef)(null);
 	const snapshot = state.data;
 	const [services, setServices] = (0, react.useState)(null);
 	const [announcement, setAnnouncement] = (0, react.useState)("");
@@ -3204,6 +3218,9 @@ function ModellixSettingsSection({ controller, t }) {
 	(0, react.useEffect)(() => {
 		if (snapshot !== null) setServices(snapshot.services);
 	}, [snapshot?.settingsRevision]);
+	(0, react.useEffect)(() => {
+		setAnnouncement("");
+	}, [t]);
 	const busy = state.pending !== null;
 	const saveServices = (0, react.useCallback)(() => {
 		if (snapshot === null || services === null || busy) return;
@@ -3219,6 +3236,7 @@ function ModellixSettingsSection({ controller, t }) {
 		t
 	]);
 	if (snapshot === null || services === null) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		ref: settingsSectionRef,
 		className: "mdlx-settings",
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			className: "mdlx-live",
@@ -3239,6 +3257,7 @@ function ModellixSettingsSection({ controller, t }) {
 	const canWriteCredential = credential.writable && credential.source !== "env";
 	const llmRefreshDisabled = busy || !snapshot.services.llm || !credential.configured;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		ref: settingsSectionRef,
 		className: "mdlx-settings",
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
@@ -3277,7 +3296,7 @@ function ModellixSettingsSection({ controller, t }) {
 							type: "button",
 							variant: !credential.configured || credential.verification === "invalid" ? "primary" : "outline",
 							disabled: busy,
-							onClick: () => credentialDialogs.open(credentialDialogOwner),
+							onClick: () => credentialDialogs.openCredential(credentialDialogOwner),
 							children: credential.configured ? t("replaceKey") : t("configureKey")
 						}), credential.configured && canWriteCredential && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
 							type: "button",
@@ -3356,7 +3375,8 @@ function ModellixSettingsSection({ controller, t }) {
 				},
 				onCancel: () => credentialDialogs.dismissCredential(credentialDialogOwner),
 				laterLabel: credentialRecovery ? "later" : "cancel",
-				t
+				t,
+				externalDialogOwner: settingsSectionRef
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RemoveCredentialDialog, {
 				open: removeOpen,
@@ -3371,7 +3391,8 @@ function ModellixSettingsSection({ controller, t }) {
 						setAnnouncement(t("saved"));
 					});
 				},
-				t
+				t,
+				externalDialogOwner: settingsSectionRef
 			})
 		]
 	});
@@ -3426,12 +3447,13 @@ function LlmCatalogCard({ snapshot, dateLocale, busy, disabled, onRefresh, t })
 		]
 	});
 }
-function RemoveCredentialDialog({ open, busy, errorCode, onClose, onConfirm, t }) {
+function RemoveCredentialDialog({ open, busy, errorCode, onClose, onConfirm, t, externalDialogOwner }) {
 	const contentRef = (0, react.useRef)(null);
-	const surfaceOpen = useExternalDialogGate(open);
+	const surfaceOpen = useExternalDialogGate(open, externalDialogOwner);
 	useDialogA11y({
 		open: surfaceOpen,
 		container: contentRef,
+		externalDialogOwner,
 		initialFocusSelector: "[data-mdlx-initial-focus]",
 		mandatory: false,
 		onEscape: onClose