@woosau/dsh-custom-env 0.1.6 → 0.1.8

package/README.md

@@ -28,9 +28,11 @@ dsh plugin --profile desktop remove @woosau/dsh-custom-env
 
 1. Open **Settings → Environment**
 2. Edit a row as a draft → **Confirm** to save, **Cancel** to discard
-3. **Restore** brings back the value from when this app session started
-4. At startup, values are injected into the Host `process.env` first; writing the user environment (registry / launchctl) is deferred off the boot path and is not broadcast. Log off or reboot before other tools need those values
-5. Use **Install** only when shown, to wire this Host’s `dsh` command into your user PATH (Windows / macOS)
+3. Paste `NAME=VALUE` lines into the empty row to add or update several variables at once (same names overlay existing rows as drafts)
+4. Drag across rows to multi-select, or Ctrl/Cmd+click to toggle; Ctrl/Cmd+C copies selected rows as `NAME=VALUE` (input text selection still wins when present)
+5. **Restore** brings back the value from when this app session started
+6. At startup, values are injected into the Host `process.env` first; writing the user environment (registry / launchctl) is deferred off the boot path and is not broadcast. Log off or reboot before other tools need those values
+7. Use **Install** only when shown, to wire this Host’s `dsh` command into your user PATH (Windows / macOS)
 
 System-reserved names (such as `PATH` and names starting with `DSH_` / `XDG_`) cannot be edited here.
 

package/README.zh-CN.md

@@ -28,9 +28,11 @@ dsh plugin --profile desktop remove @woosau/dsh-custom-env
 
 1. 打开 **设置 → 环境变量**
 2. 先改草稿 → **确定** 保存，**取消** 放弃
-3. **恢复** 可回到本次应用启动时的值
-4. 启动时先注入当前 Host 的 `process.env`；写入用户环境（注册表 / launchctl）会延后到启动路径之后，且不会广播。其它工具若要读到，请注销/重启后再开终端
-5. 仅在出现 **安装** 时使用：把本 Host 的 `dsh` 接到用户 PATH（Windows / macOS）
+3. 在空行粘贴多行 `NAME=VALUE` 可批量新增或覆盖同名变量（同名写入原行草稿）
+4. 拖动可多选行，Ctrl/Cmd+点击切换选中；Ctrl/Cmd+C 按 `NAME=VALUE` 复制选中行（若 Input 内有文字选区则优先复制文字）
+5. **恢复** 可回到本次应用启动时的值
+6. 启动时先注入当前 Host 的 `process.env`；写入用户环境（注册表 / launchctl）会延后到启动路径之后，且不会广播。其它工具若要读到，请注销/重启后再开终端
+7. 仅在出现 **安装** 时使用：把本 Host 的 `dsh` 接到用户 PATH（Windows / macOS）
 
 系统保留名（如 `PATH`，以及 `DSH_` / `XDG_` 开头）不可在此编辑。
 

package/lib/client.js

@@ -553,8 +553,80 @@ function formatRemoteError(error, t) {
   return t("error.generic");
 }
 
+// src/client/parse-env-paste.ts
+var NAME_OK = /^[A-Za-z_][A-Za-z0-9_]*$/u;
+function parseEnvPaste(text) {
+  const lastByName = /* @__PURE__ */ new Map();
+  const order = [];
+  for (const rawLine of text.split(/\r\n|\n|\r/u)) {
+    const line = rawLine.trim();
+    if (line === "") continue;
+    const eq = line.indexOf("=");
+    if (eq <= 0) continue;
+    const name = line.slice(0, eq).trim();
+    const value = line.slice(eq + 1).trim();
+    if (!NAME_OK.test(name)) continue;
+    if (!lastByName.has(name)) order.push(name);
+    lastByName.set(name, value);
+  }
+  return order.map((name) => ({ name, value: lastByName.get(name) }));
+}
+function formatEnvCopy(pairs) {
+  const lines = [];
+  for (const pair of pairs) {
+    const name = pair.name.trim();
+    if (name === "") continue;
+    lines.push(`${name}=${pair.value}`);
+  }
+  return lines.join("\n");
+}
+
+// src/client/env-row-select.ts
+function isSelectionEditKey(event) {
+  return event.ctrlKey || event.metaKey;
+}
+function rangeIds(ordered, from, to) {
+  const a = ordered.indexOf(from);
+  const b = ordered.indexOf(to);
+  if (a < 0 || b < 0) return from === to && a >= 0 ? [from] : [];
+  const start = Math.min(a, b);
+  const end = Math.max(a, b);
+  return ordered.slice(start, end + 1);
+}
+function clearDomTextSelection() {
+  const selection = window.getSelection();
+  if (selection !== null && selection.rangeCount > 0) selection.removeAllRanges();
+}
+function hasFocusedInputTextSelection() {
+  const active = document.activeElement;
+  if (!(active instanceof HTMLInputElement) && !(active instanceof HTMLTextAreaElement)) return false;
+  const start = active.selectionStart;
+  const end = active.selectionEnd;
+  return start !== null && end !== null && start !== end;
+}
+function selectedEnvCopyText(selectedIds, orderedIds, drafts) {
+  if (selectedIds.size === 0) return "";
+  const pairs = orderedIds.flatMap((id) => {
+    if (!selectedIds.has(id)) return [];
+    const draft = drafts[id];
+    if (draft === void 0) return [];
+    const name = draft.name.trim();
+    if (name === "") return [];
+    return [{ name, value: draft.value }];
+  });
+  return formatEnvCopy(pairs);
+}
+function rowIdFromPoint(clientX, clientY) {
+  const hit = document.elementFromPoint(clientX, clientY);
+  if (!(hit instanceof Element)) return void 0;
+  const row = hit.closest("[data-env-row]");
+  if (!(row instanceof HTMLElement)) return void 0;
+  const id = row.dataset.envRow;
+  return id === void 0 || id === "" ? void 0 : id;
+}
+
 // src/client/EnvSettingsSection.module.css
-var css = ".EnvSettingsSection_section {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  max-width: 760px;\n  color: var(--dsw-alias-label-primary);\n}\n\n.EnvSettingsSection_heading {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 500;\n  line-height: 1.3;\n}\n\n/* \u2014\u2014 dsh CLI: exactly two lines (label + path) \u2014\u2014 */\n.EnvSettingsSection_cli {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.EnvSettingsSection_cliHeading {\n  margin: 0;\n  font-size: 13px;\n  font-weight: 500;\n  line-height: 20px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.EnvSettingsSection_cliBody {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) 28px;\n  gap: 8px;\n  align-items: center;\n  height: 28px;\n}\n\n.EnvSettingsSection_cliPath {\n  margin: 0;\n  min-width: 0;\n  font-size: 13px;\n  line-height: 28px;\n  color: var(--dsw-alias-label-tertiary);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.EnvSettingsSection_cliSlot {\n  display: flex;\n  width: 28px;\n  height: 28px;\n  align-items: center;\n  justify-content: center;\n}\n\n.EnvSettingsSection_cliSlot[data-empty='true'] {\n  visibility: hidden;\n  pointer-events: none;\n}\n\n.EnvSettingsSection_notice,\n.EnvSettingsSection_empty {\n  margin: 0;\n  font-size: 13px;\n  line-height: 18px;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.EnvSettingsSection_notice[data-tone='error'] {\n  color: var(--dsw-alias-label-danger, #c62828);\n}\n\n/* \u2014\u2014 variable list: CSS grid, not table (avoids Input overflow overlap) \u2014\u2014 */\n.EnvSettingsSection_list {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  min-width: 0;\n}\n\n.EnvSettingsSection_header,\n.EnvSettingsSection_row {\n  display: grid;\n  grid-template-columns: minmax(120px, 0.85fr) minmax(0, 1.55fr) 100px;\n  gap: 10px;\n  align-items: center;\n  min-width: 0;\n}\n\n.EnvSettingsSection_header {\n  padding: 0 0 2px;\n}\n\n.EnvSettingsSection_headerLabel {\n  margin: 0;\n  font-size: 12px;\n  font-weight: 500;\n  line-height: 1.3;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.EnvSettingsSection_headerActions {\n  width: 100px;\n}\n\n.EnvSettingsSection_field {\n  min-width: 0;\n  overflow: hidden;\n}\n\n.EnvSettingsSection_fieldInput {\n  display: flex;\n  box-sizing: border-box;\n  width: 100%;\n  max-width: 100%;\n  min-width: 0;\n}\n\n.EnvSettingsSection_actions {\n  display: grid;\n  grid-template-columns: repeat(3, 28px);\n  gap: 4px;\n  align-items: center;\n  justify-content: end;\n  width: 100px;\n  margin-left: auto;\n  flex-shrink: 0;\n}\n\n.EnvSettingsSection_slot {\n  display: flex;\n  width: 28px;\n  height: 28px;\n  align-items: center;\n  justify-content: center;\n}\n\n.EnvSettingsSection_slot[data-empty='true'] {\n  visibility: hidden;\n  pointer-events: none;\n}\n\n.EnvSettingsSection_iconButton {\n  display: inline-flex;\n  width: 28px;\n  height: 28px;\n  margin: 0;\n  padding: 0;\n  align-items: center;\n  justify-content: center;\n  border: none;\n  border-radius: var(--dsw-radius-sm, 6px);\n  background: transparent;\n  color: var(--dsw-alias-label-secondary);\n  cursor: pointer;\n}\n\n.EnvSettingsSection_iconButton:hover:not(:disabled) {\n  background: var(--dsw-alias-fill-hover, rgba(127, 127, 127, 0.12));\n  color: var(--dsw-alias-label-primary);\n}\n\n.EnvSettingsSection_iconButton:disabled {\n  opacity: 0.45;\n  cursor: default;\n}\n\n.EnvSettingsSection_iconButtonDanger:hover:not(:disabled) {\n  color: var(--dsw-alias-label-danger, #c62828);\n}\n\n.EnvSettingsSection_iconButtonPrimary {\n  color: var(--dsw-alias-brand-primary, #247bbf);\n}\n\n.EnvSettingsSection_restartBadge {\n  display: inline-flex;\n  width: 28px;\n  height: 28px;\n  align-items: center;\n  justify-content: center;\n  color: var(--dsw-alias-label-warning, #c67c00);\n}\n\n.EnvSettingsSection_spinner {\n  animation: spin 1s linear infinite;\n}\n\n@keyframes spin {\n  to { transform: rotate(360deg); }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .EnvSettingsSection_spinner {\n    animation: none;\n  }\n}\n";
+var css = ".EnvSettingsSection_section {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  max-width: 760px;\n  color: var(--dsw-alias-label-primary);\n}\n\n.EnvSettingsSection_heading {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 500;\n  line-height: 1.3;\n}\n\n/* \u2014\u2014 dsh CLI: exactly two lines (label + path) \u2014\u2014 */\n.EnvSettingsSection_cli {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.EnvSettingsSection_cliHeading {\n  margin: 0;\n  font-size: 13px;\n  font-weight: 500;\n  line-height: 20px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.EnvSettingsSection_cliBody {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) 28px;\n  gap: 8px;\n  align-items: center;\n  height: 28px;\n}\n\n.EnvSettingsSection_cliPath {\n  margin: 0;\n  min-width: 0;\n  font-size: 13px;\n  line-height: 28px;\n  color: var(--dsw-alias-label-tertiary);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.EnvSettingsSection_cliSlot {\n  display: flex;\n  width: 28px;\n  height: 28px;\n  align-items: center;\n  justify-content: center;\n}\n\n.EnvSettingsSection_cliSlot[data-empty='true'] {\n  visibility: hidden;\n  pointer-events: none;\n}\n\n.EnvSettingsSection_notice,\n.EnvSettingsSection_empty {\n  margin: 0;\n  font-size: 13px;\n  line-height: 18px;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.EnvSettingsSection_notice[data-tone='error'] {\n  color: var(--dsw-alias-label-danger, #c62828);\n}\n\n/* \u2014\u2014 variable list: CSS grid, not table (avoids Input overflow overlap) \u2014\u2014 */\n.EnvSettingsSection_list {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  min-width: 0;\n}\n\n.EnvSettingsSection_header,\n.EnvSettingsSection_row {\n  display: grid;\n  grid-template-columns: minmax(120px, 0.85fr) minmax(0, 1.55fr) 100px;\n  gap: 10px;\n  align-items: center;\n  min-width: 0;\n}\n\n.EnvSettingsSection_row {\n  padding: 4px 6px;\n  margin: 0 -6px;\n  user-select: none;\n}\n\n.EnvSettingsSection_row[data-selected='true'] {\n  background: var(--dsw-alias-fill-hover, rgba(127, 127, 127, 0.1));\n}\n\n.EnvSettingsSection_row[data-composer='true'] {\n  user-select: auto;\n}\n\n.EnvSettingsSection_header {\n  padding: 0 0 2px;\n}\n\n.EnvSettingsSection_headerLabel {\n  margin: 0;\n  font-size: 12px;\n  font-weight: 500;\n  line-height: 1.3;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.EnvSettingsSection_headerActions {\n  width: 100px;\n}\n\n.EnvSettingsSection_field {\n  min-width: 0;\n  overflow: hidden;\n}\n\n.EnvSettingsSection_fieldInput {\n  display: flex;\n  box-sizing: border-box;\n  width: 100%;\n  max-width: 100%;\n  min-width: 0;\n  /* Keep unfocused inputs out of drag text-select; focused field can still edit/select. */\n  user-select: none;\n}\n\n.EnvSettingsSection_field:focus-within,\n.EnvSettingsSection_field:focus-within .EnvSettingsSection_fieldInput,\n.EnvSettingsSection_row[data-composer='true'] .EnvSettingsSection_fieldInput {\n  user-select: text;\n}\n\n.EnvSettingsSection_actions {\n  display: grid;\n  grid-template-columns: repeat(3, 28px);\n  gap: 4px;\n  align-items: center;\n  justify-content: end;\n  width: 100px;\n  margin-left: auto;\n  flex-shrink: 0;\n}\n\n.EnvSettingsSection_slot {\n  display: flex;\n  width: 28px;\n  height: 28px;\n  align-items: center;\n  justify-content: center;\n}\n\n.EnvSettingsSection_slot[data-empty='true'] {\n  visibility: hidden;\n  pointer-events: none;\n}\n\n.EnvSettingsSection_iconButton {\n  display: inline-flex;\n  width: 28px;\n  height: 28px;\n  margin: 0;\n  padding: 0;\n  align-items: center;\n  justify-content: center;\n  border: none;\n  border-radius: var(--dsw-radius-sm, 6px);\n  background: transparent;\n  color: var(--dsw-alias-label-secondary);\n  cursor: pointer;\n}\n\n.EnvSettingsSection_iconButton:hover:not(:disabled) {\n  background: var(--dsw-alias-fill-hover, rgba(127, 127, 127, 0.12));\n  color: var(--dsw-alias-label-primary);\n}\n\n.EnvSettingsSection_iconButton:disabled {\n  opacity: 0.45;\n  cursor: default;\n}\n\n.EnvSettingsSection_iconButtonDanger:hover:not(:disabled) {\n  color: var(--dsw-alias-label-danger, #c62828);\n}\n\n.EnvSettingsSection_iconButtonPrimary {\n  color: var(--dsw-alias-brand-primary, #247bbf);\n}\n\n.EnvSettingsSection_restartBadge {\n  display: inline-flex;\n  width: 28px;\n  height: 28px;\n  align-items: center;\n  justify-content: center;\n  color: var(--dsw-alias-label-warning, #c67c00);\n}\n\n.EnvSettingsSection_spinner {\n  animation: spin 1s linear infinite;\n}\n\n@keyframes spin {\n  to { transform: rotate(360deg); }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .EnvSettingsSection_spinner {\n    animation: none;\n  }\n}\n";
 if (typeof document !== "undefined" && !document.getElementById("dsh-custom-env-css")) {
   const style = document.createElement("style");
   style.id = "dsh-custom-env-css";
@@ -565,8 +637,12 @@ var EnvSettingsSection_default = { "section": "EnvSettingsSection_section", "hea
 
 // src/client/EnvSettingsSection.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
-var NAME_OK = /^[A-Za-z_][A-Za-z0-9_]*$/u;
-var NEW_ID = "";
+var NAME_OK2 = /^[A-Za-z_][A-Za-z0-9_]*$/u;
+var COMPOSER_ID = "";
+var PENDING_PREFIX = "pending:";
+function isPendingId(id) {
+  return id.startsWith(PENDING_PREFIX);
+}
 function IconAction({
   label,
   disabled,
@@ -622,9 +698,17 @@ function Field(props) {
       title: props.title,
       "aria-invalid": props.invalid || void 0,
       "aria-label": props.label,
+      onMouseDown: (event) => {
+        if (!props.rowSelectGestures) {
+          event.stopPropagation();
+          return;
+        }
+        if (isSelectionEditKey(event)) event.preventDefault();
+      },
       onChange: (event) => {
         props.onChange(event.target.value);
-      }
+      },
+      onPaste: props.onPaste
     }
   ) });
 }
@@ -639,20 +723,57 @@ function EnvSettingsSection({
 }) {
   const [snapshot, setSnapshot] = (0, import_react.useState)();
   const [cli, setCli] = (0, import_react.useState)();
-  const [drafts, setDrafts] = (0, import_react.useState)({ [NEW_ID]: { name: "", value: "" } });
+  const [drafts, setDrafts] = (0, import_react.useState)({ [COMPOSER_ID]: { name: "", value: "" } });
+  const [pendingOrder, setPendingOrder] = (0, import_react.useState)([]);
   const [busyTarget, setBusyTarget] = (0, import_react.useState)();
   const [error, setError] = (0, import_react.useState)();
   const [nameError, setNameError] = (0, import_react.useState)(false);
   const [pendingRemove, setPendingRemove] = (0, import_react.useState)();
+  const [selectedIds, setSelectedIds] = (0, import_react.useState)(() => /* @__PURE__ */ new Set());
+  const pendingSeq = (0, import_react.useRef)(0);
+  const draftsRef = (0, import_react.useRef)(drafts);
+  draftsRef.current = drafts;
+  const pendingOrderRef = (0, import_react.useRef)(pendingOrder);
+  pendingOrderRef.current = pendingOrder;
+  const selectedRef = (0, import_react.useRef)(selectedIds);
+  selectedRef.current = selectedIds;
+  const anchorIdRef = (0, import_react.useRef)(void 0);
+  const dragModeRef = (0, import_react.useRef)(void 0);
+  const dragVisitedRef = (0, import_react.useRef)(/* @__PURE__ */ new Set());
+  const dragPendingCrossRef = (0, import_react.useRef)(false);
+  const pendingRemoveRef = (0, import_react.useRef)(pendingRemove);
+  pendingRemoveRef.current = pendingRemove;
   const busy = busyTarget !== void 0;
   const entries = snapshot?.entries ?? [];
   const taken = new Set(entries.map((entry) => entry.name));
-  const applySnapshot = (next) => {
+  const selectableOrder = [...entries.map((entry) => entry.id), ...pendingOrder];
+  const selectableOrderRef = (0, import_react.useRef)(selectableOrder);
+  selectableOrderRef.current = selectableOrder;
+  const keepPendingDrafts = (current, dropId) => {
+    const kept = {};
+    for (const [id, draft] of Object.entries(current)) {
+      if (!isPendingId(id) || id === dropId) continue;
+      kept[id] = draft;
+    }
+    return kept;
+  };
+  const applySnapshot = (next, dropPendingId) => {
     setSnapshot(next);
-    setDrafts({
-      [NEW_ID]: { name: "", value: "" },
+    if (dropPendingId !== void 0) {
+      setPendingOrder((order) => order.filter((item) => item !== dropPendingId));
+      setSelectedIds((previous) => {
+        if (!previous.has(dropPendingId)) return previous;
+        const ids = new Set(previous);
+        ids.delete(dropPendingId);
+        return ids;
+      });
+      if (anchorIdRef.current === dropPendingId) anchorIdRef.current = void 0;
+    }
+    setDrafts((current) => ({
+      [COMPOSER_ID]: { name: "", value: "" },
+      ...keepPendingDrafts(current, dropPendingId),
       ...Object.fromEntries(next.entries.map((entry) => [entry.id, { name: entry.name, value: entry.value }]))
-    });
+    }));
   };
   const setDraft = (id, patch) => {
     setDrafts((previous) => ({
@@ -660,12 +781,46 @@ function EnvSettingsSection({
       [id]: { name: patch.name ?? previous[id]?.name ?? "", value: patch.value ?? previous[id]?.value ?? "" }
     }));
   };
-  const run = async (target, action) => {
+  const dropPending = (id) => {
+    setPendingOrder((order) => order.filter((item) => item !== id));
+    setSelectedIds((previous) => {
+      if (!previous.has(id)) return previous;
+      const next = new Set(previous);
+      next.delete(id);
+      return next;
+    });
+    if (anchorIdRef.current === id) anchorIdRef.current = void 0;
+    setDrafts((previous) => {
+      const next = { ...previous };
+      delete next[id];
+      return next;
+    });
+  };
+  const clearSelection = () => {
+    setSelectedIds(/* @__PURE__ */ new Set());
+    anchorIdRef.current = void 0;
+    clearDomTextSelection();
+  };
+  const pruneSelection = (allowed) => {
+    setSelectedIds((previous) => {
+      let changed = false;
+      const next = /* @__PURE__ */ new Set();
+      for (const id of previous) {
+        if (allowed.has(id)) next.add(id);
+        else changed = true;
+      }
+      return changed ? next : previous;
+    });
+    if (anchorIdRef.current !== void 0 && !allowed.has(anchorIdRef.current)) {
+      anchorIdRef.current = void 0;
+    }
+  };
+  const run = async (target, action, dropPendingId) => {
     if (busyTarget !== void 0) return;
     setBusyTarget(target);
     setError(void 0);
     try {
-      applySnapshot(await action());
+      applySnapshot(await action(), dropPendingId);
     } catch (err) {
       setError(formatRemoteError(err, t));
     } finally {
@@ -676,7 +831,14 @@ function EnvSettingsSection({
     setBusyTarget("boot");
     setError(void 0);
     try {
-      applySnapshot(await load());
+      setPendingOrder([]);
+      clearSelection();
+      const next = await load();
+      setSnapshot(next);
+      setDrafts({
+        [COMPOSER_ID]: { name: "", value: "" },
+        ...Object.fromEntries(next.entries.map((entry) => [entry.id, { name: entry.name, value: entry.value }]))
+      });
       try {
         setCli(await cliStatus());
       } catch {
@@ -691,21 +853,207 @@ function EnvSettingsSection({
   (0, import_react.useEffect)(() => {
     void refresh();
   }, [refresh]);
-  const saveRow = (id, entryName) => {
+  (0, import_react.useEffect)(() => {
+    const allowed = new Set(selectableOrder);
+    pruneSelection(allowed);
+  }, [selectableOrder.join("\0")]);
+  const stopEditingGesture = () => {
+    clearDomTextSelection();
+    const active = document.activeElement;
+    if (active instanceof HTMLInputElement && active.closest(`.${EnvSettingsSection_default.list}`) !== null) active.blur();
+  };
+  const applyDragOverRow = (id) => {
+    if (dragModeRef.current === void 0) return;
+    if (dragModeRef.current === "toggle") {
+      if (dragVisitedRef.current.has(id)) return;
+      stopEditingGesture();
+      dragVisitedRef.current.add(id);
+      setSelectedIds((previous) => {
+        const next = new Set(previous);
+        if (next.has(id)) next.delete(id);
+        else next.add(id);
+        return next;
+      });
+      return;
+    }
+    if (dragPendingCrossRef.current && id === anchorIdRef.current) return;
+    if (dragPendingCrossRef.current || id !== anchorIdRef.current) {
+      dragPendingCrossRef.current = false;
+      stopEditingGesture();
+    }
+    dragVisitedRef.current.add(id);
+    setSelectedIds(new Set(rangeIds(selectableOrderRef.current, anchorIdRef.current ?? id, id)));
+  };
+  (0, import_react.useEffect)(() => {
+    if (selectedIds.size > 0) clearDomTextSelection();
+  }, [selectedIds]);
+  (0, import_react.useEffect)(() => {
+    const endDrag = () => {
+      dragModeRef.current = void 0;
+      dragVisitedRef.current = /* @__PURE__ */ new Set();
+      dragPendingCrossRef.current = false;
+    };
+    const onMove = (event) => {
+      if (event.buttons !== 1 || dragModeRef.current === void 0) return;
+      const id = rowIdFromPoint(event.clientX, event.clientY);
+      if (id !== void 0) applyDragOverRow(id);
+    };
+    const onPointerDown = (event) => {
+      if (selectedRef.current.size === 0 || pendingRemoveRef.current !== void 0) return;
+      if (!(event.target instanceof Element)) return;
+      if (event.target.closest("[data-env-row]") !== null) return;
+      clearSelection();
+    };
+    const copyText = () => selectedEnvCopyText(selectedRef.current, selectableOrderRef.current, draftsRef.current);
+    const onKeyDown = (event) => {
+      if (selectedRef.current.size === 0) return;
+      if (event.key !== "c" && event.key !== "C" || !isSelectionEditKey(event) || event.altKey || event.shiftKey) return;
+      if (hasFocusedInputTextSelection()) return;
+      const text = copyText();
+      if (text === "") return;
+      event.preventDefault();
+      void navigator.clipboard.writeText(text);
+    };
+    const onCopy = (event) => {
+      if (selectedRef.current.size === 0 || hasFocusedInputTextSelection()) return;
+      const text = copyText();
+      if (text === "") return;
+      event.preventDefault();
+      event.clipboardData?.setData("text/plain", text);
+    };
+    window.addEventListener("mouseup", endDrag);
+    window.addEventListener("mousemove", onMove);
+    document.addEventListener("mousedown", onPointerDown, true);
+    document.addEventListener("keydown", onKeyDown, true);
+    document.addEventListener("copy", onCopy, true);
+    return () => {
+      window.removeEventListener("mouseup", endDrag);
+      window.removeEventListener("mousemove", onMove);
+      document.removeEventListener("mousedown", onPointerDown, true);
+      document.removeEventListener("keydown", onKeyDown, true);
+      document.removeEventListener("copy", onCopy, true);
+    };
+  }, []);
+  const saveExisting = (id, entryName) => {
     const draft = drafts[id] ?? { name: "", value: "" };
     const name = draft.name.trim();
     const takenByOther = name !== entryName && taken.has(name);
-    if (!NAME_OK.test(name) || takenByOther) {
+    if (!NAME_OK2.test(name) || takenByOther) {
+      setNameError(true);
+      return;
+    }
+    if (draft.value === "") return;
+    setNameError(false);
+    void run(`row:${id}`, () => upsert(id, name, draft.value));
+  };
+  const savePending = (id) => {
+    const draft = drafts[id] ?? { name: "", value: "" };
+    const name = draft.name.trim();
+    if (!NAME_OK2.test(name) || taken.has(name)) {
       setNameError(true);
       return;
     }
     if (draft.value === "") return;
     setNameError(false);
-    const target = id === NEW_ID ? "new" : `row:${id}`;
-    void run(target, () => upsert(id, name, draft.value));
+    void run(`pending:${id}`, () => upsert(COMPOSER_ID, name, draft.value), id);
+  };
+  const typeIntoComposer = (patch, focus) => {
+    setNameError(false);
+    const base = draftsRef.current[COMPOSER_ID] ?? { name: "", value: "" };
+    const next = { name: patch.name ?? base.name, value: patch.value ?? base.value };
+    const id = `${PENDING_PREFIX}${++pendingSeq.current}`;
+    setDrafts((previous) => ({
+      ...previous,
+      [id]: next,
+      [COMPOSER_ID]: { name: "", value: "" }
+    }));
+    setPendingOrder((order) => [...order, id]);
+    queueMicrotask(() => {
+      document.getElementById(`env-${focus}-${id}`)?.focus();
+    });
+  };
+  const appendPendingPairs = (pairs) => {
+    if (pairs.length === 0) return;
+    setNameError(false);
+    const previous = draftsRef.current;
+    const order = pendingOrderRef.current;
+    const nextDrafts = { ...previous, [COMPOSER_ID]: { name: "", value: "" } };
+    const savedByName = new Map(entries.map((entry) => [entry.name, entry.id]));
+    const existingPendingByName = /* @__PURE__ */ new Map();
+    for (const id of order) {
+      const draft = previous[id];
+      if (draft !== void 0) existingPendingByName.set(draft.name.trim(), id);
+    }
+    const added = [];
+    const dropPending2 = /* @__PURE__ */ new Set();
+    for (const pair of pairs) {
+      const savedId = savedByName.get(pair.name);
+      if (savedId !== void 0) {
+        nextDrafts[savedId] = { name: pair.name, value: pair.value };
+        const pendingDup = existingPendingByName.get(pair.name);
+        if (pendingDup !== void 0) {
+          delete nextDrafts[pendingDup];
+          dropPending2.add(pendingDup);
+          existingPendingByName.delete(pair.name);
+        }
+        continue;
+      }
+      const reuse = existingPendingByName.get(pair.name);
+      if (reuse !== void 0) {
+        nextDrafts[reuse] = { name: pair.name, value: pair.value };
+        continue;
+      }
+      const id = `${PENDING_PREFIX}${++pendingSeq.current}`;
+      nextDrafts[id] = { name: pair.name, value: pair.value };
+      existingPendingByName.set(pair.name, id);
+      added.push(id);
+    }
+    setDrafts(nextDrafts);
+    if (added.length > 0 || dropPending2.size > 0) {
+      setPendingOrder([...order.filter((id) => !dropPending2.has(id)), ...added]);
+    }
+  };
+  const onComposerPaste = (event) => {
+    const text = event.clipboardData.getData("text");
+    const pairs = parseEnvPaste(text);
+    if (pairs.length === 0) return;
+    event.preventDefault();
+    appendPendingPairs(pairs);
   };
-  const newDraft = drafts[NEW_ID] ?? { name: "", value: "" };
-  const newDirty = newDraft.name.trim() !== "" || newDraft.value !== "";
+  const onRowMouseDown = (id, event) => {
+    if (event.button !== 0) return;
+    const target = event.target;
+    const onInput = target?.closest("input") !== null;
+    const onControl = target?.closest('button, a, [role="button"]') !== null;
+    if (isSelectionEditKey(event)) {
+      event.preventDefault();
+      clearDomTextSelection();
+      dragPendingCrossRef.current = false;
+      if (event.shiftKey && anchorIdRef.current !== void 0) {
+        const spanned = rangeIds(selectableOrder, anchorIdRef.current, id);
+        setSelectedIds(new Set(spanned));
+        dragModeRef.current = "range";
+        dragVisitedRef.current = new Set(spanned);
+        return;
+      }
+      setSelectedIds((previous) => {
+        const next = new Set(previous);
+        if (next.has(id)) next.delete(id);
+        else next.add(id);
+        return next;
+      });
+      anchorIdRef.current = id;
+      dragModeRef.current = "toggle";
+      dragVisitedRef.current = /* @__PURE__ */ new Set([id]);
+      return;
+    }
+    if (!onInput && !onControl) event.preventDefault();
+    anchorIdRef.current = id;
+    dragModeRef.current = "range";
+    dragVisitedRef.current = /* @__PURE__ */ new Set([id]);
+    dragPendingCrossRef.current = true;
+  };
+  const composer = drafts[COMPOSER_ID] ?? { name: "", value: "" };
   const cliInstalling = busyTarget === "cli";
   const cliBooting = busyTarget === "boot" || cli === void 0;
   const showCliAction = cli?.canInstall === true || cliInstalling;
@@ -755,120 +1103,189 @@ function EnvSettingsSection({
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: EnvSettingsSection_default.headerLabel, children: t("field.value") }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: EnvSettingsSection_default.headerActions, "aria-hidden": "true" })
       ] }),
-      snapshot !== void 0 && entries.length === 0 && notice === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: EnvSettingsSection_default.empty, children: t("panel.empty") }) : null,
+      snapshot !== void 0 && entries.length === 0 && pendingOrder.length === 0 && notice === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: EnvSettingsSection_default.empty, children: t("panel.empty") }) : null,
       entries.map((entry) => {
         const draft = drafts[entry.id] ?? { name: entry.name, value: entry.value };
         const dirty = draft.name !== entry.name || draft.value !== entry.value;
         const pending = entry.kind === "added" || entry.kind === "modified";
         const loading = busyTarget === `row:${entry.id}`;
         const nextName = draft.name.trim();
-        const canConfirm = NAME_OK.test(nextName) && draft.value !== "" && !(nextName !== entry.name && taken.has(nextName));
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: EnvSettingsSection_default.row, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            Field,
-            {
-              id: `env-name-${entry.id}`,
-              value: draft.name,
-              disabled: busy,
-              title: draft.name,
-              invalid: nameError && dirty,
-              label: t("field.name"),
-              onChange: (name) => {
-                setNameError(false);
-                setDraft(entry.id, { name });
-              }
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            Field,
-            {
-              id: `env-value-${entry.id}`,
-              value: draft.value,
-              disabled: busy,
-              title: draft.value,
-              label: t("field.value"),
-              onChange: (value) => {
-                setDraft(entry.id, { value });
-              }
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            RowActions,
-            {
-              t,
-              busy,
-              loading,
-              dirty: dirty || loading,
-              canConfirm,
-              pending,
-              onConfirm: () => {
-                saveRow(entry.id, entry.name);
-              },
-              onCancel: () => {
-                setNameError(false);
-                setDraft(entry.id, { name: entry.name, value: entry.value });
-              },
-              onRestore: () => {
-                void run(`row:${entry.id}`, () => restore(entry.id));
-              },
-              onRemove: () => {
-                setPendingRemove({ id: entry.id, name: entry.name });
-              }
-            }
-          )
-        ] }, entry.id);
+        const canConfirm = NAME_OK2.test(nextName) && draft.value !== "" && !(nextName !== entry.name && taken.has(nextName));
+        const selected = selectedIds.has(entry.id);
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "div",
+          {
+            className: EnvSettingsSection_default.row,
+            "data-env-row": entry.id,
+            "data-selected": selected ? "true" : "false",
+            "aria-selected": selected,
+            onMouseDown: (event) => {
+              onRowMouseDown(entry.id, event);
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                Field,
+                {
+                  id: `env-name-${entry.id}`,
+                  value: draft.name,
+                  disabled: busy,
+                  title: draft.name,
+                  invalid: nameError && dirty,
+                  label: t("field.name"),
+                  rowSelectGestures: true,
+                  onChange: (name) => {
+                    setNameError(false);
+                    setDraft(entry.id, { name });
+                  }
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                Field,
+                {
+                  id: `env-value-${entry.id}`,
+                  value: draft.value,
+                  disabled: busy,
+                  title: draft.value,
+                  label: t("field.value"),
+                  rowSelectGestures: true,
+                  onChange: (value) => {
+                    setDraft(entry.id, { value });
+                  }
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                RowActions,
+                {
+                  t,
+                  busy,
+                  loading,
+                  dirty: dirty || loading,
+                  canConfirm,
+                  pending,
+                  onConfirm: () => {
+                    saveExisting(entry.id, entry.name);
+                  },
+                  onCancel: () => {
+                    setNameError(false);
+                    setDraft(entry.id, { name: entry.name, value: entry.value });
+                  },
+                  onRestore: () => {
+                    void run(`row:${entry.id}`, () => restore(entry.id));
+                  },
+                  onRemove: () => {
+                    setPendingRemove({ id: entry.id, name: entry.name });
+                  }
+                }
+              )
+            ]
+          },
+          entry.id
+        );
+      }),
+      pendingOrder.map((id) => {
+        const draft = drafts[id] ?? { name: "", value: "" };
+        const loading = busyTarget === `pending:${id}`;
+        const nextName = draft.name.trim();
+        const canConfirm = NAME_OK2.test(nextName) && draft.value !== "" && !taken.has(nextName);
+        const selected = selectedIds.has(id);
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "div",
+          {
+            className: EnvSettingsSection_default.row,
+            "data-env-row": id,
+            "data-selected": selected ? "true" : "false",
+            "aria-selected": selected,
+            onMouseDown: (event) => {
+              onRowMouseDown(id, event);
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                Field,
+                {
+                  id: `env-name-${id}`,
+                  value: draft.name,
+                  disabled: busy,
+                  title: draft.name,
+                  invalid: nameError,
+                  label: t("field.name"),
+                  rowSelectGestures: true,
+                  onChange: (name) => {
+                    setNameError(false);
+                    setDraft(id, { name });
+                  }
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                Field,
+                {
+                  id: `env-value-${id}`,
+                  value: draft.value,
+                  disabled: busy,
+                  title: draft.value,
+                  label: t("field.value"),
+                  rowSelectGestures: true,
+                  onChange: (value) => {
+                    setDraft(id, { value });
+                  }
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                RowActions,
+                {
+                  t,
+                  busy,
+                  loading,
+                  dirty: true,
+                  canConfirm,
+                  showRemove: false,
+                  onConfirm: () => {
+                    savePending(id);
+                  },
+                  onCancel: () => {
+                    setNameError(false);
+                    dropPending(id);
+                  },
+                  onRestore: () => void 0,
+                  onRemove: () => void 0
+                }
+              )
+            ]
+          },
+          id
+        );
       }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: EnvSettingsSection_default.row, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: EnvSettingsSection_default.row, "data-composer": "true", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           Field,
           {
             id: "env-new-name",
-            value: newDraft.name,
+            value: composer.name,
             disabled: busy,
             placeholder: t("field.namePlaceholder"),
-            title: newDraft.name || t("field.namePlaceholder"),
-            invalid: nameError,
+            title: composer.name || t("field.namePlaceholder"),
             label: t("field.name"),
             onChange: (name) => {
-              setNameError(false);
-              setDraft(NEW_ID, { name });
-            }
+              typeIntoComposer({ name }, "name");
+            },
+            onPaste: onComposerPaste
           }
         ),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           Field,
           {
             id: "env-new-value",
-            value: newDraft.value,
+            value: composer.value,
             disabled: busy,
             placeholder: t("field.valuePlaceholder"),
-            title: newDraft.value || t("field.valuePlaceholder"),
+            title: composer.value || t("field.valuePlaceholder"),
             label: t("field.value"),
             onChange: (value) => {
-              setDraft(NEW_ID, { value });
-            }
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          RowActions,
-          {
-            t,
-            busy,
-            loading: busyTarget === "new",
-            dirty: newDirty || busyTarget === "new",
-            canConfirm: NAME_OK.test(newDraft.name.trim()) && newDraft.value !== "" && !taken.has(newDraft.name.trim()),
-            showRemove: false,
-            onConfirm: () => {
-              saveRow(NEW_ID, void 0);
-            },
-            onCancel: () => {
-              setNameError(false);
-              setDraft(NEW_ID, { name: "", value: "" });
+              typeIntoComposer({ value }, "value");
             },
-            onRestore: () => void 0,
-            onRemove: () => void 0
+            onPaste: onComposerPaste
           }
-        )
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: EnvSettingsSection_default.actions, "aria-hidden": "true" })
       ] })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(

package/lib/types/client/env-row-select.d.ts

@@ -0,0 +1,36 @@
+/** Pure helpers for Environment row multi-select and KEY=VALUE copy. */
+/** Ctrl (Windows/Linux) or Meta (macOS) — required for click-to-toggle selection. */
+export declare function isSelectionEditKey(event: {
+    ctrlKey: boolean;
+    metaKey: boolean;
+}): boolean;
+/**
+ * Inclusive id span between two anchors in list order.
+ * @param ordered - Selectable row ids in display order.
+ * @param from - Range start id.
+ * @param to - Range end id.
+ * @returns Ordered ids from the earlier index through the later; empty if either id is missing.
+ */
+export declare function rangeIds(ordered: readonly string[], from: string, to: string): string[];
+/** Drop the browser text selection (not row selection). */
+export declare function clearDomTextSelection(): void;
+/** True when the focused input/textarea has a non-empty character range. */
+export declare function hasFocusedInputTextSelection(): boolean;
+/**
+ * Build clipboard text for selected rows in list order.
+ * @param selectedIds - Selected row ids.
+ * @param orderedIds - Display order (saved then pending).
+ * @param drafts - Current name/value drafts by id.
+ * @returns `NAME=VALUE` lines, or empty when nothing usable.
+ */
+export declare function selectedEnvCopyText(selectedIds: ReadonlySet<string>, orderedIds: readonly string[], drafts: Readonly<Record<string, {
+    name: string;
+    value: string;
+}>>): string;
+/**
+ * Resolve the env row under a client point, if any.
+ * @param clientX - Viewport X.
+ * @param clientY - Viewport Y.
+ * @returns `data-env-row` id, or undefined.
+ */
+export declare function rowIdFromPoint(clientX: number, clientY: number): string | undefined;

package/lib/types/client/parse-env-paste.d.ts

@@ -0,0 +1,21 @@
+/** Parse clipboard text into environment name/value pairs for Settings paste. */
+/** One parsed assignment from a paste. */
+export interface ParsedEnvPair {
+    readonly name: string;
+    readonly value: string;
+}
+/**
+ * Parse multiline `NAME=VALUE` paste text into pairs.
+ * Trims lines and spaces around `=`; splits on the first `=`; skips blanks and invalid names.
+ * Duplicate names in one paste keep the last value.
+ * @param text - Clipboard text.
+ * @returns Ordered unique pairs (last duplicate wins).
+ */
+export declare function parseEnvPaste(text: string): ParsedEnvPair[];
+/**
+ * Format pairs for clipboard copy (one `NAME=VALUE` per line).
+ * Skips empty names. Does not trim values beyond what the caller provides.
+ * @param pairs - Ordered name/value pairs.
+ * @returns Clipboard text; empty string when no usable pairs.
+ */
+export declare function formatEnvCopy(pairs: readonly ParsedEnvPair[]): string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@woosau/dsh-custom-env",
   "description": "DSH plugin: manage $DSH_HOME/.env from Settings",
-  "version": "0.1.6",
+  "version": "0.1.8",
   "type": "module",
   "main": "lib/index.js",
   "types": "lib/types/index.d.ts",