dsh-webdav-sync 1.0.0 → 1.0.2

package/lib/client.js

@@ -49,9 +49,40 @@ window.__ModuleLoader__.load({
 			30,
 			60
 		];
+		/** Loopback port the forwarder listens on when nothing else was asked for. */
+		const RELAY_DEFAULT_PORT = 3426;
+		/**
+		* The address a client is given: loopback, the port, and the server's own path.
+		*
+		* The path is carried over so that the rest of the address means the same thing
+		* to the client as the real server's address did — a client that joins its own
+		* paths onto the host alone, and one that keeps the base path it was given, both
+		* end up asking for the same place. Pure form: the same port and target always
+		* give the same address.
+		*/
+		function relayUrl(port, basePath) {
+			return `http://127.0.0.1:${port}${basePath}`;
+		}
+		/**
+		* The path part of a WebDAV address, which the forwarded address carries over.
+		*
+		* `https://host/dav/` gives `/dav`; an address with no path, one that cannot be
+		* read at all, or one that is not http(s) gives ''. Both halves work out the
+		* forwarded address from this, so the line the card shows is the address the host
+		* would hand out for the same draft rather than a second opinion about it.
+		*/
+		function relayBasePath(url) {
+			try {
+				const parsed = new URL(url);
+				if (parsed.protocol !== "http:" && parsed.protocol !== "https:") return "";
+				return parsed.pathname.replace(/\/+$/, "");
+			} catch {
+				return "";
+			}
+		}
 		//#endregion
 		//#region \0webdav-sync-css:/home/runner/work/dsh-webdav/dsh-webdav/src/client/WebdavSyncCard.module.css?inline
-		const css = ".summary_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  min-width: 0;\n  font-size: 13px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.summaryText_318697645 {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.page_318697645 {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  padding: 4px 0 8px;\n  font-size: 13px;\n  color: var(--dsw-alias-label-primary);\n}\n\n.legend_318697645 {\n  display: flex;\n  align-items: baseline;\n  gap: 8px;\n  margin: 0 0 8px;\n  font-size: 12px;\n  font-weight: 600;\n  letter-spacing: 0.02em;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.hint_318697645 {\n  margin: 0;\n  font-size: 12px;\n  line-height: 1.6;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.field_318697645 {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  margin-bottom: 10px;\n}\n\n.fieldLabel_318697645 {\n  font-size: 12px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n/*\n * The line of explanation belonging to one field: it sits between that field's\n * label and its input, so a reader gets the rule before typing, and the gap\n * between two fields (10px) still reads as the bigger break.\n */\n.fieldHint_318697645 {\n  margin: 0;\n  font-size: 12px;\n  line-height: 1.5;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.grid_318697645 {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\n  gap: 10px 14px;\n}\n\n/* The saved-password checkbox with its own line of explanation, set off from\n * the fields above it. Its label is brought down to the fields' 12px for the\n * same reason as the part rows (see `.partRow_318697645 label`). */\n.toggleRow_318697645 {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 4px;\n  padding-top: 10px;\n  border-top: 1px solid var(--dsw-alias-border-l2);\n}\n\n.toggleRow_318697645 label {\n  gap: 6px;\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.toggleRow_318697645 label input {\n  width: 14px;\n  height: 14px;\n}\n\n/*\n * The auto-sync choice: every tab in one row, all the same width, so six\n * options read as one strip instead of a dropdown hiding five of them.\n */\n/* Doubled class: the control's own rule also sets a display, and this wins. */\n.autoControl_318697645.autoControl_318697645 {\n  display: grid;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* Six tabs have to share the row, so each keeps its padding modest. */\n.autoControl_318697645 button {\n  padding: 0 6px;\n  font-size: 12px;\n}\n\n.partRow_318697645 {\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 7px 0;\n  border-bottom: 1px solid var(--dsw-alias-border-l2);\n}\n\n/* No trailing border when the rows stand alone (a host with no view yet). */\n.partRow_318697645:last-child {\n  border-bottom: none;\n}\n\n/* The checkbox with its one-line description under it. */\n.partText_318697645 {\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n  gap: 2px;\n  min-width: 0;\n}\n\n/*\n * The checkbox component sets its own label at 14px, which is bigger than this\n * card's section headings (12px) — the rows read as if they outranked the\n * heading above them. Its class name is internal to the component, so the\n * element selector is the way in; the box shrinks with the text to match.\n */\n.partRow_318697645 label {\n  gap: 6px;\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.partRow_318697645 label input {\n  width: 14px;\n  height: 14px;\n}\n\n.partHint_318697645 {\n  font-size: 11px;\n  line-height: 1.4;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.partState_318697645 {\n  margin-left: auto;\n  flex: none;\n  padding-top: 2px;\n  font-size: 11px;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.partStateBoth_318697645 {\n  color: var(--dsw-alias-label-warning, var(--dsw-alias-label-secondary));\n}\n\n.notice_318697645 {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  padding: 10px 12px;\n  border: 1px solid var(--dsw-alias-border-l2);\n  border-radius: 10px;\n  background: var(--dsw-alias-bg-layer-2);\n  font-size: 12px;\n}\n\n.noticeTitle_318697645 {\n  font-weight: 600;\n  color: var(--dsw-alias-label-primary);\n}\n\n/*\n * The sync actions. Six short labels have to sit on one row, so the buttons\n * keep their own padding down; wrapping stays on only as a narrow-card escape.\n */\n.footer_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  flex-wrap: wrap;\n  padding-top: 4px;\n}\n\n.footer_318697645 button {\n  padding: 0 8px;\n}\n\n.spacer_318697645 {\n  flex: 1;\n}\n\n/* The card's own actions: WebDAV settings, kept apart from the sync ones. */\n.cardFooter_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-wrap: wrap;\n  margin-top: 4px;\n  padding-top: 12px;\n  border-top: 1px solid var(--dsw-alias-border-l2);\n}\n\n.failed_318697645 {\n  font-size: 12px;\n  color: var(--dsw-alias-label-error);\n}\n\n.note_318697645 {\n  font-size: 12px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.confirm_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-wrap: wrap;\n  padding: 10px 12px;\n  border: 1px solid var(--dsw-alias-border-l4);\n  border-radius: 10px;\n  font-size: 12px;\n  color: var(--dsw-alias-label-primary);\n}\n\n.previewList_318697645 {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  font-size: 12px;\n}\n\n.previewRow_318697645 {\n  display: flex;\n  gap: 8px;\n}\n\n.previewPart_318697645 {\n  min-width: 90px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.output_318697645 {\n  max-height: 180px;\n  margin: 0;\n  overflow: auto;\n  padding: 8px 10px;\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-3);\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n  font-size: 11px;\n  line-height: 1.5;\n  white-space: pre-wrap;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.spin_318697645 {\n  animation: webdavSyncSpin 0.9s linear infinite;\n}\n\n@keyframes webdavSyncSpin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n";
+		const css = ".summary_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  min-width: 0;\n  font-size: 13px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.summaryText_318697645 {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.page_318697645 {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  padding: 4px 0 8px;\n  font-size: 13px;\n  color: var(--dsw-alias-label-primary);\n}\n\n.legend_318697645 {\n  display: flex;\n  align-items: baseline;\n  gap: 8px;\n  margin: 0 0 8px;\n  font-size: 12px;\n  font-weight: 600;\n  letter-spacing: 0.02em;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.hint_318697645 {\n  margin: 0;\n  font-size: 12px;\n  line-height: 1.6;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n/* The two stamps share one line: the check on the left, the sync on the right.\n   They wrap rather than overlap when the card is too narrow to hold both. */\n.times_318697645 {\n  display: flex;\n  align-items: baseline;\n  justify-content: space-between;\n  gap: 4px 10px;\n  flex-wrap: wrap;\n}\n\n.field_318697645 {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  margin-bottom: 10px;\n}\n\n.fieldLabel_318697645 {\n  font-size: 12px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n/*\n * The line of explanation belonging to one field: it sits between that field's\n * label and its input, so a reader gets the rule before typing, and the gap\n * between two fields (10px) still reads as the bigger break.\n */\n.fieldHint_318697645 {\n  margin: 0;\n  font-size: 12px;\n  line-height: 1.5;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.grid_318697645 {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\n  gap: 10px 14px;\n}\n\n/*\n * The extra-headers field is the card's only multi-line input, and there is no\n * multi-line primitive to reuse. It takes the one-line input's frame instead —\n * same border, radius and background — so it reads as a field of the same\n * family, and a monospace face because what goes in it is header syntax, where\n * the alignment of a name against its value is the thing being checked. It\n * starts three lines tall and may be dragged taller.\n */\n.headersArea_318697645 {\n  box-sizing: border-box;\n  width: 100%;\n  min-height: 66px;\n  padding: 6px 8px;\n  resize: vertical;\n  border: 0.5px solid var(--dsw-alias-border-l4);\n  border-radius: var(--dsw-radius-md);\n  background: var(--dsw-alias-bg-layer-1);\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n  font-size: 12px;\n  line-height: 18px;\n  color: var(--dsw-alias-label-primary);\n}\n\n.headersArea_318697645::placeholder {\n  color: var(--dsw-alias-label-dimmed);\n}\n\n.headersArea_318697645:focus-visible {\n  outline: none;\n  border-color: var(--dsw-alias-state-business-primary);\n}\n\n/*\n * A field's label line when the field also carries an option of its own: the\n * label and the saved-password checkbox share the line, so the option reads as\n * part of the field it governs instead of as a setting of its own further down\n * the card. They sit at the two ends of that line (`space-between`): the label\n * keeps the field column's left edge, the checkbox lines up with its right edge\n * — packed together they read as one long word. The checkbox is brought down to\n * the field label's 12px and its colour for the same reason as the part rows\n * (see `.partRow_318697645 label`): a control inside a label line should not outrank the\n * line it sits in.\n */\n.labelRow_318697645 {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 10px;\n}\n\n.labelRow_318697645 label {\n  gap: 6px;\n  font-size: 12px;\n  line-height: 18px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.labelRow_318697645 label input {\n  width: 14px;\n  height: 14px;\n}\n\n/*\n * The auto-sync choice: every tab in one row, all the same width, so six\n * options read as one strip instead of a dropdown hiding five of them.\n */\n/* Doubled class: the control's own rule also sets a display, and this wins. */\n.autoControl_318697645.autoControl_318697645 {\n  display: grid;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* Six tabs have to share the row, so each keeps its padding modest. */\n.autoControl_318697645 button {\n  padding: 0 6px;\n  font-size: 12px;\n}\n\n.partRow_318697645 {\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 7px 0;\n  border-bottom: 1px solid var(--dsw-alias-border-l2);\n}\n\n/* No trailing border when the rows stand alone (a host with no view yet). */\n.partRow_318697645:last-child {\n  border-bottom: none;\n}\n\n/* The checkbox with its one-line description under it. */\n.partText_318697645 {\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n  gap: 2px;\n  min-width: 0;\n}\n\n/*\n * The checkbox component sets its own label at 14px, which is bigger than this\n * card's section headings (12px) — the rows read as if they outranked the\n * heading above them. Its class name is internal to the component, so the\n * element selector is the way in; the box shrinks with the text to match.\n */\n.partRow_318697645 label {\n  gap: 6px;\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.partRow_318697645 label input {\n  width: 14px;\n  height: 14px;\n}\n\n.partHint_318697645 {\n  font-size: 11px;\n  line-height: 1.4;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.partState_318697645 {\n  margin-left: auto;\n  flex: none;\n  padding-top: 2px;\n  font-size: 11px;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n.partStateBoth_318697645 {\n  color: var(--dsw-alias-label-warning, var(--dsw-alias-label-secondary));\n}\n\n/*\n * The extra directories, laid out as one more part row — checkbox, name,\n * one-line description, state — exactly like the four above, with the picker on\n * the title line right after the name and the chosen paths listed under the row.\n * Each path is a small card of its own: a bordered row that reads as something\n * carried, not as another line of prose.\n */\n\n/*\n * The picker shares the title line with the switch. It is a text button, so it\n * has to stop borrowing a control's height and padding to sit level with a 12px\n * label — and it reads quieter than the label until it is pointed at.\n */\n.titleRow_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.titleRow_318697645 button {\n  height: auto;\n  min-height: 0;\n  padding: 0 2px;\n  font-size: 12px;\n  line-height: 18px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.titleRow_318697645 button:hover:not(:disabled) {\n  color: var(--dsw-alias-label-primary);\n}\n\n.dirList_318697645 {\n  padding: 0 0 4px;\n  border-bottom: 1px solid var(--dsw-alias-border-l2);\n}\n\n/* The group owns the separator; its heading row sits above the paths. */\n.dirList_318697645 .partRow_318697645 {\n  border-bottom: none;\n  align-items: center;\n}\n\n.dirRow_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin: 0 0 4px 20px;\n  padding: 4px 6px 4px 8px;\n  border: 1px solid var(--dsw-alias-border-l2);\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-3);\n}\n\n/* Switched off, the paths stay on screen but read as dormant. */\n.dirOff_318697645 {\n  opacity: 0.6;\n}\n\n/* Mono, because a path is read character by character; a narrow box drops the\n * tail, and the whole path stays in the row's title attribute. */\n.dirPath_318697645 {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 11px;\n  line-height: 16px;\n  color: var(--dsw-alias-label-primary);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* The row a path is typed into, when no dialog could be reached. */\n.dirRow_318697645 input {\n  flex: 1;\n  min-width: 0;\n}\n\n/* A configured directory this computer could not read, one line per directory. */\n.problem_318697645 {\n  margin: 4px 0 0;\n  font-size: 11px;\n  line-height: 1.5;\n  color: var(--dsw-alias-label-error);\n}\n\n.notice_318697645 {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  padding: 10px 12px;\n  border: 1px solid var(--dsw-alias-border-l2);\n  border-radius: 10px;\n  background: var(--dsw-alias-bg-layer-2);\n  font-size: 12px;\n}\n\n.noticeTitle_318697645 {\n  font-weight: 600;\n  color: var(--dsw-alias-label-primary);\n}\n\n/*\n * The sync actions. Six short labels have to sit on one row, so the buttons\n * keep their own padding down; wrapping stays on only as a narrow-card escape.\n * With no frame to separate them, the spacing has to: each label carries 6px of\n * its own and the row adds 2px, so neighbouring labels sit 14px apart — roomy\n * enough to read as separate actions, tight enough not to break the row.\n */\n.footer_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 2px;\n  flex-wrap: wrap;\n  padding-top: 4px;\n}\n\n/*\n * Every sync action is a text button: no frame, no fill, only a label. The\n * reason is the row itself — six framed buttons next to the settings above read\n * as a second form — and the risk a text button always carries: 「看不出是个\n * 按钮」. That is answered by colour and by the pointer, not by a box:\n *\n * - the label sits in the ordinary primary colour, so it reads as text that\n *   happens to be clickable;\n * - the hover fill comes from `ghost` and appears under the pointer, which is\n *   exactly when the question 「能点吗」 gets asked;\n * - the focus ring is drawn here because `ghost` has none of its own, and a\n *   keyboard user has no pointer to discover the button with.\n *\n * `height: auto` drops the control's 28px box so six labels fit one line; the\n * 24px `min-height` keeps the hover fill from collapsing onto the glyphs. The\n * 500 weight is what makes the whole row read as one band of controls rather\n * than as a sentence that happens to end the section: at 12px, ordinary body\n * weight next to ordinary body text is the one thing a text button cannot\n * recover from with colour alone.\n */\n.footer_318697645 button.textAction_318697645 {\n  height: auto;\n  min-height: 24px;\n  padding: 0 6px;\n  color: var(--dsw-alias-label-primary);\n  font-weight: 500;\n}\n\n.footer_318697645 button.textAction_318697645:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover);\n  color: var(--dsw-alias-label-primary);\n}\n\n.footer_318697645 button.textAction_318697645:focus-visible {\n  outline: var(--dsw-focus-ring-width) solid var(--dsw-focus-ring-color, var(--dsw-alias-state-business-primary));\n  outline-offset: 1px;\n}\n\n/*\n * The one action this part of the card is for. It is the row's only accented\n * label, which is what makes 「立即同步」 findable without a filled box; the\n * colour carries it in both themes, where a 12px label is small enough that\n * hue alone would need a second signal — here that signal is being the only\n * coloured one in an otherwise grey row, so the weight stays the row's own.\n */\n.footer_318697645 button.textActionPrimary_318697645 {\n  color: var(--dsw-alias-state-business-primary);\n}\n\n.footer_318697645 button.textActionPrimary_318697645:hover:not(:disabled) {\n  color: var(--dsw-alias-state-business-primary);\n}\n\n/*\n * The two actions that replace one whole side with the other: 「服务器覆盖本机」\n * and 「本机覆盖服务器」. They are the only pair in the row that can throw away\n * work on the side it writes, so they carry the warning colour while staying\n * text buttons. Not the error colour: both are reversible (a restore has\n * `undo`, an upload keeps the old file in `sync/`), and red would say otherwise.\n *\n * `warn-label`, not `warn-primary`: the design system splits these two — the\n * primary amber (#f59e0b) paints dots and tag fills, while warning *text* uses\n * the darker `label` step (#dd8629), which is what `Toast` and\n * `ConnectionIndicator` put on 12px labels exactly like this one. At 12px the\n * primary amber on a light card is barely 2:1 against the surface; the label\n * step is the token that was picked for reading, so it is the one used here.\n */\n.footer_318697645 button.textActionReplace_318697645 {\n  color: var(--dsw-alias-state-warn-label);\n}\n\n.footer_318697645 button.textActionReplace_318697645:hover:not(:disabled) {\n  background: color-mix(in srgb, var(--dsw-alias-state-warn-label) 10%, transparent);\n  color: var(--dsw-alias-state-warn-label);\n}\n\n.spacer_318697645 {\n  flex: 1;\n}\n\n/* The card's own actions: WebDAV settings, kept apart from the sync ones. */\n.cardFooter_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-wrap: wrap;\n  margin-top: 4px;\n  padding-top: 12px;\n  border-top: 1px solid var(--dsw-alias-border-l2);\n}\n\n.failed_318697645 {\n  font-size: 12px;\n  color: var(--dsw-alias-label-error);\n}\n\n.note_318697645 {\n  font-size: 12px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.confirm_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-wrap: wrap;\n  padding: 10px 12px;\n  border: 1px solid var(--dsw-alias-border-l4);\n  border-radius: 10px;\n  font-size: 12px;\n  color: var(--dsw-alias-label-primary);\n}\n\n.previewList_318697645 {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  font-size: 12px;\n}\n\n.previewRow_318697645 {\n  display: flex;\n  gap: 8px;\n}\n\n.previewPart_318697645 {\n  min-width: 90px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.output_318697645 {\n  max-height: 180px;\n  margin: 0;\n  overflow: auto;\n  padding: 8px 10px;\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-3);\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n  font-size: 11px;\n  line-height: 1.5;\n  white-space: pre-wrap;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.spin_318697645 {\n  animation: webdavSyncSpin 0.9s linear infinite;\n}\n\n@keyframes webdavSyncSpin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/*\n * The forwarder's switch and the two values it hands out.\n *\n * The switch is a checkbox like the ones that choose the parts, and it reads at\n * the size of the section titles rather than at the primitive's own 14px: one\n * line of body-sized text under a title is a control shouting over its heading.\n *\n * The address is what a reader copies, so it is plain text — monospace, because\n * a path is read character by character — with the copy icon right after it and\n * no frame: a field around a value nobody types only reads as something to fill\n * in. The account sits under it the same way: name, value, copy icon. All three\n * are named, because three copy buttons in a row are otherwise three buttons\n * that all say 「copy」.\n */\n.relaySwitch_318697645 {\n  margin-bottom: 6px;\n}\n\n.relaySwitch_318697645 label {\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.relayAddressRow_318697645,\n.relayAccountRow_318697645 {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  flex-wrap: wrap;\n  margin-bottom: 6px;\n}\n\n/* The two account values are two groups rather than four loose items: the wider\n * gap separates them, the narrow one binds each label to its value and icon. */\n.relayAccountRow_318697645 {\n  gap: 6px 14px;\n}\n\n/* One value with its copy icon. It stays on one line, so a wrapped card can\n * never leave an icon under a value it does not copy. */\n.relayPair_318697645 {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n}\n\n/* Plain text rather than a field frame, but still the reader's to select: the\n * failure hint's fallback — select it and copy by hand — has to keep working.\n * It takes only the width it needs, so the copy icon sits at the end of the\n * address instead of being pushed out to the card's right edge: the icon\n * belongs to that string, and a gap would read as a separate action. */\n.relayAddress_318697645 {\n  flex: 0 1 auto;\n  min-width: 0;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 12px;\n  line-height: 18px;\n  color: var(--dsw-alias-label-primary);\n  overflow-wrap: anywhere;\n}\n\n/* An icon button: the primitive's frame drops away, and what is left is the\n * app's own pressable shape — the hover wash around a 16px glyph, at the 24px\n * the app's other icon actions take. */\nbutton.relayCopy_318697645 {\n  flex: none;\n  width: 24px;\n  height: 24px;\n  padding: 0;\n  color: var(--dsw-alias-label-secondary);\n}\n\nbutton.relayCopy_318697645:hover:not(:disabled) {\n  color: var(--dsw-alias-label-primary);\n}\n\n.relayLabel_318697645 {\n  font-size: 12px;\n  line-height: 18px;\n  color: var(--dsw-alias-label-tertiary);\n}\n\n/* A value with nothing around it: the three things a reader takes away — the\n * address and the two account strings — are all set the same way, because none\n * of them is a field. A frame here would say 「fill this in」 about a string that\n * is generated and read-only. */\n.relayValue_318697645 {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 12px;\n  line-height: 18px;\n  color: var(--dsw-alias-label-primary);\n}\n";
 		const tagId = "dsh-webdav-sync/WebdavSyncCard.module.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"" + tagId + "\"]") === null) {
 			const tag = document.createElement("style");
@@ -66,20 +97,31 @@ window.__ModuleLoader__.load({
 			"page": "page_318697645",
 			"legend": "legend_318697645",
 			"hint": "hint_318697645",
+			"times": "times_318697645",
 			"field": "field_318697645",
 			"fieldLabel": "fieldLabel_318697645",
 			"fieldHint": "fieldHint_318697645",
 			"grid": "grid_318697645",
+			"headersArea": "headersArea_318697645",
 			"partRow": "partRow_318697645",
-			"toggleRow": "toggleRow_318697645",
+			"labelRow": "labelRow_318697645",
 			"autoControl": "autoControl_318697645",
 			"partText": "partText_318697645",
 			"partHint": "partHint_318697645",
 			"partState": "partState_318697645",
 			"partStateBoth": "partStateBoth_318697645",
+			"titleRow": "titleRow_318697645",
+			"dirList": "dirList_318697645",
+			"dirRow": "dirRow_318697645",
+			"dirOff": "dirOff_318697645",
+			"dirPath": "dirPath_318697645",
+			"problem": "problem_318697645",
 			"notice": "notice_318697645",
 			"noticeTitle": "noticeTitle_318697645",
 			"footer": "footer_318697645",
+			"textAction": "textAction_318697645",
+			"textActionPrimary": "textActionPrimary_318697645",
+			"textActionReplace": "textActionReplace_318697645",
 			"spacer": "spacer_318697645",
 			"cardFooter": "cardFooter_318697645",
 			"failed": "failed_318697645",
@@ -89,9 +131,188 @@ window.__ModuleLoader__.load({
 			"previewRow": "previewRow_318697645",
 			"previewPart": "previewPart_318697645",
 			"output": "output_318697645",
-			"spin": "spin_318697645"
+			"spin": "spin_318697645",
+			"relaySwitch": "relaySwitch_318697645",
+			"relayAddressRow": "relayAddressRow_318697645",
+			"relayAccountRow": "relayAccountRow_318697645",
+			"relayPair": "relayPair_318697645",
+			"relayAddress": "relayAddress_318697645",
+			"relayCopy": "relayCopy_318697645",
+			"relayLabel": "relayLabel_318697645",
+			"relayValue": "relayValue_318697645"
 		};
 		//#endregion
+		//#region src/client/RelayPanel.tsx
+		/**
+		* The forwarder's section of the card.
+		*
+		* It is a section of the sync's own form, not a panel of its own: one switch, and
+		* — once it is on — the one address another program is pointed at, as plain text
+		* with a copy icon right after it, and the account that address asks for
+		* underneath it, each of its two values carrying the same copy icon. Nothing here
+		* is filled in and nothing here is saved separately: everything the forwarder uses
+		* is the configuration above it, and the account is generated.
+		*
+		* The address is worked out from the draft rather than from what the host last
+		* reported, so the line shows the address this configuration *will* hand out,
+		* following the address above as it is edited. What the host is actually running
+		* comes from the view: whether it is listening, why it is not, and the account it
+		* minted, which does not exist until the first save. The port is part of the
+		* address rather than a field of its own — a reader copies one string, and the
+		* one case where the port needs changing (some other program already holds it)
+		* is exactly the case where the host reports it.
+		*
+		* @module webdav-sync/client/RelayPanel
+		*/
+		/** How long a copy icon says it worked, matching the app's own copy buttons. */
+		const COPIED_MS = 1e3;
+		/**
+		* One copy icon: a ghost button whose glyph changes to a check for a moment.
+		*
+		* @param props - the label, whether it worked, and the write to run.
+		* @returns the button, with its tooltip.
+		*/
+		function CopyControl({ label, done, onCopy }) {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Tooltip, {
+				label,
+				side: "top",
+				portal: true,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+					variant: "ghost",
+					size: "sm",
+					className: WebdavSyncCard_module_default.relayCopy,
+					icon: done ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCheckOutlineRegular, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCopyOutlineRegular, {}),
+					"aria-label": label,
+					onClick: onCopy
+				})
+			});
+		}
+		/**
+		* The forwarder section.
+		*
+		* @param props - the draft's switch and port, the host's view, and the dictionary.
+		* @returns the section.
+		*/
+		function RelayPanel(props) {
+			const { t, target, enabled, port, view, busy } = props;
+			const [copied, setCopied] = (0, react.useState)(void 0);
+			const revert = (0, react.useRef)(void 0);
+			const address = relayUrl(port, relayBasePath(target));
+			const account = view?.user ?? "";
+			const password = view?.password ?? "";
+			const listening = view?.listening === true && view.port === port && view.url === address;
+			const problem = view?.error ?? "";
+			(0, react.useEffect)(() => () => window.clearTimeout(revert.current), []);
+			const copy = (which, text) => {
+				(0, _deepseek_ai_dsh_client_ui_primitives.writeClipboard)(text).then((ok) => {
+					setCopied({
+						target: which,
+						ok
+					});
+					window.clearTimeout(revert.current);
+					if (ok) revert.current = window.setTimeout(() => setCopied(void 0), COPIED_MS);
+				});
+			};
+			/** One value's copy icon, saying 「已复制」 for it and for nothing else. */
+			const control = (which, text, base) => {
+				const done = copied?.target === which && copied.ok;
+				const failed = copied?.target === which && !copied.ok;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CopyControl, {
+					label: done ? t("relayCopied") : t(base),
+					done,
+					onCopy: () => copy(which, text)
+				}), failed && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: WebdavSyncCard_module_default.failed,
+					role: "alert",
+					children: t("relayCopyFailed")
+				})] });
+			};
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("h4", {
+					className: WebdavSyncCard_module_default.legend,
+					children: [t("relayLegend"), enabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Tag, {
+						tone: listening ? "success" : "quiet",
+						children: listening ? t("relayListening") : t("relayIdle")
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: WebdavSyncCard_module_default.relaySwitch,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Checkbox, {
+						checked: enabled,
+						label: t("relayEnable"),
+						disabled: busy,
+						onChange: (next) => props.onToggle(next)
+					})
+				}),
+				enabled && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+					target.trim() === "" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: WebdavSyncCard_module_default.hint,
+						children: t("relayNoTarget")
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: WebdavSyncCard_module_default.relayAddressRow,
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: WebdavSyncCard_module_default.relayLabel,
+								children: t("relayAddressLabel")
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", {
+								className: WebdavSyncCard_module_default.relayAddress,
+								children: address
+							}),
+							control("address", address, "relayCopyAddress")
+						]
+					}),
+					problem !== "" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: WebdavSyncCard_module_default.relayAddressRow,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: WebdavSyncCard_module_default.failed,
+							role: "alert",
+							children: problem
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+							variant: "ghost",
+							size: "sm",
+							disabled: busy,
+							onClick: () => props.onNextPort(),
+							children: t("relayNextPort")
+						})]
+					}),
+					account === "" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: WebdavSyncCard_module_default.hint,
+						children: t("relayAccountLater")
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: WebdavSyncCard_module_default.relayAccountRow,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: WebdavSyncCard_module_default.relayPair,
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: WebdavSyncCard_module_default.relayLabel,
+									children: t("relayUserLabel")
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: WebdavSyncCard_module_default.relayValue,
+									children: account
+								}),
+								control("user", account, "relayCopyUser")
+							]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: WebdavSyncCard_module_default.relayPair,
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: WebdavSyncCard_module_default.relayLabel,
+									children: t("relayPasswordLabel")
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: WebdavSyncCard_module_default.relayValue,
+									children: password
+								}),
+								control("password", password, "relayCopyPassword")
+							]
+						})]
+					})
+				] })
+			] });
+		}
+		//#endregion
 		//#region src/client/WebdavSyncCard.tsx
 		/**
 		* The WebDAV sync card, rendered in two seats from one body:
@@ -113,17 +334,40 @@ window.__ModuleLoader__.load({
 			models: "partModels",
 			defaults: "partDefaults",
 			plugins: "partPlugins",
-			patch: "partPatch"
+			patch: "partPatch",
+			dirs: "partDirs"
 		};
 		/** Which dictionary key says, in a line, what a part carries. */
 		const PART_HINT = {
 			models: "partModelsHint",
 			defaults: "partDefaultsHint",
 			plugins: "partPluginsHint",
-			patch: "partPatchHint"
+			patch: "partPatchHint",
+			dirs: "partDirsHint"
 		};
+		/**
+		* The parts whose switch is a checkbox on their own row.
+		*
+		* The extra directories are a `part` too — they hash, merge and travel like the
+		* four profile parts — but there is no single boolean behind them: the list
+		* itself is the part, so it is turned off by removing every row, and its rows
+		* are edited one by one instead of behind one label. Filtering it out keeps the
+		* checkbox loop honest, and the predicate is what tells the compiler so.
+		*/
+		function isToggledPart(view) {
+			return view.part !== "dirs";
+		}
 		/** The value of the auto-sync control's first tab, which is not an interval. */
 		const AUTO_OFF = "off";
+		/**
+		* How often the card re-reads the status while it is open, in milliseconds.
+		*
+		* The host's own timer works in minutes, so anything in that range would do;
+		* this is small enough that a page left open shows a sync as soon as it happens
+		* and large enough that the host is not being asked constantly. Nothing here
+		* reaches the server: `status` reads the profile and the state file.
+		*/
+		const STATUS_EVERY_MS = 15e3;
 		/** Which dictionary key names the action in flight. */
 		const BUSY_TEXT = {
 			check: "check",
@@ -178,6 +422,11 @@ window.__ModuleLoader__.load({
 			(0, react.useEffect)(() => {
 				if (onPage) props.ensure();
 			}, [onPage]);
+			(0, react.useEffect)(() => {
+				if (!onPage) return void 0;
+				const timer = setInterval(() => props.poll(), STATUS_EVERY_MS);
+				return () => clearInterval(timer);
+			}, [onPage]);
 			if (state.phase === "loading") return onPage ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 				className: WebdavSyncCard_module_default.note,
 				role: "status",
@@ -203,8 +452,9 @@ window.__ModuleLoader__.load({
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 					className: WebdavSyncCard_module_default.footer,
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
-						variant: "outline",
+						variant: "ghost",
 						size: "sm",
+						className: `${WebdavSyncCard_module_default.textAction} ${WebdavSyncCard_module_default.textActionPrimary}`,
 						onClick: () => props.refresh(),
 						children: t("check")
 					})
@@ -212,14 +462,11 @@ window.__ModuleLoader__.load({
 			});
 			const busy = state.busy !== "";
 			const busyKey = BUSY_TEXT[state.busy];
+			const dirsPart = (state.view?.parts ?? []).find((part) => part.part === "dirs");
 			const confirmText = state.confirm === "restore" ? t("confirmRestore") : state.confirm === "upload" ? t("confirmUpload") : state.confirm === "off" ? t("confirmOff") : "";
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: WebdavSyncCard_module_default.page,
 				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-						className: WebdavSyncCard_module_default.hint,
-						children: t("sectionSubtitle")
-					}),
 					state.error !== "" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 						className: WebdavSyncCard_module_default.failed,
 						role: "alert",
@@ -232,24 +479,17 @@ window.__ModuleLoader__.load({
 						}),
 						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: WebdavSyncCard_module_default.field,
-							children: [
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
-									className: WebdavSyncCard_module_default.fieldLabel,
-									htmlFor: "webdav-sync-url",
-									children: t("urlLabel")
-								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-									className: WebdavSyncCard_module_default.fieldHint,
-									children: t("urlHint")
-								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Input, {
-									id: "webdav-sync-url",
-									value: state.url,
-									spellCheck: false,
-									placeholder: "https://dav.jianguoyun.com/dav/",
-									onChange: (event) => props.edit("url", event.target.value)
-								})
-							]
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+								className: WebdavSyncCard_module_default.fieldLabel,
+								htmlFor: "webdav-sync-url",
+								children: t("urlLabel")
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Input, {
+								id: "webdav-sync-url",
+								value: state.url,
+								spellCheck: false,
+								placeholder: "https://dav.jianguoyun.com/dav/",
+								onChange: (event) => props.edit("url", event.target.value)
+							})]
 						}),
 						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: WebdavSyncCard_module_default.grid,
@@ -268,10 +508,17 @@ window.__ModuleLoader__.load({
 								})]
 							}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 								className: WebdavSyncCard_module_default.field,
-								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
-									className: WebdavSyncCard_module_default.fieldLabel,
-									htmlFor: "webdav-sync-password",
-									children: t("passwordLabel")
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: WebdavSyncCard_module_default.labelRow,
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+										className: WebdavSyncCard_module_default.fieldLabel,
+										htmlFor: "webdav-sync-password",
+										children: t("passwordLabel")
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Checkbox, {
+										checked: state.rememberPassword,
+										label: t("rememberPassword"),
+										onChange: (next) => props.toggle("rememberPassword", next)
+									})]
 								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Input, {
 									id: "webdav-sync-password",
 									type: "password",
@@ -305,14 +552,20 @@ window.__ModuleLoader__.load({
 							]
 						}),
 						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							className: WebdavSyncCard_module_default.toggleRow,
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Checkbox, {
-								checked: state.rememberPassword,
-								label: t("rememberPassword"),
-								onChange: (next) => props.toggle("rememberPassword", next)
-							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-								className: WebdavSyncCard_module_default.fieldHint,
-								children: t("rememberPasswordHint")
+							className: WebdavSyncCard_module_default.field,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+								className: WebdavSyncCard_module_default.fieldLabel,
+								htmlFor: "webdav-sync-headers",
+								children: t("headersLabel")
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+								id: "webdav-sync-headers",
+								className: WebdavSyncCard_module_default.headersArea,
+								rows: 3,
+								spellCheck: false,
+								autoComplete: "off",
+								placeholder: t("headersPlaceholder"),
+								value: state.headers,
+								onChange: (event) => props.edit("headers", event.target.value)
 							})]
 						})
 					] }),
@@ -336,11 +589,7 @@ window.__ModuleLoader__.load({
 							className: WebdavSyncCard_module_default.legend,
 							children: t("partsLegend")
 						}),
-						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-							className: WebdavSyncCard_module_default.hint,
-							children: t("partsHint")
-						}),
-						(state.view?.parts ?? []).map((part) => {
+						(state.view?.parts ?? []).filter(isToggledPart).map((part) => {
 							const stateKey = part.synced ? partStateKey(part) : "partOff";
 							return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 								className: WebdavSyncCard_module_default.partRow,
@@ -361,51 +610,122 @@ window.__ModuleLoader__.load({
 								})]
 							}, part.part);
 						}),
-						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-							className: WebdavSyncCard_module_default.hint,
-							children: state.view?.last === void 0 ? t("neverSynced") : t("lastSync", { at: whenText(state.view.last) })
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: WebdavSyncCard_module_default.dirList,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: WebdavSyncCard_module_default.partRow,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+									className: WebdavSyncCard_module_default.partText,
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+										className: WebdavSyncCard_module_default.titleRow,
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Checkbox, {
+											checked: state.dirsEnabled,
+											label: t("partDirs"),
+											title: t("partOffHint"),
+											onChange: (next) => props.toggle("dirsEnabled", next)
+										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+											variant: "ghost",
+											size: "sm",
+											disabled: busy || state.dirs.length >= 5,
+											onClick: () => props.pickDir(),
+											children: t("chooseDir")
+										})]
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										className: WebdavSyncCard_module_default.partHint,
+										children: t("partDirsHint")
+									})]
+								}), dirsPart !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: WebdavSyncCard_module_default.partState,
+									children: t(dirsPart.synced ? partStateKey(dirsPart) : "partOff")
+								})]
+							}), state.dirs.map((path, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: state.dirsEnabled ? WebdavSyncCard_module_default.dirRow : `${WebdavSyncCard_module_default.dirRow} ${WebdavSyncCard_module_default.dirOff}`,
+								children: [path === "" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Input, {
+									id: `webdav-sync-dir-${index}`,
+									value: path,
+									spellCheck: false,
+									autoComplete: "off",
+									placeholder: t("dirPlaceholder"),
+									disabled: busy,
+									onChange: (event) => props.editDir(index, event.target.value)
+								}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: WebdavSyncCard_module_default.dirPath,
+									title: path,
+									children: path
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
+									variant: "outline",
+									size: "sm",
+									disabled: busy,
+									onClick: () => props.removeDir(index),
+									children: t("dirRemove")
+								})]
+							}, index))]
+						}),
+						(state.view?.dirProblems ?? []).map((problem) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+							className: WebdavSyncCard_module_default.problem,
+							role: "status",
+							children: t("dirProblem", {
+								path: problem.path,
+								message: problem.message
+							})
+						}, problem.path)),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: WebdavSyncCard_module_default.times,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: WebdavSyncCard_module_default.hint,
+								children: state.view?.last === void 0 ? t("neverChecked") : t("lastCheck", { at: whenText(state.view.last) })
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: WebdavSyncCard_module_default.hint,
+								children: state.view?.moved === void 0 ? t("neverSynced") : t("lastSync", { at: whenText(state.view.moved) })
+							})]
 						}),
 						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: WebdavSyncCard_module_default.footer,
 							children: [
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
-									variant: "outline",
+									variant: "ghost",
 									size: "sm",
+									className: WebdavSyncCard_module_default.textAction,
 									disabled: busy,
 									onClick: () => props.check(),
 									children: state.busy === "check" ? t("working") : t("check")
 								}),
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
-									variant: "outline",
+									variant: "ghost",
 									size: "sm",
+									className: WebdavSyncCard_module_default.textAction,
 									disabled: busy,
 									onClick: () => props.preview(),
 									children: state.busy === "preview" ? t("working") : t("preview")
 								}),
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
-									variant: "primary",
+									variant: "ghost",
 									size: "sm",
+									className: `${WebdavSyncCard_module_default.textAction} ${WebdavSyncCard_module_default.textActionPrimary}`,
 									disabled: busy,
 									onClick: () => props.sync(),
 									children: state.busy === "sync" ? t("working") : t("syncNow")
 								}),
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
-									variant: "outline",
+									variant: "ghost",
 									size: "sm",
+									className: `${WebdavSyncCard_module_default.textAction} ${WebdavSyncCard_module_default.textActionReplace}`,
 									disabled: busy,
 									onClick: () => props.askRestore(),
 									children: t("restore")
 								}),
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
-									variant: "outline",
+									variant: "ghost",
 									size: "sm",
+									className: WebdavSyncCard_module_default.textAction,
 									disabled: busy || !(state.view?.undoable ?? false),
 									onClick: () => props.undo(),
 									children: t("undo")
 								}),
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Button, {
-									variant: "outline",
+									variant: "ghost",
 									size: "sm",
+									className: `${WebdavSyncCard_module_default.textAction} ${WebdavSyncCard_module_default.textActionReplace}`,
 									disabled: busy,
 									onClick: () => props.askUpload(),
 									children: t("upload")
@@ -511,6 +831,16 @@ window.__ModuleLoader__.load({
 							t("working")
 						]
 					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RelayPanel, {
+						t,
+						target: state.url,
+						enabled: state.relayEnabled,
+						port: state.relayPort,
+						view: state.view?.relay,
+						busy,
+						onToggle: (next) => props.toggle("relayEnabled", next),
+						onNextPort: () => props.nextPort()
+					}),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						className: WebdavSyncCard_module_default.cardFooter,
 						children: [
@@ -655,12 +985,17 @@ window.__ModuleLoader__.load({
 			user: "",
 			password: "",
 			passphrase: "",
+			headers: "",
+			dirs: [],
+			dirsEnabled: true,
 			rememberPassword: true,
 			autoEvery: -1,
 			models: true,
 			defaults: true,
 			plugins: true,
 			patch: true,
+			relayEnabled: false,
+			relayPort: RELAY_DEFAULT_PORT,
 			dirty: false,
 			busy: "",
 			message: "",
@@ -675,6 +1010,16 @@ window.__ModuleLoader__.load({
 			state = EMPTY;
 			listeners = /* @__PURE__ */ new Set();
 			started = false;
+			/** The directory dialog of this deployment, when it has one. */
+			choose;
+			/**
+			* @param choose - how this deployment picks a directory. Left out, the card
+			*   still works: a pick then leaves a blank row the path is typed into, which
+			*   is also what a deployment with no reachable dialog gets.
+			*/
+			constructor(choose) {
+				this.choose = choose;
+			}
 			getSnapshot() {
 				return this.state;
 			}
@@ -708,12 +1053,17 @@ window.__ModuleLoader__.load({
 					user: view.config.user,
 					password: "",
 					passphrase: "",
+					headers: view.config.headers,
+					dirs: [...view.config.dirs ?? []],
+					dirsEnabled: view.config.dirsEnabled ?? true,
 					rememberPassword: view.config.rememberPassword,
 					autoEvery: view.config.autoEvery,
 					models: view.config.models,
 					defaults: view.config.defaults,
 					plugins: view.config.plugins,
 					patch: view.config.patch,
+					relayEnabled: view.config.relayEnabled ?? false,
+					relayPort: view.config.relayPort ?? 3426,
 					dirty: false
 				});
 			}
@@ -762,6 +1112,31 @@ window.__ModuleLoader__.load({
 			refresh() {
 				this.load();
 			}
+			/**
+			* A read the person did not ask for, for a timer. A first read already in
+			* flight is allowed to land rather than asked for twice, and nothing here ever
+			* reports a failure: the buttons are the paths that say what went wrong, and a
+			* read that quietly could not be answered leaves the card showing the last
+			* thing the host did say.
+			*/
+			poll() {
+				if (this.state.phase === "loading") return;
+				this.reloadStatus();
+			}
+			/** Re-read the status and fold it in without disturbing what is being typed. */
+			async reloadStatus() {
+				const answer = await requestStatus();
+				if (!answer.ok) return;
+				if (this.state.dirty) {
+					this.set({
+						view: answer.data,
+						error: ""
+					});
+					return;
+				}
+				this.set({ error: "" });
+				this.adopt(answer.data);
+			}
 			edit(field, value) {
 				this.set({
 					[field]: value,
@@ -774,6 +1149,50 @@ window.__ModuleLoader__.load({
 					dirty: true
 				});
 			}
+			/**
+			* Ask for a directory and stage it.
+			*
+			* A dialog that opened and was cancelled stages nothing: a cancel must not
+			* leave a row behind. A dialog that cannot be reached at all leaves one blank
+			* row instead, which is the one way left to name a path by hand.
+			*/
+			pickDir() {
+				if (this.state.dirs.length >= 5) return;
+				const choose = this.choose;
+				if (choose === void 0) {
+					this.appendDir("");
+					return;
+				}
+				choose().then((chosen) => {
+					const path = (chosen ?? "").trim();
+					if (path !== "") this.appendDir(path);
+				}, () => this.appendDir(""));
+			}
+			/** Stage a row at the end of the list, unless that exact path is already on it. */
+			appendDir(path) {
+				if (this.state.dirs.length >= 5) return;
+				if (path !== "" && this.state.dirs.includes(path)) return;
+				this.set({
+					dirs: [...this.state.dirs, path],
+					dirty: true
+				});
+			}
+			editDir(index, path) {
+				if (index < 0 || index >= this.state.dirs.length) return;
+				const dirs = [...this.state.dirs];
+				dirs[index] = path;
+				this.set({
+					dirs,
+					dirty: true
+				});
+			}
+			removeDir(index) {
+				if (index < 0 || index >= this.state.dirs.length) return;
+				this.set({
+					dirs: this.state.dirs.filter((_, at) => at !== index),
+					dirty: true
+				});
+			}
 			setAuto(minutes) {
 				if (!AUTO_CHOICES.includes(minutes)) return;
 				this.set({
@@ -781,6 +1200,13 @@ window.__ModuleLoader__.load({
 					dirty: true
 				});
 			}
+			nextPort() {
+				if (this.state.relayPort >= 65535) return;
+				this.set({
+					relayPort: this.state.relayPort + 1,
+					dirty: true
+				});
+			}
 			reset() {
 				const view = this.state.view;
 				if (view === void 0) return;
@@ -801,12 +1227,17 @@ window.__ModuleLoader__.load({
 					user: this.state.user,
 					password: this.state.password,
 					passphrase: this.state.passphrase,
+					headers: this.state.headers,
 					autoEvery: this.state.autoEvery,
 					models: this.state.models,
 					defaults: this.state.defaults,
 					plugins: this.state.plugins,
 					patch: this.state.patch,
+					dirs: this.state.dirs,
+					dirsEnabled: this.state.dirsEnabled,
 					rememberPassword: this.state.rememberPassword,
+					relayEnabled: this.state.relayEnabled,
+					relayPort: this.state.relayPort,
 					...extra
 				};
 			}
@@ -885,9 +1316,14 @@ window.__ModuleLoader__.load({
 				return {
 					ensure: () => this.ensure(),
 					refresh: () => this.refresh(),
+					poll: () => this.poll(),
 					edit: (field, value) => this.edit(field, value),
 					toggle: (field, value) => this.toggle(field, value),
+					pickDir: () => this.pickDir(),
+					editDir: (index, path) => this.editDir(index, path),
+					removeDir: (index) => this.removeDir(index),
 					setAuto: (minutes) => this.setAuto(minutes),
+					nextPort: () => this.nextPort(),
 					reset: () => this.reset(),
 					save: () => this.save(),
 					check: () => this.check(),
@@ -904,31 +1340,47 @@ window.__ModuleLoader__.load({
 			}
 		};
 		//#endregion
+		//#region src/client/picker.ts
+		/**
+		* Build the chooser for whatever this deployment has.
+		*
+		* @param ctx - the client context, used only to look the workspace service up.
+		* @returns the chooser; it rejects when no dialog can be reached.
+		*/
+		function directoryChooser(ctx) {
+			const lookup = ctx.get.bind(ctx);
+			return async () => {
+				const bridge = globalThis.__DSH_DIRECTORY_PICKER__;
+				if (typeof bridge?.pick === "function") return await bridge.pick();
+				const workspace = lookup("uiWorkspace");
+				if (typeof workspace?.pickDirectory === "function") return await workspace.pickDirectory();
+				throw new Error("no directory chooser is available here");
+			};
+		}
+		//#endregion
 		//#region src/client/locales.ts
 		const NS = "webdav-sync";
 		/** Chinese copy — the source dictionary. */
 		const zh = {
 			sectionTitle: "WebDAV 同步",
-			sectionSubtitle: "把本机的模型配置与已装插件同步到 WebDAV，多台机器保持一致。",
 			cardSummaryOff: "WebDAV 同步：未开启",
 			cardSummaryOn: "WebDAV 同步：{url}",
 			cardSummaryUnset: "WebDAV 同步：已开启，地址待填写",
 			addressLegend: "服务器",
 			urlLabel: "WebDAV 地址",
-			urlHint: "地址填到文件夹这一层，例如坚果云 https://dav.jianguoyun.com/dav/。",
 			userLabel: "用户名",
 			passwordLabel: "密码",
 			passphraseLabel: "口令",
 			passphraseHint: "口令在文件离开本机前用来加密，服务器看不到内容；不要与 WebDAV 密码用同一个。",
+			headersLabel: "额外请求头",
+			headersPlaceholder: "User-Agent: Zotero/7.0\nAuthorization: Bearer xxxxx",
 			rememberPassword: "保存密码",
-			rememberPasswordHint: "「保存密码」关掉后，密码只在本次运行内使用，不写入本机。",
 			autoLegend: "自动同步",
 			autoManual: "手动同步",
 			autoEvery: "{n} 分钟",
 			autoHour: "{n} 小时",
 			autoOff: "关闭同步",
 			partsLegend: "同步内容",
-			partsHint: "按份合并：只在本机改动的推送出去，只在服务器改动的取回来，两边都改过的保留较新的一份，被替换的那份存到 sync 目录。",
 			partModels: "模型供应商与模型",
 			partModelsHint: "有哪些供应商、各自提供哪些模型、API key 从哪里读。",
 			partDefaults: "默认模型",
@@ -937,10 +1389,14 @@ window.__ModuleLoader__.load({
 			partPluginsHint: "装了哪些插件、按什么顺序加载。插件包本身不传，每台机器自己安装。",
 			partPatch: "其余 profile 配置",
 			partPatchHint: "MCP 服务器、权限预设、界面设置、insert 块等其余配置。",
+			partDirs: "附加目录",
+			partDirsHint: "profile 之外的目录，连里面的文件一起同步；路径跟着这份配置走，恢复时写回同一个目录。",
 			partSynced: "已一致",
 			partOnlyHere: "仅本机有改动",
 			partOnlyThere: "仅服务器有改动",
 			partBoth: "两边都有改动",
+			lastCheck: "上次检查：{at}",
+			neverChecked: "尚未检查过",
 			lastSync: "上次同步：{at}",
 			neverSynced: "尚未同步过",
 			noticeTitle: "上次同步替换了内容",
@@ -979,31 +1435,48 @@ window.__ModuleLoader__.load({
 			takeNewerRemote: "两边都改过，保留服务器较新的一份",
 			unavailable: "暂时不可用",
 			partOff: "不同步",
-			partOffHint: "关掉之后，本机不会再动这一份，也不会把它推给别的机器。"
+			partOffHint: "关掉之后，本机不会再动这一份，也不会把它推给别的机器。",
+			chooseDir: "选择目录",
+			dirPlaceholder: "这个目录的绝对路径",
+			dirRemove: "移除",
+			dirProblem: "「{path}」这个目录没读成：{message}",
+			relayLegend: "本机转发",
+			relayEnable: "启用本机转发",
+			relayListening: "正在转发",
+			relayIdle: "没有在转发",
+			relayNoTarget: "先在上面把 WebDAV 地址填好",
+			relayNextPort: "换一个端口",
+			relayAccountLater: "保存一次后生成给客户端用的账号密码。",
+			relayAddressLabel: "地址",
+			relayUserLabel: "用户名",
+			relayPasswordLabel: "密码",
+			relayCopyAddress: "复制地址",
+			relayCopyUser: "复制用户名",
+			relayCopyPassword: "复制密码",
+			relayCopied: "已复制",
+			relayCopyFailed: "复制没成功，请手动选中复制"
 		};
 		/** English copy, complete by construction. */
 		const en = {
 			sectionTitle: "WebDAV sync",
-			sectionSubtitle: "Keep the model setup and installed plugins the same on every computer through a WebDAV folder.",
 			cardSummaryOff: "WebDAV sync: off",
 			cardSummaryOn: "WebDAV sync: {url}",
 			cardSummaryUnset: "WebDAV sync: on, no address yet",
 			addressLegend: "Server",
 			urlLabel: "WebDAV address",
-			urlHint: "The folder itself, e.g. Nutstore https://dav.jianguoyun.com/dav/.",
 			userLabel: "User name",
 			passwordLabel: "Password",
 			passphraseLabel: "Passphrase",
 			passphraseHint: "It seals the file before it leaves this computer, so the server cannot read it. Do not reuse the password above.",
+			headersLabel: "Extra request headers",
+			headersPlaceholder: "User-Agent: Zotero/7.0\nAuthorization: Bearer xxxxx",
 			rememberPassword: "Remember the password",
-			rememberPasswordHint: "With “Remember the password” off, the password is used for this run only and is not written here.",
 			autoLegend: "Sync by itself",
 			autoManual: "By hand",
 			autoEvery: "Every {n} min",
 			autoHour: "Every {n} h",
 			autoOff: "Off",
 			partsLegend: "What is synced",
-			partsHint: "Merged a part at a time: a part changed only here is pushed, one changed only on the server is brought in, one changed on both keeps the newer, and the replaced copy is kept in the sync folder.",
 			partModels: "Model providers and models",
 			partModelsHint: "Which providers there are, what models each offers, and where their API keys come from.",
 			partDefaults: "Default model",
@@ -1012,10 +1485,14 @@ window.__ModuleLoader__.load({
 			partPluginsHint: "Which plugins are installed and in what order they load. The packages themselves stay behind: each computer installs them.",
 			partPatch: "Other profile configuration",
 			partPatchHint: "MCP servers, permission presets, interface settings, insert blocks, and the rest.",
+			partDirs: "Extra directories",
+			partDirsHint: "Directories outside the profile, carried with the files inside them; the paths travel with this configuration, and a restore writes back into the same directory.",
 			partSynced: "In step",
 			partOnlyHere: "Changed here only",
 			partOnlyThere: "Changed on the server only",
 			partBoth: "Changed on both",
+			lastCheck: "Last check: {at}",
+			neverChecked: "Never checked yet",
 			lastSync: "Last sync: {at}",
 			neverSynced: "Never synced yet",
 			noticeTitle: "The last sync replaced something",
@@ -1054,7 +1531,26 @@ window.__ModuleLoader__.load({
 			takeNewerRemote: "Both changed: keep the server’s as the newer one",
 			unavailable: "Not available",
 			partOff: "Not synced",
-			partOffHint: "Off: this computer neither changes this part nor hands it to the others."
+			partOffHint: "Off: this computer neither changes this part nor hands it to the others.",
+			chooseDir: "Choose directory",
+			dirPlaceholder: "Absolute path of the directory",
+			dirRemove: "Remove",
+			dirProblem: "Could not read the directory {path}: {message}",
+			relayLegend: "Forwarding on this computer",
+			relayEnable: "Forward for other programs on this computer",
+			relayListening: "Forwarding",
+			relayIdle: "Not forwarding",
+			relayNoTarget: "Fill in the WebDAV address above first",
+			relayNextPort: "Another port",
+			relayAccountLater: "The account for the client is made on the first save.",
+			relayAddressLabel: "Address",
+			relayUserLabel: "User name",
+			relayPasswordLabel: "Password",
+			relayCopyAddress: "Copy address",
+			relayCopyUser: "Copy user name",
+			relayCopyPassword: "Copy password",
+			relayCopied: "Copied",
+			relayCopyFailed: "Could not copy — select it and copy by hand"
 		};
 		//#endregion
 		//#region src/client/index.ts
@@ -1090,12 +1586,14 @@ window.__ModuleLoader__.load({
 				zh,
 				en
 			}), "webdav-sync: dictionaries");
-			const model = new WebdavSyncCard();
+			const model = new WebdavSyncCard(directoryChooser(ctx));
 			const bound = model.actions();
 			const t = ctx.locale.bind(NS);
 			/**
 			* The registration-side face both seats inject. The store rides the reserved
 			* `hooks` compartment, so the renderer binds it as the `useWebdavSync` prop.
+			* The forwarder is a switch inside this same store rather than a second one:
+			* its state is part of the card's draft and goes out with the same Save.
 			*/
 			const face = () => ({
 				...bound,