dsh-plugin-shop 0.2.0 → 0.3.1

package/README.md

@@ -39,8 +39,17 @@ Two tracks below. They do the same thing; pick the one that matches who is readi
 
 ### 🧑 For people
 
+**Prerequisites:** Node.js. Running the harness itself needs no install — the
+upstream-documented form is `npx -y @deepseek-ai/dsh web`. Plugin management
+goes through `dsh plugin`, which spawns both the `dsh` command and `pnpm` —
+install them once with `npm install -g @deepseek-ai/dsh pnpm` and verify with
+`dsh --version` and `pnpm --version`.
+
 ```sh
+# dsh on PATH (global install):
 dsh plugin --profile web add dsh-plugin-shop
+# or straight through npx, nothing installed:
+npx -y @deepseek-ai/dsh plugin --profile web add dsh-plugin-shop
 ```
 
 Replace `web` with your profile if you use another one. Then restart `dsh` once — a
@@ -94,6 +103,7 @@ bundle is not.
 | `error: required option '--profile <name>' not specified` | `--profile` was omitted | Pass it; there is no default |
 | A version older than npm's `latest` gets installed | pnpm 11 holds back very recently published versions | Expected, not an error; the newest lands once its cooldown passes |
 | `client bundles not found ... lib/client.js` | the copy on disk was built without its browser half | Install from npm rather than from a source checkout, or run `pnpm build` in that checkout |
+| `dsh: pnpm not found on PATH — install pnpm to manage profile plugins` | `dsh plugin` forwards to pnpm, and pnpm is missing | `npm install -g pnpm` |
 | `no profile directory found above <path>` | the plugin could not locate its profile | Please report it — this is resolved from `ctx.baseUrl` and should not fail |
 | The tab is missing after a restart | the bundle is not in the profile's `bundles` | Re-run step 3; if it is absent, step 2 did not complete |
 

package/lib/client.js

@@ -4359,6 +4359,11 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 		}
 		/** §7.2 once-per-second poll cadence, as a named constant. */
 		const INSTALL_POLL_MS = 1e3;
+		/** The next number of cards to show: the current window plus one batch,
+		* clamped so the window never claims more cards than the list holds. */
+		function nextVisibleCount(visible, total, batch) {
+			return Math.min(visible + batch, total);
+		}
 		/** Pure install view reducer. A `status` event only applies to the install the
 		* view is tracking — a status for an install it never started (idle) is an
 		* unrelated event and a no-op, like any other event it does not recognize. */
@@ -4474,6 +4479,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 			installTransportFailed: "安装请求未能送达。请稍后重试。",
 			refresh: "刷新",
 			staleLabel: "显示 {date} 的快照",
+			showing: "显示前 {shown} 个（共 {total}）· 继续滚动加载",
 			version: "版本",
 			repository: "仓库",
 			license: "许可",
@@ -4524,6 +4530,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 			installTransportFailed: "The install request could not be delivered. Please retry.",
 			refresh: "Refresh",
 			staleLabel: "showing {date}",
+			showing: "showing first {shown} of {total} — scroll to load more",
 			version: "Version",
 			repository: "Repository",
 			license: "License",
@@ -4593,7 +4600,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 		}
 		//#endregion
 		//#region \0dsh-plugin-shop-css:e3675a89
-		const css = "/* Shop tab styles — a market shelf inside the settings surface. The visual\n * language is the dsh theme's alias tokens ONLY (the four tokens the previous\n * styles referenced that do not exist — bg-layer-3, interactive-bg-hover,\n * state-error, state-success — are corrected to bg-layer-2 and the\n * state-*-primary set). The signature is the category spine: one brand hue\n * at six opacities, one per category, with the category name as the cover\n * label. Class names are mapped to content-derived names at bundle time\n * (tsdown.s8583e3_client.s942a79_config.s5f67aa_ts) and stubbed in tests; only the keys are relied\n * on.\n *\n * One token rule the theme forces: the background LAYERS do not carry\n * contrast. In the light theme bg-base, bg-layer-1, bg-layer-2 and\n * bg-layer-3 all resolve to the same white; only the dark theme spreads them\n * (950/875/850/800). So a layer-2 fill on a layer-1 ground is invisible for\n * half of all users, and anything whose fill is its ONLY affordance — the\n * loading skeleton, the borderless capability chips — derives its fill from\n * label-primary instead, which inverts with the theme by construction.\n * Elements that also carry a border or text may keep a layer fill.\n * `css-tokens.s8583e3_client.sfd9d8a_spec.s5f67aa_ts` pins this. */\n\n.s255e5a_panel {\n  display: flex;\n  flex-direction: column;\n  gap: 14px;\n}\n\n.s44a3ec_stateLine {\n  margin: 0;\n  color: var(--dsw-alias-label-primary);\n  font-size: 13px;\n}\n\n/* Visually hidden but screen-reader readable (the loading copy while the\n * skeleton stands in visually). */\n.s3a0ece_srOnly {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  margin: -1px;\n  padding: 0;\n  border: 0;\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  overflow: hidden;\n  white-space: nowrap;\n}\n\n/* The loading shelf: ghost cards with the same geometry as the real grid, so\n * the swap to content is a same-shape handoff instead of a jump. */\n.se0c3b4_skeletonGrid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));\n  gap: 12px;\n}\n\n.s520416_skeletonCard {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid var(--dsw-alias-border-l1);\n  border-radius: 10px;\n  background: var(--dsw-alias-bg-layer-1);\n  overflow: hidden;\n}\n\n/* The shimmer sweep: one gradient band travels across each ghost card while\n * the bars breathe, so the loading state reads as \"the shelf is scanning\". */\n.s520416_skeletonCard::after {\n  content: '';\n  position: absolute;\n  inset: 0;\n  background: linear-gradient(\n    100deg,\n    transparent 25%,\n    color-mix(in srgb, var(--dsw-alias-label-primary) 14%, transparent) 50%,\n    transparent 75%\n  );\n  transform: translateX(-100%);\n  animation: dshShopSkeletonSweep 1.4s ease-in-out infinite;\n  pointer-events: none;\n}\n\n@keyframes dshShopSkeletonSweep {\n  to { transform: translateX(100%); }\n}\n\n.s30e662_skeletonCover {\n  display: block;\n  height: 26px;\n  background: color-mix(in srgb, var(--dsw-alias-label-primary) 10%, transparent);\n}\n\n.s8c7d6f_skeletonName {\n  width: 55%;\n  height: 14px;\n  margin: 12px 12px 0;\n  border-radius: 4px;\n  background: color-mix(in srgb, var(--dsw-alias-label-primary) 8%, transparent);\n}\n\n.sf5179e_skeletonSummary {\n  width: 92%;\n  height: 12px;\n  margin: 10px 12px 0;\n  border-radius: 4px;\n  background: color-mix(in srgb, var(--dsw-alias-label-primary) 8%, transparent);\n}\n\n.sbb0d25_skeletonSummaryShort {\n  width: 68%;\n  height: 12px;\n  margin: 6px 12px 14px;\n  border-radius: 4px;\n  background: color-mix(in srgb, var(--dsw-alias-label-primary) 8%, transparent);\n}\n\n.s520416_skeletonCard span {\n  animation: dshShopSkeletonPulse 1.6s ease-in-out infinite;\n}\n\n@keyframes dshShopSkeletonPulse {\n  0%, 100% { opacity: 0.5; }\n  50% { opacity: 1; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .s520416_skeletonCard span { animation: none; opacity: 0.75; }\n  .s520416_skeletonCard::after { content: none; }\n}\n\n.s73242a_actionButton {\n  align-self: flex-start;\n  padding: 5px 14px;\n  border: 1px solid var(--dsw-alias-border-l2);\n  border-radius: 6px;\n  background: var(--dsw-alias-bg-layer-2);\n  color: var(--dsw-alias-label-primary);\n  font-size: 13px;\n  cursor: pointer;\n}\n\n.s73242a_actionButton:hover {\n  border-color: color-mix(in srgb, var(--dsw-alias-brand-primary) 45%, var(--dsw-alias-border-l2));\n  color: var(--dsw-alias-brand-primary);\n}\n\n.s73242a_actionButton:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: 1px;\n}\n\n.s646509_toolbar {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n.s232ec4_searchInput {\n  width: min(280px, 100%);\n  padding: 6px 10px;\n  border: 1px solid var(--dsw-alias-border-l2);\n  border-radius: 6px;\n  background: var(--dsw-alias-bg-layer-1);\n  color: var(--dsw-alias-label-primary);\n  font-size: 13px;\n}\n\n.s232ec4_searchInput:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: 1px;\n}\n\n.s1555aa_staleBlock {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.s3946f1_staleBadge {\n  padding: 2px 8px;\n  border-radius: 999px;\n  background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 14%, transparent);\n  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-warn-primary) 40%, transparent);\n  color: var(--dsw-alias-state-warn-primary);\n  font-size: 12px;\n}\n\n.s668774_catalogHeading {\n  margin: 2px 0 0;\n  font-size: 16px;\n  font-weight: 600;\n  letter-spacing: 0.02em;\n  color: var(--dsw-alias-label-primary);\n}\n\n.sccc4d1_catalogStats {\n  margin: -8px 0 0;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 12px;\n  letter-spacing: 0.02em;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.s6de1ab_emptyLine {\n  margin: 0;\n  color: var(--dsw-alias-label-primary);\n  font-size: 13px;\n}\n\n/* The shelf: a responsive grid of cards. */\n.sf657f5_cards {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));\n  gap: 12px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  animation: dshShopCardsIn 220ms ease;\n}\n\n@keyframes dshShopCardsIn {\n  from { opacity: 0; transform: translateY(3px); }\n  to { opacity: 1; transform: none; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .sf657f5_cards { animation: none; }\n}\n\n.s65f383_card {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid var(--dsw-alias-border-l1);\n  border-radius: 10px;\n  background: var(--dsw-alias-bg-layer-1);\n  overflow: hidden;\n  transition: border-color 120ms ease, transform 120ms ease, box-shadow 120ms ease;\n}\n\n.s65f383_card:hover {\n  border-color: color-mix(in srgb, var(--dsw-alias-brand-primary) 45%, var(--dsw-alias-border-l1));\n  transform: translateY(-1px);\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--dsw-alias-brand-primary) 12%, transparent);\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .s65f383_card { transition: none; }\n  .s65f383_card:hover { transform: none; }\n}\n\n/* The signature: a brand spine in the category's own opacity. */\n.s4ce25d_cardSpine {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  width: 3px;\n  background: color-mix(in srgb, var(--dsw-alias-brand-primary) var(--spine-opacity, 40%), transparent);\n}\n\n.s65f383_card[data-category='tool'] { --spine-opacity: 100%; }\n.s65f383_card[data-category='provider'] { --spine-opacity: 82%; }\n.s65f383_card[data-category='ui'] { --spine-opacity: 64%; }\n.s65f383_card[data-category='workflow'] { --spine-opacity: 48%; }\n.s65f383_card[data-category='integration'] { --spine-opacity: 34%; }\n.s65f383_card[data-category='other'] { --spine-opacity: 22%; }\n\n.s9e2bec_cardCover {\n  display: block;\n  padding: 5px 12px 5px 12px;\n  border-bottom: 1px solid var(--dsw-alias-border-l1);\n  background: color-mix(in srgb, var(--dsw-alias-brand-primary) var(--spine-opacity, 40%), transparent);\n}\n\n.s1a7c5b_coverLabel {\n  display: block;\n  font-size: 11px;\n  font-weight: 600;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  color: var(--dsw-alias-brand-primary);\n}\n\n.sa97234_entryHeader {\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  gap: 8px;\n  padding: 10px 12px 6px;\n  border: none;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n\n.sa97234_entryHeader:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: -2px;\n}\n\n/* The name owns the full header width; badges sit on their own line below. */\n.sc3f149_name {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 13px;\n  font-weight: 600;\n  overflow-wrap: anywhere;\n  color: var(--dsw-alias-label-primary);\n}\n\n.s513026_badges {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: 6px;\n}\n\n.s5e82cb_tierBadge {\n  padding: 1px 7px;\n  border-radius: 999px;\n  font-size: 11px;\n  line-height: 1.6;\n}\n\n.s5e82cb_tierBadge[data-tier='verified'] {\n  color: var(--dsw-alias-state-success-primary);\n  background: color-mix(in srgb, var(--dsw-alias-state-success-primary) 14%, transparent);\n  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-success-primary) 40%, transparent);\n}\n\n.s5e82cb_tierBadge[data-tier='verified-stale'] {\n  color: var(--dsw-alias-state-warn-primary);\n  background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 14%, transparent);\n  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-warn-primary) 40%, transparent);\n}\n\n.s5e82cb_tierBadge[data-tier='community'] {\n  color: var(--dsw-alias-label-secondary);\n  background: var(--dsw-alias-bg-layer-2);\n  border: 1px solid var(--dsw-alias-border-l2);\n}\n\n.s23e3e1_unclaimedBadge {\n  padding: 1px 7px;\n  border-radius: 999px;\n  border: 1px dashed var(--dsw-alias-border-l2);\n  font-size: 11px;\n  line-height: 1.6;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.s73f7fb_chevron, .s61393c_chevronOpen {\n  color: var(--dsw-alias-label-secondary);\n  transition: transform 120ms ease;\n}\n\n.s61393c_chevronOpen { transform: rotate(180deg); }\n\n@media (prefers-reduced-motion: reduce) {\n  .s73f7fb_chevron, .s61393c_chevronOpen { transition: none; }\n}\n\n.s820ebf_body {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 0 12px 12px;\n}\n\n.sb8fbc8_summary {\n  margin: 0;\n  font-size: 13px;\n  line-height: 1.5;\n  color: var(--dsw-alias-label-primary);\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.se507db_summaryZh {\n  margin: -4px 0 0;\n  font-size: 12px;\n  line-height: 1.5;\n  color: var(--dsw-alias-label-secondary);\n  display: -webkit-box;\n  -webkit-line-clamp: 1;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.s9d2029_capabilitiesBlock {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.s3bdbd5_capabilitiesNote {\n  margin: 0;\n  font-size: 11px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.s441702_capabilities {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 4px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.s441702_capabilities li {\n  padding: 1px 6px;\n  border-radius: 4px;\n  background: color-mix(in srgb, var(--dsw-alias-label-primary) 6%, transparent);\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 11px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.sde3f0c_detail {\n  border-top: 1px solid var(--dsw-alias-border-l1);\n  padding-top: 8px;\n}\n\n.se98179_detailRows {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  margin: 0;\n}\n\n.sfb4d2f_detailRow {\n  display: flex;\n  justify-content: space-between;\n  gap: 12px;\n  font-size: 12px;\n}\n\n.sfb4d2f_detailRow dt {\n  color: var(--dsw-alias-label-secondary);\n}\n\n.sfb4d2f_detailRow dd {\n  margin: 0;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  overflow-wrap: anywhere;\n  text-align: right;\n  color: var(--dsw-alias-label-primary);\n}\n\n.sd58c6d_reviewedLine {\n  margin: 8px 0 0;\n  padding: 6px 8px;\n  border-radius: 6px;\n  background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 12%, transparent);\n  font-size: 12px;\n  color: var(--dsw-alias-state-warn-primary);\n}\n\n/* Install flow. */\n.s4d374c_installPanel {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  margin-top: 2px;\n}\n\n.se7aaed_installButton, .sb43a49_confirmButton, .s6e45d1_cancelButton {\n  align-self: flex-start;\n  padding: 5px 14px;\n  border-radius: 6px;\n  font-size: 13px;\n  cursor: pointer;\n}\n\n.se7aaed_installButton {\n  border: 1px solid var(--dsw-alias-brand-primary);\n  background: var(--dsw-alias-brand-primary);\n  color: var(--dsw-alias-bg-base);\n}\n\n.se7aaed_installButton:hover {\n  background: color-mix(in srgb, var(--dsw-alias-brand-primary) 88%, var(--dsw-alias-label-primary));\n}\n\n.sb43a49_confirmButton {\n  border: 1px solid var(--dsw-alias-brand-primary);\n  background: var(--dsw-alias-brand-primary);\n  color: var(--dsw-alias-bg-base);\n}\n\n.sb43a49_confirmButton:hover {\n  background: color-mix(in srgb, var(--dsw-alias-brand-primary) 88%, var(--dsw-alias-label-primary));\n}\n\n.s6e45d1_cancelButton {\n  border: 1px solid var(--dsw-alias-border-l2);\n  background: var(--dsw-alias-bg-layer-2);\n  color: var(--dsw-alias-label-primary);\n}\n\n.s6e45d1_cancelButton:hover {\n  border-color: var(--dsw-alias-label-secondary);\n}\n\n.se7aaed_installButton:focus-visible, .sb43a49_confirmButton:focus-visible, .s6e45d1_cancelButton:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: 1px;\n}\n\n.sc4f2ac_gate {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 10px;\n  border: 1px solid var(--dsw-alias-state-warn-primary);\n  border-radius: 8px;\n  background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 8%, transparent);\n}\n\n.s559c38_gateTitle {\n  margin: 0;\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--dsw-alias-state-warn-primary);\n}\n\n.s3c0ace_gateBody {\n  margin: 0;\n  font-size: 12px;\n  line-height: 1.6;\n  color: var(--dsw-alias-label-primary);\n}\n\n.s4b2373_gateActions {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.s52b5a5_installing {\n  margin: 0;\n  font-size: 12px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.s64ab71_log {\n  max-height: 160px;\n  overflow: auto;\n  margin: 0;\n  padding: 8px;\n  border-radius: 6px;\n  background: var(--dsw-alias-bg-base);\n  border: 1px solid var(--dsw-alias-border-l1);\n  list-style: none;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 11px;\n  line-height: 1.5;\n}\n\n.s1531a8_logLine {\n  white-space: pre-wrap;\n  word-break: break-all;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.sf20dda_notice {\n  margin: 0;\n  font-size: 12px;\n  color: var(--dsw-alias-state-success-primary);\n}\n\n.seb9b08_failedHeading {\n  margin: 0;\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--dsw-alias-state-error-primary);\n}\n\n.sfd3021_failedDetail {\n  margin: 0;\n  font-size: 12px;\n  line-height: 1.6;\n  color: var(--dsw-alias-label-primary);\n}\n\n.s50ba35_rejectedCode {\n  margin: 0;\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--dsw-alias-state-error-primary);\n}\n\n.se75489_rejectedDetail {\n  margin: 0;\n  font-size: 12px;\n  line-height: 1.6;\n  color: var(--dsw-alias-label-primary);\n}\n\n/* Installed section. */\n.sa276cf_outdatedSection {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  margin-top: 6px;\n}\n\n.sceae6e_outdatedList {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.s8d2072_outdatedRow {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  flex-wrap: wrap;\n  padding: 10px 12px;\n  border: 1px solid var(--dsw-alias-border-l1);\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-1);\n}\n\n.s5c2545_outdatedInfo {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  min-width: 0;\n}\n\n.s5c2545_outdatedInfo strong {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 13px;\n  word-break: break-all;\n  color: var(--dsw-alias-label-primary);\n}\n\n.s877c68_outdatedVersions {\n  font-size: 12px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.sa1f556_outdatedActions {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n/* The enable/disable switch. */\n.s11c019_switch {\n  position: relative;\n  width: 32px;\n  height: 18px;\n  border: 1px solid var(--dsw-alias-border-l2);\n  border-radius: 999px;\n  background: var(--dsw-alias-bg-layer-2);\n  cursor: pointer;\n  transition: background 120ms ease, border-color 120ms ease;\n}\n\n.s7580e8_switchOn {\n  border-color: var(--dsw-alias-state-success-primary);\n  background: color-mix(in srgb, var(--dsw-alias-state-success-primary) 55%, transparent);\n}\n\n.saab2b3_switchKnob {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 12px;\n  height: 12px;\n  border-radius: 999px;\n  background: var(--dsw-alias-label-primary);\n  transition: transform 120ms ease, background 120ms ease;\n}\n\n.s7580e8_switchOn .saab2b3_switchKnob {\n  transform: translateX(14px);\n  background: var(--dsw-alias-bg-base);\n}\n\n.s11c019_switch:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: 1px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .s11c019_switch, .saab2b3_switchKnob { transition: none; }\n}\n";
+		const css = "/* Shop tab styles — a market shelf inside the settings surface. The visual\n * language is the dsh theme's alias tokens ONLY (the four tokens the previous\n * styles referenced that do not exist — bg-layer-3, interactive-bg-hover,\n * state-error, state-success — are corrected to bg-layer-2 and the\n * state-*-primary set). The signature is the category spine: one HUE per\n * category (six fixed hues, not the brand token — the brand resolves to\n * near-black in the light theme, so six brand opacities read as six shades\n * of gray), with the category name as the cover label in the same hue. Class names are mapped to content-derived names at bundle time\n * (tsdown.s8583e3_client.s942a79_config.s5f67aa_ts) and stubbed in tests; only the keys are relied\n * on.\n *\n * One token rule the theme forces: the background LAYERS do not carry\n * contrast. In the light theme bg-base, bg-layer-1, bg-layer-2 and\n * bg-layer-3 all resolve to the same white; only the dark theme spreads them\n * (950/875/850/800). So a layer-2 fill on a layer-1 ground is invisible for\n * half of all users, and anything whose fill is its ONLY affordance — the\n * loading skeleton, the borderless capability chips — derives its fill from\n * label-primary instead, which inverts with the theme by construction.\n * Elements that also carry a border or text may keep a layer fill.\n * `css-tokens.s8583e3_client.sfd9d8a_spec.s5f67aa_ts` pins this. */\n\n.s255e5a_panel {\n  display: flex;\n  flex-direction: column;\n  gap: 14px;\n}\n\n.s44a3ec_stateLine {\n  margin: 0;\n  color: var(--dsw-alias-label-primary);\n  font-size: 13px;\n}\n\n/* Visually hidden but screen-reader readable (the loading copy while the\n * skeleton stands in visually). */\n.s3a0ece_srOnly {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  margin: -1px;\n  padding: 0;\n  border: 0;\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  overflow: hidden;\n  white-space: nowrap;\n}\n\n/* The loading shelf: ghost cards with the same geometry as the real grid, so\n * the swap to content is a same-shape handoff instead of a jump. */\n.se0c3b4_skeletonGrid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));\n  gap: 12px;\n}\n\n.s520416_skeletonCard {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid var(--dsw-alias-border-l1);\n  border-radius: 10px;\n  background: var(--dsw-alias-bg-layer-1);\n  overflow: hidden;\n}\n\n/* The shimmer sweep: one gradient band travels across each ghost card while\n * the bars breathe, so the loading state reads as \"the shelf is scanning\". */\n.s520416_skeletonCard::after {\n  content: '';\n  position: absolute;\n  inset: 0;\n  background: linear-gradient(\n    100deg,\n    transparent 25%,\n    color-mix(in srgb, var(--dsw-alias-label-primary) 14%, transparent) 50%,\n    transparent 75%\n  );\n  transform: translateX(-100%);\n  animation: dshShopSkeletonSweep 1.4s ease-in-out infinite;\n  pointer-events: none;\n}\n\n@keyframes dshShopSkeletonSweep {\n  to { transform: translateX(100%); }\n}\n\n.s30e662_skeletonCover {\n  display: block;\n  height: 26px;\n  background: color-mix(in srgb, var(--dsw-alias-label-primary) 10%, transparent);\n}\n\n.s8c7d6f_skeletonName {\n  width: 55%;\n  height: 14px;\n  margin: 12px 12px 0;\n  border-radius: 4px;\n  background: color-mix(in srgb, var(--dsw-alias-label-primary) 8%, transparent);\n}\n\n.sf5179e_skeletonSummary {\n  width: 92%;\n  height: 12px;\n  margin: 10px 12px 0;\n  border-radius: 4px;\n  background: color-mix(in srgb, var(--dsw-alias-label-primary) 8%, transparent);\n}\n\n.sbb0d25_skeletonSummaryShort {\n  width: 68%;\n  height: 12px;\n  margin: 6px 12px 14px;\n  border-radius: 4px;\n  background: color-mix(in srgb, var(--dsw-alias-label-primary) 8%, transparent);\n}\n\n.s520416_skeletonCard span {\n  animation: dshShopSkeletonPulse 1.6s ease-in-out infinite;\n}\n\n@keyframes dshShopSkeletonPulse {\n  0%, 100% { opacity: 0.5; }\n  50% { opacity: 1; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .s520416_skeletonCard span { animation: none; opacity: 0.75; }\n  .s520416_skeletonCard::after { content: none; }\n}\n\n.s73242a_actionButton {\n  align-self: flex-start;\n  padding: 5px 14px;\n  border: 1px solid var(--dsw-alias-border-l2);\n  border-radius: 6px;\n  background: var(--dsw-alias-bg-layer-2);\n  color: var(--dsw-alias-label-primary);\n  font-size: 13px;\n  cursor: pointer;\n}\n\n.s73242a_actionButton:hover {\n  border-color: color-mix(in srgb, var(--dsw-alias-brand-primary) 45%, var(--dsw-alias-border-l2));\n  color: var(--dsw-alias-brand-primary);\n}\n\n.s73242a_actionButton:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: 1px;\n}\n\n.s646509_toolbar {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n.s232ec4_searchInput {\n  width: min(280px, 100%);\n  padding: 6px 10px;\n  border: 1px solid var(--dsw-alias-border-l2);\n  border-radius: 6px;\n  background: var(--dsw-alias-bg-layer-1);\n  color: var(--dsw-alias-label-primary);\n  font-size: 13px;\n}\n\n.s232ec4_searchInput:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: 1px;\n}\n\n.s1555aa_staleBlock {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.s3946f1_staleBadge {\n  padding: 2px 8px;\n  border-radius: 999px;\n  background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 14%, transparent);\n  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-warn-primary) 40%, transparent);\n  color: var(--dsw-alias-state-warn-primary);\n  font-size: 12px;\n}\n\n.s668774_catalogHeading {\n  margin: 2px 0 0;\n  font-size: 16px;\n  font-weight: 600;\n  letter-spacing: 0.02em;\n  color: var(--dsw-alias-label-primary);\n}\n\n.sccc4d1_catalogStats {\n  margin: -8px 0 0;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 12px;\n  letter-spacing: 0.02em;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.s6de1ab_emptyLine {\n  margin: 0;\n  color: var(--dsw-alias-label-primary);\n  font-size: 13px;\n}\n\n/* The shelf: a responsive grid of cards. */\n.sf657f5_cards {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));\n  gap: 12px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  animation: dshShopCardsIn 220ms ease;\n}\n\n@keyframes dshShopCardsIn {\n  from { opacity: 0; transform: translateY(3px); }\n  to { opacity: 1; transform: none; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .sf657f5_cards { animation: none; }\n}\n\n.s65f383_card {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid var(--dsw-alias-border-l1);\n  border-radius: 10px;\n  background: var(--dsw-alias-bg-layer-1);\n  overflow: hidden;\n  transition: border-color 120ms ease, transform 120ms ease, box-shadow 120ms ease;\n  /* Off-screen cards skip layout and paint; the placeholder keeps scrollbar\n   * estimation sane before the browser has measured the real height. */\n  content-visibility: auto;\n  contain-intrinsic-size: auto 240px;\n}\n\n/* The sentinel that triggers the next shelf batch: zero visual footprint. */\n.sd7ee01_cardsSentry {\n  height: 1px;\n  margin: 0;\n  padding: 0;\n}\n\n.s705cc6_showingLine {\n  margin: 0;\n  font-size: 12px;\n  letter-spacing: 0.02em;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.s65f383_card:hover {\n  border-color: color-mix(in srgb, var(--dsw-alias-brand-primary) 45%, var(--dsw-alias-border-l1));\n  transform: translateY(-1px);\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--dsw-alias-brand-primary) 12%, transparent);\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .s65f383_card { transition: none; }\n  .s65f383_card:hover { transform: none; }\n}\n\n/* The signature: a spine and cover in the category's own hue. The hues are\n * fixed mid-bright colors that read on both themes; `other` deliberately\n * stays a neutral gray so the fallback category does not compete. */\n.s4ce25d_cardSpine {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  width: 3px;\n  background: var(--spine-hue, #8B8E96);\n}\n\n.s65f383_card[data-category='tool'] { --spine-hue: #4C8DFF; }\n.s65f383_card[data-category='provider'] { --spine-hue: #A78BFA; }\n.s65f383_card[data-category='ui'] { --spine-hue: #2DD4BF; }\n.s65f383_card[data-category='workflow'] { --spine-hue: #F59E0B; }\n.s65f383_card[data-category='integration'] { --spine-hue: #34D399; }\n.s65f383_card[data-category='other'] { --spine-hue: #8B8E96; }\n\n.s9e2bec_cardCover {\n  display: block;\n  padding: 5px 12px 5px 12px;\n  border-bottom: 1px solid var(--dsw-alias-border-l1);\n  background: color-mix(in srgb, var(--spine-hue, #8B8E96) 12%, transparent);\n}\n\n.s1a7c5b_coverLabel {\n  display: block;\n  font-size: 11px;\n  font-weight: 600;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n  color: var(--spine-hue, #8B8E96);\n}\n\n.sa97234_entryHeader {\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  gap: 8px;\n  padding: 10px 12px 6px;\n  border: none;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n\n.sa97234_entryHeader:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: -2px;\n}\n\n/* The name owns the full header width; badges sit on their own line below. */\n.sc3f149_name {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 13px;\n  font-weight: 600;\n  overflow-wrap: anywhere;\n  color: var(--dsw-alias-label-primary);\n}\n\n.s513026_badges {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: 6px;\n}\n\n.s5e82cb_tierBadge {\n  padding: 1px 7px;\n  border-radius: 999px;\n  font-size: 11px;\n  line-height: 1.6;\n}\n\n.s5e82cb_tierBadge[data-tier='verified'] {\n  color: var(--dsw-alias-state-success-primary);\n  background: color-mix(in srgb, var(--dsw-alias-state-success-primary) 14%, transparent);\n  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-success-primary) 40%, transparent);\n}\n\n.s5e82cb_tierBadge[data-tier='verified-stale'] {\n  color: var(--dsw-alias-state-warn-primary);\n  background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 14%, transparent);\n  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-warn-primary) 40%, transparent);\n}\n\n.s5e82cb_tierBadge[data-tier='community'] {\n  color: var(--dsw-alias-label-secondary);\n  background: var(--dsw-alias-bg-layer-2);\n  border: 1px solid var(--dsw-alias-border-l2);\n}\n\n.s23e3e1_unclaimedBadge {\n  padding: 1px 7px;\n  border-radius: 999px;\n  border: 1px dashed var(--dsw-alias-border-l2);\n  font-size: 11px;\n  line-height: 1.6;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.s73f7fb_chevron, .s61393c_chevronOpen {\n  color: var(--dsw-alias-label-secondary);\n  transition: transform 120ms ease;\n}\n\n.s61393c_chevronOpen { transform: rotate(180deg); }\n\n@media (prefers-reduced-motion: reduce) {\n  .s73f7fb_chevron, .s61393c_chevronOpen { transition: none; }\n}\n\n.s820ebf_body {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 0 12px 12px;\n}\n\n.sb8fbc8_summary {\n  margin: 0;\n  font-size: 13px;\n  line-height: 1.5;\n  color: var(--dsw-alias-label-primary);\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.se507db_summaryZh {\n  margin: -4px 0 0;\n  font-size: 12px;\n  line-height: 1.5;\n  color: var(--dsw-alias-label-secondary);\n  display: -webkit-box;\n  -webkit-line-clamp: 1;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.s9d2029_capabilitiesBlock {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.s3bdbd5_capabilitiesNote {\n  margin: 0;\n  font-size: 11px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.s441702_capabilities {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 4px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.s441702_capabilities li {\n  padding: 1px 6px;\n  border-radius: 4px;\n  background: color-mix(in srgb, var(--dsw-alias-label-primary) 6%, transparent);\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 11px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.sde3f0c_detail {\n  border-top: 1px solid var(--dsw-alias-border-l1);\n  padding-top: 8px;\n}\n\n.se98179_detailRows {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  margin: 0;\n}\n\n.sfb4d2f_detailRow {\n  display: flex;\n  justify-content: space-between;\n  gap: 12px;\n  font-size: 12px;\n}\n\n.sfb4d2f_detailRow dt {\n  color: var(--dsw-alias-label-secondary);\n}\n\n.sfb4d2f_detailRow dd {\n  margin: 0;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  overflow-wrap: anywhere;\n  text-align: right;\n  color: var(--dsw-alias-label-primary);\n}\n\n.sd58c6d_reviewedLine {\n  margin: 8px 0 0;\n  padding: 6px 8px;\n  border-radius: 6px;\n  background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 12%, transparent);\n  font-size: 12px;\n  color: var(--dsw-alias-state-warn-primary);\n}\n\n/* Install flow. */\n.s4d374c_installPanel {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  margin-top: 2px;\n}\n\n.se7aaed_installButton, .sb43a49_confirmButton, .s6e45d1_cancelButton {\n  align-self: flex-start;\n  padding: 5px 14px;\n  border-radius: 6px;\n  font-size: 13px;\n  cursor: pointer;\n}\n\n.se7aaed_installButton {\n  border: 1px solid var(--dsw-alias-brand-primary);\n  background: var(--dsw-alias-brand-primary);\n  color: var(--dsw-alias-bg-base);\n}\n\n.se7aaed_installButton:hover {\n  background: color-mix(in srgb, var(--dsw-alias-brand-primary) 88%, var(--dsw-alias-label-primary));\n}\n\n.sb43a49_confirmButton {\n  border: 1px solid var(--dsw-alias-brand-primary);\n  background: var(--dsw-alias-brand-primary);\n  color: var(--dsw-alias-bg-base);\n}\n\n.sb43a49_confirmButton:hover {\n  background: color-mix(in srgb, var(--dsw-alias-brand-primary) 88%, var(--dsw-alias-label-primary));\n}\n\n.s6e45d1_cancelButton {\n  border: 1px solid var(--dsw-alias-border-l2);\n  background: var(--dsw-alias-bg-layer-2);\n  color: var(--dsw-alias-label-primary);\n}\n\n.s6e45d1_cancelButton:hover {\n  border-color: var(--dsw-alias-label-secondary);\n}\n\n.se7aaed_installButton:focus-visible, .sb43a49_confirmButton:focus-visible, .s6e45d1_cancelButton:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: 1px;\n}\n\n.sc4f2ac_gate {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 10px;\n  border: 1px solid var(--dsw-alias-state-warn-primary);\n  border-radius: 8px;\n  background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 8%, transparent);\n}\n\n.s559c38_gateTitle {\n  margin: 0;\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--dsw-alias-state-warn-primary);\n}\n\n.s3c0ace_gateBody {\n  margin: 0;\n  font-size: 12px;\n  line-height: 1.6;\n  color: var(--dsw-alias-label-primary);\n}\n\n.s4b2373_gateActions {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.s52b5a5_installing {\n  margin: 0;\n  font-size: 12px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.s64ab71_log {\n  max-height: 160px;\n  overflow: auto;\n  margin: 0;\n  padding: 8px;\n  border-radius: 6px;\n  background: var(--dsw-alias-bg-base);\n  border: 1px solid var(--dsw-alias-border-l1);\n  list-style: none;\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 11px;\n  line-height: 1.5;\n}\n\n.s1531a8_logLine {\n  white-space: pre-wrap;\n  word-break: break-all;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.sf20dda_notice {\n  margin: 0;\n  font-size: 12px;\n  color: var(--dsw-alias-state-success-primary);\n}\n\n.seb9b08_failedHeading {\n  margin: 0;\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--dsw-alias-state-error-primary);\n}\n\n.sfd3021_failedDetail {\n  margin: 0;\n  font-size: 12px;\n  line-height: 1.6;\n  color: var(--dsw-alias-label-primary);\n}\n\n.s50ba35_rejectedCode {\n  margin: 0;\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--dsw-alias-state-error-primary);\n}\n\n.se75489_rejectedDetail {\n  margin: 0;\n  font-size: 12px;\n  line-height: 1.6;\n  color: var(--dsw-alias-label-primary);\n}\n\n/* Installed section. */\n.sa276cf_outdatedSection {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  margin-top: 6px;\n}\n\n.sceae6e_outdatedList {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n.s8d2072_outdatedRow {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  flex-wrap: wrap;\n  padding: 10px 12px;\n  border: 1px solid var(--dsw-alias-border-l1);\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-1);\n}\n\n.s5c2545_outdatedInfo {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  min-width: 0;\n}\n\n.s5c2545_outdatedInfo strong {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 13px;\n  word-break: break-all;\n  color: var(--dsw-alias-label-primary);\n}\n\n.s877c68_outdatedVersions {\n  font-size: 12px;\n  color: var(--dsw-alias-label-secondary);\n}\n\n.sa1f556_outdatedActions {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n/* The enable/disable switch. */\n.s11c019_switch {\n  position: relative;\n  width: 32px;\n  height: 18px;\n  border: 1px solid var(--dsw-alias-border-l2);\n  border-radius: 999px;\n  background: var(--dsw-alias-bg-layer-2);\n  cursor: pointer;\n  transition: background 120ms ease, border-color 120ms ease;\n}\n\n.s7580e8_switchOn {\n  border-color: var(--dsw-alias-state-success-primary);\n  background: color-mix(in srgb, var(--dsw-alias-state-success-primary) 55%, transparent);\n}\n\n.saab2b3_switchKnob {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 12px;\n  height: 12px;\n  border-radius: 999px;\n  background: var(--dsw-alias-label-primary);\n  transition: transform 120ms ease, background 120ms ease;\n}\n\n.s7580e8_switchOn .saab2b3_switchKnob {\n  transform: translateX(14px);\n  background: var(--dsw-alias-bg-base);\n}\n\n.s11c019_switch:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: 1px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .s11c019_switch, .saab2b3_switchKnob { transition: none; }\n}\n";
 		if (typeof document !== "undefined" && !document.querySelector("style[data-plugin-css=\"e3675a89\"]")) {
 			const tag = document.createElement("style");
 			tag.dataset.pluginCss = "e3675a89";
@@ -4624,6 +4631,8 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 			"emptyLine": "s6de1ab_emptyLine",
 			"cards": "sf657f5_cards",
 			"card": "s65f383_card",
+			"cardsSentry": "sd7ee01_cardsSentry",
+			"showingLine": "s705cc6_showingLine",
 			"cardSpine": "s4ce25d_cardSpine",
 			"cardCover": "s9e2bec_cardCover",
 			"coverLabel": "s1a7c5b_coverLabel",
@@ -4694,7 +4703,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 		* (name, tier, category, unclaimed marker), the plain-text summary in both
 		* languages, the self-declared capabilities, the detail section, and the
 		* install controls. */
-		function EntryCard({ entry, t, install, installStatus }) {
+		const EntryCard = (0, react.memo)(function EntryCard({ entry, t, install, installStatus }) {
 			const [open, setOpen] = (0, react.useState)(false);
 			const detailId = (0, react.useId)();
 			const summary = entry.catalog?.summary;
@@ -4801,7 +4810,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 					})
 				]
 			});
-		}
+		});
 		/** One entry's install flow: the button, the §9.3 acknowledgement gate for
 		* community-tier entries, and the live view — running log, restart notice,
 		* failure detail, rejection detail — driven by `useInstall`. Shared by the
@@ -5035,6 +5044,10 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 			const [outdatedState, setOutdatedState] = (0, react.useState)({ kind: "loading" });
 			const [request, setRequest] = (0, react.useState)({ kind: "initial" });
 			const [query, setQuery] = (0, react.useState)("");
+			const incremental = typeof IntersectionObserver !== "undefined";
+			const [visibleCount, setVisibleCount] = (0, react.useState)(48);
+			const sentinelRef = (0, react.useRef)(null);
+			const filteredLenRef = (0, react.useRef)(0);
 			(0, react.useEffect)(() => {
 				let cancelled = false;
 				if (request.kind !== "refresh") setCatalogState((current) => current.kind === "ready" ? current : { kind: "loading" });
@@ -5083,6 +5096,22 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 					return entry.name.toLowerCase().includes(q) || summaryEn.toLowerCase().includes(q) || summaryZh.toLowerCase().includes(q);
 				});
 			}, [catalogState, query]);
+			filteredLenRef.current = filtered.length;
+			(0, react.useEffect)(() => {
+				if (!incremental) return;
+				const node = sentinelRef.current;
+				if (node === null) return;
+				const observer = new IntersectionObserver((entries) => {
+					if (entries.some((entry) => entry.isIntersecting)) setVisibleCount((current) => nextVisibleCount(current, filteredLenRef.current, 48));
+				}, { rootMargin: "0px 0px 1200px 0px" });
+				observer.observe(node);
+				return () => observer.disconnect();
+			}, [
+				incremental,
+				visibleCount,
+				filtered.length
+			]);
+			const visible = incremental ? filtered.slice(0, visibleCount) : filtered;
 			const tiers = (0, react.useMemo)(() => {
 				const map = /* @__PURE__ */ new Map();
 				if (catalogState.kind === "ready") for (const entry of catalogState.result.plugins) map.set(entry.name, entry.tier);
@@ -5136,7 +5165,10 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 							"aria-label": t("search"),
 							placeholder: t("search"),
 							value: query,
-							onChange: (event) => setQuery(event.target.value)
+							onChange: (event) => {
+								setQuery(event.target.value);
+								setVisibleCount(48);
+							}
 						}), result.stale && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: _dsh_plugin_shop_css_e3675a89_default.staleBlock,
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
@@ -5167,15 +5199,27 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 					}) : filtered.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 						className: _dsh_plugin_shop_css_e3675a89_default.emptyLine,
 						children: t("emptySearch")
-					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("ul", {
 						className: _dsh_plugin_shop_css_e3675a89_default.cards,
-						children: filtered.map((entry) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EntryCard, {
+						children: [visible.map((entry) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EntryCard, {
 							entry,
 							t,
 							install,
 							installStatus
-						}) }, entry.name))
-					}),
+						}) }, entry.name)), incremental && visibleCount < filtered.length && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
+							ref: sentinelRef,
+							className: _dsh_plugin_shop_css_e3675a89_default.cardsSentry,
+							"data-shop-sentry": true,
+							"aria-hidden": "true"
+						})]
+					}), incremental && visibleCount < filtered.length && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: _dsh_plugin_shop_css_e3675a89_default.showingLine,
+						"aria-live": "polite",
+						children: t("showing", {
+							shown: String(visibleCount),
+							total: String(filtered.length)
+						})
+					})] }),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(OutdatedSection, {
 						state: outdatedState,
 						tiers,

package/lib/types/client/locales.d.ts

@@ -33,6 +33,7 @@ export declare const zh: {
     installTransportFailed: string;
     refresh: string;
     staleLabel: string;
+    showing: string;
     version: string;
     repository: string;
     license: string;
@@ -85,6 +86,7 @@ export declare const en: {
     installTransportFailed: string;
     refresh: string;
     staleLabel: string;
+    showing: string;
     version: string;
     repository: string;
     license: string;

package/lib/types/client/present.d.ts

@@ -58,6 +58,13 @@ export type InstallEvent = {
 };
 /** §7.2 once-per-second poll cadence, as a named constant. */
 export declare const INSTALL_POLL_MS = 1000;
+/** How many shelf cards mount at a time. The shelf holds ~1900 entries; one
+ * commit of the whole grid is ~28k DOM nodes, so the list renders in batches
+ * behind a sentinel (§A1) and grows on scroll. 48 is ~3-4 rows. */
+export declare const SHOP_VISIBLE_BATCH = 48;
+/** The next number of cards to show: the current window plus one batch,
+ * clamped so the window never claims more cards than the list holds. */
+export declare function nextVisibleCount(visible: number, total: number, batch: number): number;
 /** Pure install view reducer. A `status` event only applies to the install the
  * view is tracking — a status for an install it never started (idle) is an
  * unrelated event and a no-op, like any other event it does not recognize. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-plugin-shop",
-  "version": "0.2.0",
+  "version": "0.3.1",
   "description": "The DeepSeek Harness plugin shop: browse, install, enable, and update dsh plugins from a git-auditable catalog.",
   "repository": {
     "type": "git",