dsh-webdav-sync 1.0.1 → 1.0.3

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/*\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.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,10 +97,12 @@ 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",
 			"labelRow": "labelRow_318697645",
 			"autoControl": "autoControl_318697645",
@@ -77,9 +110,18 @@ window.__ModuleLoader__.load({
 			"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,6 +462,7 @@ 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,
@@ -299,6 +550,23 @@ window.__ModuleLoader__.load({
 									onChange: (event) => props.edit("passphrase", event.target.value)
 								})
 							]
+						}),
+						/* @__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-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)
+							})]
 						})
 					] }),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h4", {
@@ -321,7 +589,7 @@ window.__ModuleLoader__.load({
 							className: WebdavSyncCard_module_default.legend,
 							children: t("partsLegend")
 						}),
-						(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,
@@ -342,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")
@@ -492,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: [
@@ -636,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: "",
@@ -656,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;
 			}
@@ -689,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
 				});
 			}
@@ -743,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,
@@ -755,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({
@@ -762,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;
@@ -782,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
 				};
 			}
@@ -866,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(),
@@ -885,6 +1340,24 @@ 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. */
@@ -899,6 +1372,8 @@ window.__ModuleLoader__.load({
 			passwordLabel: "密码",
 			passphraseLabel: "口令",
 			passphraseHint: "口令在文件离开本机前用来加密，服务器看不到内容；不要与 WebDAV 密码用同一个。",
+			headersLabel: "额外请求头",
+			headersPlaceholder: "User-Agent: Zotero/7.0\nAuthorization: Bearer xxxxx",
 			rememberPassword: "保存密码",
 			autoLegend: "自动同步",
 			autoManual: "手动同步",
@@ -914,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: "上次同步替换了内容",
@@ -956,7 +1435,26 @@ 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 = {
@@ -970,6 +1468,8 @@ window.__ModuleLoader__.load({
 			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",
 			autoLegend: "Sync by itself",
 			autoManual: "By hand",
@@ -985,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",
@@ -1027,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
@@ -1063,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,