@contractkit/explorer-ui - npm Package Compare versions

Comparing version 0.1.0 to 0.2.0

dist/assets/style.css

@@ -176,2 +176,66 @@ /* ContractKit Explorer UI — default theme.
 .ce-hint { color: var(--ce-fg-muted); font-style: italic; }
+
+.ce-overview-endpoints-section { margin: 20px 0; }
+.ce-overview-area {
+    border: 1px solid var(--ce-border);
+    border-radius: 6px;
+    margin-bottom: 8px;
+    background: var(--ce-card-bg);
+}
+.ce-overview-area > summary {
+    cursor: pointer;
+    padding: 8px 12px;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font-weight: 600;
+    user-select: none;
+    list-style: none;
+}
+.ce-overview-area > summary::-webkit-details-marker { display: none; }
+.ce-overview-area > summary::before {
+    content: '▸';
+    display: inline-block;
+    width: 12px;
+    color: var(--ce-fg-muted);
+    transition: transform 0.15s ease;
+}
+.ce-overview-area[open] > summary::before { transform: rotate(90deg); }
+.ce-overview-area-name { flex: 1; }
+.ce-overview-area-count {
+    font-family: var(--ce-mono);
+    font-size: 12px;
+    font-weight: 500;
+    color: var(--ce-fg-muted);
+    background: var(--ce-code-bg);
+    padding: 1px 8px;
+    border-radius: 10px;
+}
+.ce-overview-endpoints {
+    list-style: none;
+    margin: 0;
+    padding: 0 0 6px;
+}
+.ce-overview-endpoint {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 4px 12px 4px 32px;
+    text-decoration: none;
+    color: inherit;
+    font-size: 13px;
+}
+.ce-overview-endpoint:hover { background: var(--ce-code-bg); }
+.ce-overview-endpoint-path {
+    font-family: var(--ce-mono);
+    font-size: 13px;
+}
+.ce-overview-endpoint-name {
+    color: var(--ce-fg-muted);
+    font-size: 13px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    min-width: 0;
+}
 .ce-missing { border-color: var(--ce-warning-border); }
@@ -178,0 +242,0 @@ .ce-section { margin-bottom: 32px; }

dist/index.js

@@ -1300,2 +1300,3 @@ var __defProp = Object.defineProperty;
     </dl>`;
+  const endpoints = renderEndpointsByArea(data);
   return html`<section id="overview" class="ce-section ce-overview">
@@ -1306,2 +1307,3 @@ <h1>${configMeta.title}</h1>
         ${raw(stats)}
+        ${raw(endpoints)}
         ${raw(servers)}
@@ -1312,2 +1314,29 @@ <p class="ce-hint">Pick an endpoint or model from the API Explorer in the sidebar to see details.</p>
 __name(renderOverviewPage, "renderOverviewPage");
+function renderEndpointsByArea(data) {
+  if (data.operations.length === 0) return "";
+  const byArea = /* @__PURE__ */ new Map();
+  for (const op of data.operations) {
+    const key = op.fileGroup;
+    const list = byArea.get(key);
+    if (list) list.push(op);
+    else byArea.set(key, [
+      op
+    ]);
+  }
+  const sortedAreas = [
+    ...byArea.keys()
+  ].sort((a, b) => a.localeCompare(b));
+  const openByDefault = sortedAreas.length <= 3;
+  const sections = sortedAreas.map((area) => {
+    const ops = byArea.get(area);
+    const rows = ops.map((op) => {
+      const name = op.op.name?.trim();
+      const nameHtml = name ? `<span class="ce-overview-endpoint-name">${escapeHtml(name)}</span>` : "";
+      return `<li><a class="ce-overview-endpoint" href="#${escapeHtml(operationAnchor(op))}" data-open-operation="${escapeHtml(operationAnchor(op))}"><span class="ce-method ce-method-${escapeHtml(op.method)}">${escapeHtml(op.method.toUpperCase())}</span><code class="ce-overview-endpoint-path">${escapeHtml(op.routePath)}</code>` + nameHtml + `</a></li>`;
+    }).join("");
+    return `<details class="ce-overview-area"${openByDefault ? " open" : ""}><summary><span class="ce-overview-area-name">${escapeHtml(area)}</span><span class="ce-overview-area-count">${ops.length}</span></summary><ul class="ce-overview-endpoints">${rows}</ul></details>`;
+  }).join("");
+  return `<section class="ce-subsection ce-overview-endpoints-section"><h3>Endpoints by area</h3>${sections}</section>`;
+}
+__name(renderEndpointsByArea, "renderEndpointsByArea");
 function renderServersList(servers) {
@@ -1314,0 +1343,0 @@ if (!servers || servers.length === 0) return "";

dist/render-item.d.ts

@@ -16,2 +16,7 @@ import { operationAnchor } from './render-operation.js';
 };
+/** Options for {@link renderItemPage}. */
+export interface RenderItemOptions {
+    /** Base URL surfaced to the operation's Try-it form. Pass an empty string to render the form with no default; omit to hide the form. */
+    tryItBaseUrl?: string;
+}
 /**
@@ -22,8 +27,8 @@ * Renders a single-item detail page intended for a focused webview. Wraps `renderOperation` /
  * native tree view).
+ *
+ * The Overview block now includes a collapsible "Endpoints by area" list grouping operations
+ * by their `fileGroup` — each row links to the operation's detail panel via a
+ * `data-open-operation="<anchor>"` attribute that webview consumers handle as an
+ * `openOperation` message.
  */
-/** Options for {@link renderItemPage}. */
-export interface RenderItemOptions {
-    /** Base URL surfaced to the operation's Try-it form. Pass an empty string to render the form with no default; omit to hide the form. */
-    tryItBaseUrl?: string;
-}
 export declare function renderItemPage(data: PreviewData, selection: ItemSelection, options?: RenderItemOptions): string;
@@ -30,0 +35,0 @@ /** Stable ids used by tree-view consumers to refer to operations and models. */

dist/render-item.d.ts.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"render-item.d.ts","sourceRoot":"","sources":["../src/render-item.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAmB,MAAM,uBAAuB,CAAC;AAEzE,OAAO,KAAK,EAAE,WAAW,EAAgC,aAAa,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAE9G,gFAAgF;AAChF,MAAM,MAAM,aAAa,GACnB;IAAE,IAAI,EAAE,WAAW,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,GACjC;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,GAC/B;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,GACpB;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAErC;;;;;GAKG;AACH,0CAA0C;AAC1C,MAAM,WAAW,iBAAiB;IAC9B,wIAAwI;IACxI,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,aAAa,EAAE,OAAO,GAAE,iBAAsB,GAAG,MAAM,CAGnH;AAmGD,gFAAgF;AAChF,eAAO,MAAM,WAAW,wBAAkB,CAAC;AAC3C,eAAO,MAAM,OAAO,GAAI,MAAM,MAAM,KAAG,MAA2B,CAAC;AAEnE;;;GAGG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,WAAW,GAAG,KAAK,CAClD;IAAE,IAAI,EAAE,WAAW,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,iBAAiB,CAAA;CAAE,GAC/D;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,aAAa,CAAA;CAAE,CAC1D,CAKA"}
+{"version":3,"file":"render-item.d.ts","sourceRoot":"","sources":["../src/render-item.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAmB,MAAM,uBAAuB,CAAC;AAEzE,OAAO,KAAK,EAAE,WAAW,EAAgC,aAAa,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAE9G,gFAAgF;AAChF,MAAM,MAAM,aAAa,GACnB;IAAE,IAAI,EAAE,WAAW,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,GACjC;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,GAC/B;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,GACpB;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAErC,0CAA0C;AAC1C,MAAM,WAAW,iBAAiB;IAC9B,wIAAwI;IACxI,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,aAAa,EAAE,OAAO,GAAE,iBAAsB,GAAG,MAAM,CAGnH;AAoJD,gFAAgF;AAChF,eAAO,MAAM,WAAW,wBAAkB,CAAC;AAC3C,eAAO,MAAM,OAAO,GAAI,MAAM,MAAM,KAAG,MAA2B,CAAC;AAEnE;;;GAGG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,WAAW,GAAG,KAAK,CAClD;IAAE,IAAI,EAAE,WAAW,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,iBAAiB,CAAA;CAAE,GAC/D;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,aAAa,CAAA;CAAE,CAC1D,CAKA"}

package.json

 {
   "name": "@contractkit/explorer-ui",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "ContractKit API explorer renderer — pure HTML output, themable via CSS custom properties",
@@ -5,0 +5,0 @@ "author": {

README.md

@@ -121,2 +121,3 @@ # @contractkit/explorer-ui
 | `[data-open-model]` | Navigate the detail view to that model's dedicated page |
+| `[data-open-operation]` | Post `{type:'openOperation', id}` — used by the overview's "Endpoints by area" list to open an operation in its own panel |
 | `[data-jump-file] / [data-jump-line]` | Post `{type:'reveal', file, line}` to the host (in VS Code, opens the source) |
@@ -123,0 +124,0 @@ | `a.ce-ref` | Fallback for unresolved refs — host navigates to the dedicated page |

No alert changes

Improved metrics

Total package byte prevSize

232662

3.29%

Lines of code

2514

4.1%

Number of lines in readme file

132

0.76%

No dependency changes