@intentic/extension-ui 1.222.0 → 1.224.0

package/dist/index.js

@@ -64,6 +64,8 @@ export const StatusTally = m["StatusTally"];
 export const StepSection = m["StepSection"];
 export const TIME_WINDOWS = m["TIME_WINDOWS"];
 export const ToggleSwitch = m["ToggleSwitch"];
+export const appLink = m["appLink"];
+export const browserOwnsClick = m["browserOwnsClick"];
 export const clipboardOf = m["clipboardOf"];
 export const errorMessage = m["errorMessage"];
 export const formatBytes = m["formatBytes"];
@@ -78,6 +80,7 @@ export const freshness = m["freshness"];
 export const isRenderableImage = m["isRenderableImage"];
 export const noticeFrom = m["noticeFrom"];
 export const noticeOf = m["noticeOf"];
+export const openForwardedPort = m["openForwardedPort"];
 export const seriesColor = m["seriesColor"];
 export const sinceOf = m["sinceOf"];
 export const timeAgo = m["timeAgo"];

package/dist/types/extension-ui/src/index.d.ts

@@ -1,4 +1,4 @@
-export { AgentRunButton, type AgentRunChoice, type AgentRunPicker, type ModelPicking, useAgentRunPick, AnchoredOverlay, Avatar, BarChart, BottomSheet, BrandMark, Card, clipboardOf, ChangeStatusMark, type ChangeStatus, ui, Code, CodeField, ConfirmDialog, ContextMenu, CopyButton, StatusTally, type TallyItem, DagEditor, DagGraph, type DagEdge, type DagNode, DiffStat, FilterBar, Icon, type IconName, ImageView, InfoDialog, InfoHint, InfoTable, isRenderableImage, Markdown, MarkdownFigure, Modal, type NavGroup, NavRail, NoteEditor, type NoteDraft, type NoteDraftOptions, useNoteDraft, type NoticeModel, type NoticeTone, type NoticeAction, Notice, NoticeStack, Page, PageAction, PageHeader, ScrollFrame, PersonaFace, type PersonaLike, Picker, type PickerGroup, type PickerOption, type PickerOptions, ProgressRing, RepoRail, type RepoRailAll, type RepoRailGroup, type RepoRailRow, ProseField, ResizeSeam, ResponsiveOverlay, Row, RowGroup, SearchBar, SegmentedControl, seriesColor, sinceOf, useLoadingReveal, SkeletonRows, SplitView, StatStrip, StatusBadge, type StatusVariant, StepSection, TIME_WINDOWS, type TimeWindow, timeWindowWords, useCompact, useDevice, useListNavigation, useNow, errorMessage, noticeFrom, noticeOf, useAsyncAction, useNarrow, useRailMemory, useTheme, } from "../../ui/src/index.js";
+export { AgentRunButton, type AgentRunChoice, type AgentRunPicker, type ModelPicking, useAgentRunPick, AnchoredOverlay, Avatar, BarChart, BottomSheet, BrandMark, Card, clipboardOf, browserOwnsClick, appLink, openForwardedPort, ChangeStatusMark, type ChangeStatus, ui, Code, CodeField, ConfirmDialog, ContextMenu, CopyButton, StatusTally, type TallyItem, DagEditor, DagGraph, type DagEdge, type DagNode, DiffStat, FilterBar, Icon, type IconName, ImageView, InfoDialog, InfoHint, InfoTable, isRenderableImage, Markdown, MarkdownFigure, Modal, type NavGroup, NavRail, NoteEditor, type NoteDraft, type NoteDraftOptions, useNoteDraft, type NoticeModel, type NoticeTone, type NoticeAction, Notice, NoticeStack, Page, PageAction, PageHeader, ScrollFrame, PersonaFace, type PersonaLike, Picker, type PickerGroup, type PickerOption, type PickerOptions, ProgressRing, RepoRail, type RepoRailAll, type RepoRailGroup, type RepoRailRow, ProseField, ResizeSeam, ResponsiveOverlay, Row, RowGroup, SearchBar, SegmentedControl, seriesColor, sinceOf, useLoadingReveal, SkeletonRows, SplitView, StatStrip, StatusBadge, type StatusVariant, StepSection, TIME_WINDOWS, type TimeWindow, timeWindowWords, useCompact, useDevice, useListNavigation, useNow, errorMessage, noticeFrom, noticeOf, useAsyncAction, useNarrow, useRailMemory, useTheme, } from "../../ui/src/index.js";
 export { formatBytes, formatDate, formatDateTime, formatDayMonth, formatTime, formatTimestamp, formatTokens, formatWeekdayTime, freshness, timeAgo, } from "./format.js";
 export type { BarsFigure, BarsFigureItem, DagFigure, DagFigureEdge, DagFigureNode, Figure, FigureAccent, MermaidFigure, StatsFigure, StatsFigureItem, } from "../../ui/src/markdown/index.js";
 export { default as Button } from "primevue/button";

package/dist/types/ui/src/index.d.ts

@@ -1,4 +1,6 @@
 export { clipboardOf } from "./lib/clipboard.js";
+export { appLink, browserOwnsClick } from "./lib/link.js";
+export { openForwardedPort } from "./lib/portPreview.js";
 export { ui } from "./lib/ui.js";
 export { default as AgentRunButton } from "./components/AgentRunButton.vue";
 export { type AgentRunChoice, type AgentRunPicker, type ModelPicking, useAgentRunPick } from "./composables/useAgentRunPick.js";

package/dist/types/ui/src/lib/link.d.ts

@@ -0,0 +1,5 @@
+export declare const browserOwnsClick: (event: MouseEvent) => boolean;
+export declare const appLink: (href: string, navigate: () => void) => {
+    href: string;
+    onClick: (event: MouseEvent) => void;
+};

package/dist/types/ui/src/lib/portPreview.d.ts

@@ -0,0 +1,17 @@
+export type ProbeOutcome = "reachable" | "gaveUp" | "abandoned";
+export interface ProbeOptions {
+    readonly onWaiting?: (elapsedMs: number, slow: boolean) => void;
+    readonly stillWanted?: () => boolean;
+}
+export declare const probeUntilReachable: (url: string, options?: ProbeOptions) => Promise<ProbeOutcome>;
+export interface ForwardedPortTab {
+    readonly port: number;
+    readonly path?: string;
+    readonly forward: (port: number) => Promise<string | undefined>;
+    readonly onError?: (message: string) => void;
+}
+export declare const openForwardedPort: ({ port, path, forward, onError }: ForwardedPortTab) => void;
+export declare const parseLoopbackLink: (uri: string) => {
+    port: number;
+    path: string;
+} | undefined;

package/names.mjs

@@ -13,6 +13,8 @@ export const extensionUiNames = [
     "ChangeStatusMark",
     "Checkbox",
     "clipboardOf",
+    "browserOwnsClick",
+    "appLink",
     "ui",
     "Code",
     "CodeField",
@@ -48,6 +50,7 @@ export const extensionUiNames = [
     "noticeFrom",
     "noticeOf",
     "NoticeStack",
+    "openForwardedPort",
     "Page",
     "PageAction",
     "PageHeader",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@intentic/extension-ui",
-  "version": "1.222.0",
+  "version": "1.224.0",
   "description": "The UI kit intentic extensions render with — host-provided at runtime (the app's own components via the import map), so extension UI is always native to the shell",
   "license": "MIT",
   "type": "module",

package/src/format.ts

@@ -8,7 +8,7 @@
  *
  * A SOURCE-level door, for in-repo extensions (whose code vite compiles into the app bundle) and their tests.
  * A git-installed bundle resolves its bare specifiers through the import map in index.html, which carries the
- * barrel alone — so nothing is exported here that the barrel does not also export, and a third-party author
+ * barrel alone, so nothing is exported here that the barrel does not also export, and a third-party author
  * reaching for `@intentic/extension-ui` is missing none of it. */
 export {
     formatBytes,

package/src/index.ts

@@ -1,6 +1,6 @@
 /* The UI kit extensions render with. This entrypoint is the package's ONE public surface (the repo's
  * re-export exception): a curated slice of the app design system (@intentic/ui) plus the PrimeVue
- * primitives extension views actually use. At runtime the kit is HOST-PROVIDED — the web app maps this module
+ * primitives extension views actually use. At runtime the kit is HOST-PROVIDED, the web app maps this module
  * into its import map (extension-host/hostModules.ts), so third-party bundles marking it external get the
  * shell's own component instances and theming; in-repo builtin extension packages bundle this same module and
  * land on the same instances. Export names are mirrored in ../names.mjs (shim generation + drift assertion).
@@ -14,8 +14,8 @@
  * <SplitView> is here for exactly the same reason one level up: five screens are an index beside a body, and the
  * one implementation that had solved it (HubLayout) sat in the web app where no extension could import it. */
 export {
-    /* <AgentRunButton> and its state ship because FOUR extensions start an agent for the user — pipelines,
-     * deployments, maintenance, acceptance — and each of them had reached a different answer about how you
+    /* <AgentRunButton> and its state ship because FOUR extensions start an agent for the user, pipelines,
+     * deployments, maintenance, acceptance, and each of them had reached a different answer about how you
      * choose what it spends: three had no control at all and named the model in a tooltip, the fourth grew a
      * chip of its own. That is the same divergence <SplitView> and <Row> were shipped to end, arriving on the
      * one control in the app where getting it wrong costs money rather than pixels. `useAgentRunPick` is the
@@ -27,14 +27,14 @@ export {
     useAgentRunPick,
     /* <AnchoredOverlay> ships because the alternative on this surface is PrimeVue's <Popover>, and six extension
      * views had already reached for it. Popover measures and dismisses against the OPENER's window, so in a
-     * popped-out panel it opens off the bottom edge, over its own trigger, and cannot be clicked shut — the
+     * popped-out panel it opens off the bottom edge, over its own trigger, and cannot be clicked shut, the
      * failure the kit's own tooltip directive exists to avoid. */
     AnchoredOverlay,
     Avatar,
     BarChart,
     BottomSheet,
     /* <BrandMark> ships because the drafts queue is the second surface to draw a platform as its brand (the
-     * capability cards were the first) — and because its fallback is the part a hand-roll skips: a platform
+     * capability cards were the first), and because its fallback is the part a hand-roll skips: a platform
      * with no installed connector still has to render as SOMETHING, and the monogram is that something. */
     BrandMark,
     Card,
@@ -43,10 +43,22 @@ export {
      * the module-global navigator belongs to the opener, whose document isn't focused, so the write rejects
      * and every call site swallows it. */
     clipboardOf,
+    /* `browserOwnsClick` ships because every extension view that navigates has the same one-line decision to
+       make and no way to reach the app's answer: a row that is BOTH a link and a control must let a Ctrl/⌘,
+       Shift or Alt click belong to the browser, and do its own work only on the plain one. Three views had
+       hand-rolled a navigate() on a <button>, which is the version of that decision where the modifier keys
+       simply do not work. */
+    browserOwnsClick,
+    appLink,
+    /* `openForwardedPort` ships because the Ports view is the third surface to wait on a freshly-minted preview
+     * hostname and the second to open one in a tab, and the two that had solved it (the preview panel's iframe
+     * gate, the terminal's Ctrl+click) both sat in the web app where no extension could import them. The
+     * duplicate was word-for-word, down to the sentence a user reads while DNS propagates. */
+    openForwardedPort,
     /* The two halves of a changed-file row ship together because they are always drawn together, and they ship
      * at all for the reason <SplitView> did: the git-history extension is the seventh surface to draw one, and
      * the six that had solved it all sat in the web app where no extension could import them. <ChangeStatusMark>
-     * carries the fixed-width cell that keeps a column of paths aligned whatever letter lands in it — the detail
+     * carries the fixed-width cell that keeps a column of paths aligned whatever letter lands in it, the detail
      * a hand-rolled copy gets subtly wrong. */
     ChangeStatusMark,
     type ChangeStatus,
@@ -72,7 +84,7 @@ export {
     ImageView,
     /* <InfoDialog> and <InfoTable> ship beside <ConfirmDialog> and <Row> for the reason everything else here
      * does: an extension with something to EXPLAIN rather than confirm, or a block of label→value facts to lay
-     * out, would otherwise hand-roll a dialog shell and a two-column grid — and the grid is where a hand-roll
+     * out, would otherwise hand-roll a dialog shell and a two-column grid, and the grid is where a hand-roll
      * drifts, because keeping the value column aligned across rows is the whole of it. */
     InfoDialog,
     InfoHint,
@@ -82,13 +94,13 @@ export {
     MarkdownFigure,
     /* <Modal> ships for the reason <ConfirmDialog> and <InfoDialog> already do, and it is the one they were
      * both missing: an extension whose dialog is neither a confirm nor an explainer had nothing to reach for
-     * but PrimeVue's Dialog and a width typed into a style attribute — which is exactly how the app itself
+     * but PrimeVue's Dialog and a width typed into a style attribute, which is exactly how the app itself
      * ended up with thirteen widths and one viewport clamp between seventeen dialogs. */
     Modal,
     type NavGroup,
     NavRail,
     /* <NoteEditor> and `useNoteDraft` ship because TWO extensions are a pane that reads a markdown file, lets
-     * somebody correct it and lets them delete it — knowledge and memory — and they had built the same thing
+     * somebody correct it and lets them delete it, knowledge and memory, and they had built the same thing
      * twice: the same Copy/Edit/Delete cluster, the same Cancel/Save pair, the same in-place confirmation, the
      * same draft-or-file binding, the same read-and-write-on-one-surface rule. They had already drifted in the
      * ways a second copy does: one cleared its confirmation when a write failed and the other did not, and
@@ -103,11 +115,11 @@ export {
      * with several async actions needs somewhere for their failures to land that isn't one action's own row,
      * and a hand-rolled error strip is the first thing to disagree with the app's about tone and dismissal.
      *
-     * <Notice> — THE SINGLE ONE — was missing from that shipment, and it is the same mistake <Row>/<RowGroup>
+     * <Notice>. THE SINGLE ONE, was missing from that shipment, and it is the same mistake <Row>/<RowGroup>
      * and <PageAction>/<PageHeader> each record one release earlier: the container went out without the thing
      * that goes in it. Notice.vue's own comment says every view that hand-rolled `ui.alertDanger()` around an
      * interpolated error string renders it instead, "which is what makes the app's failures sound like one
-     * product rather than like sixty throw sites" — and the app took that sweep, 107 call sites of it. The
+     * product rather than like sixty throw sites", and the app took that sweep, 107 call sites of it. The
      * extensions could not: the kit handed out the stack and kept the row, so thirteen of them went on
      * hand-rolling the strip. Most of a view's failures are ONE at a time; the stack is the rarer case. */
     type NoticeModel,
@@ -123,7 +135,7 @@ export {
     PageHeader,
     ScrollFrame,
     /* <PersonaFace> ships because the TWO surfaces in the whole app where you choose a persona are both out
-     * here — an automation's "Runs as" and a workflow step's "Acts as" — and neither could reach the drawing
+     * here, an automation's "Runs as" and a workflow step's "Acts as", and neither could reach the drawing
      * every surface that merely LISTS a persona already uses. So the one screen where you are picking a person
      * by sight was the one screen showing a line of text. It is exported alongside <Picker>'s own `face` option
      * field, which is what most callers actually want: hand the row a persona and the picker draws it. */
@@ -135,7 +147,7 @@ export {
     type PickerOptions,
     ProgressRing,
     /* <RepoRail> ships for the reason <SplitView> did, one level in: two extensions scope a workspace-wide
-     * board to one repository — maintenance and pipelines — and both had written the same column. Same pinned
+     * board to one repository, maintenance and pipelines, and both had written the same column. Same pinned
      * "All repositories" row outside every group, same one-number-per-row rule with the second fact as its
      * colour, same swap to a <Picker> at the width the split folds at. What differs between them is the report
      * behind it, which is why the rows arrive as data. */
@@ -144,7 +156,7 @@ export {
     type RepoRailGroup,
     type RepoRailRow,
     /* The writing field and the drag seam ship for the same reason <SplitView> did: an extension view that
-     * wants prose typeset as a document, or a pane the reader can size, would otherwise hand-roll one — and
+     * wants prose typeset as a document, or a pane the reader can size, would otherwise hand-roll one, and
      * both recipes have a failure mode (a replica that disagrees with its field; a drag bound to the window)
      * that is invisible until it is in front of somebody. */
     ProseField,
@@ -166,7 +178,7 @@ export {
     useLoadingReveal,
     /* <SkeletonRows> ships beside <RowGroup> for the third time this file makes the argument: the container
      * without the WAIT is what made three extensions write their own. Pipelines, deployments and maintenance
-     * each hand-rolled a placeholder board, and the row-shaped half of all three is this component — same
+     * each hand-rolled a placeholder board, and the row-shaped half of all three is this component, same
      * bars, same widths walked in order, same `aria-hidden` under the caller's one status region. What they
      * could not get right by hand is the part that does not show up in a screenshot: a bar is thinner than the
      * text it replaces, so an outline built out of divs is shorter than the list that lands and the page jumps
@@ -190,24 +202,24 @@ export {
      * hand-roll leaves out (wrapping at the ends, keeping the active row in view) are invisible on a mouse. */
     useListNavigation,
     /* <useNow> and <useAsyncAction> ship because the drafts queue was the first extension with a live countdown
-     * and a page of mutations — the two shapes every such view hand-rolls, one interval and one busy flag at a
+     * and a page of mutations, the two shapes every such view hand-rolls, one interval and one busy flag at a
      * time, each subtly wrong (a clock that keeps ticking with nothing on screen; a double-click firing twice). */
     useNow,
     errorMessage,
     noticeFrom,
     noticeOf,
     useAsyncAction,
-    /* "Is my own element too narrow for this layout" — the question every extension view actually means, since it
+    /* "Is my own element too narrow for this layout", the question every extension view actually means, since it
      * renders into a pane the reader can drag to half its width, not into the window. */
     useNarrow,
     /* Where the reader left a narrowing rail. Ships for the reason <SplitView> did: three extension views grew
      * the same index column, all three keep the pick in the URL, and all three lost it the moment you clicked the
-     * tile again — because a tile opens a view at its bare address. Solving that per extension would be three
+     * tile again, because a tile opens a view at its bare address. Solving that per extension would be three
      * copies of one rule about what a link means versus what a memory is allowed to guess. */
     useRailMemory,
     useTheme,
 } from "@intentic/ui";
-// Also reachable as `@intentic/extension-ui/format` — see the note there for why an extension's pure logic
+// Also reachable as `@intentic/extension-ui/format`, see the note there for why an extension's pure logic
 // wants them without the components attached.
 export {
     formatBytes,
@@ -221,7 +233,7 @@ export {
     freshness,
     timeAgo,
 } from "./format.js";
-/* The figure vocabulary that <Markdown> renders from prose and <MarkdownFigure> renders from data. Types only —
+/* The figure vocabulary that <Markdown> renders from prose and <MarkdownFigure> renders from data. Types only,
  * an extension needs them to BUILD a figure out of facts it already holds (a dependency graph, a staleness
  * tally) rather than round-tripping through markdown to draw one. The parser and the document splitter stay out
  * of the kit: they are the prose surface's job, and <Markdown> already does it. */
@@ -243,7 +255,7 @@ export type {
  * different padding beside `ui.input`. Those two are gone — <Picker> and `ui.input()` are the spellings.
  * <Dialog> was the third, and it is gone for the same reason: it stayed "until the kit has a general dialog
  * shell", six extension views took it, and every one of them typed its own width into a style attribute with
- * no viewport clamp — the exact spread that <Modal> above now exists to end. The shell is here, so the raw one
+ * no viewport clamp, the exact spread that <Modal> above now exists to end. The shell is here, so the raw one
  * is not. <Popover> stays only because <ResponsiveOverlay>/<AnchoredOverlay> do not yet cover every menu shape,
  * and it is on the same clock: those two are the ones that open in the right window when a panel is popped out. */
 export { default as Button } from "primevue/button";