@jini-ai/ui 0.4.7 → 0.4.8

package/dist/features/panel-kit/helpers/standing-draft-recovery-message.js

@@ -1,10 +1,17 @@
+import { formatTimestamp } from "./format-timestamp.js";
+/** The viewer's wall-clock time of the capture, `YYYY-MM-DD HH:MM`. The raw ISO string read as
+ *  "from 2026-10-11T19:26:00.665Z" in the restore banner (2026-10-11): UTC and milliseconds the
+ *  operator never thinks in. The draft was captured in this browser, so local time is the honest one. */
+function formatSavedAtLocal(iso) {
+    return formatTimestamp({ iso }, { timeZone: "local" });
+}
 /** Compare timestamps explicitly; restoration only changes the working copy, never the server. */
-export function standingDraftRecoveryMessage({ draft, t, serverUpdatedAt }, _options = {}) {
+export function standingDraftRecoveryMessage({ draft, t, serverUpdatedAt }, { formatSavedAt = formatSavedAtLocal } = {}) {
     const captured = Date.parse(draft.savedAt);
     const server = Date.parse(serverUpdatedAt ?? draft.serverUpdatedAt ?? "");
     const comparison = server > captured ? "Server content is newer."
         : server < captured ? "Local changes are newer."
             : server === captured ? "Both copies have the same timestamp." : "";
-    return `${t("Restore unsaved changes from")} ${draft.savedAt}${comparison ? ` · ${t(comparison)}` : ""}`;
+    return `${t("Restore unsaved changes from")} ${formatSavedAt(draft.savedAt)}${comparison ? ` · ${t(comparison)}` : ""}`;
 }
 //# sourceMappingURL=standing-draft-recovery-message.js.map

package/dist/features/settings/dialog/styles/settings-dialog.css

@@ -95,6 +95,8 @@
 }
 
 .jini-input {
+  min-height: var(--jini-control-h, 37px);
+  box-sizing: border-box;
   width: 100%;
   min-width: 0;
   padding: 8px 10px;
@@ -107,6 +109,17 @@
   transition: border-color 120ms var(--jini-ease-out), box-shadow 120ms var(--jini-ease-out);
 }
 
+/* Native selects share one affordance across execution settings and host forms. */
+select.jini-input {
+  appearance: none;
+  padding-right: 2rem;
+  cursor: pointer;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%236b7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 0.7rem center;
+  background-size: 10px 6px;
+}
+
 .jini-input:focus {
   outline: none;
   border-color: var(--jini-accent);
@@ -127,6 +140,8 @@
 .jini-settings-section .jini-btn,
 .jini-settings-section .jini-button,
 .jini-settings-section a.jini-button {
+  min-height: var(--jini-control-h, 37px);
+  box-sizing: border-box;
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -394,6 +409,21 @@
 
    `align-items: start` so a field with a two-line hint (an invalid base URL) does not stretch its
    neighbour's input to match. */
+/* `ByokProviderForm`'s `collapseAdvanced`: Base URL + Max tokens behind one disclosure after Model. */
+.jini-byok-advanced > summary {
+  cursor: pointer;
+  width: max-content;
+  font-size: 12px;
+  font-weight: 600;
+  color: var(--jini-text-muted);
+}
+.jini-byok-advanced > summary:hover { color: var(--jini-text-strong); }
+.jini-byok-advanced[open] > summary { margin-bottom: 12px; }
+
+/* `ByokProviderForm`'s `apiKeyActions`: the host's button row directly under the key input (Show
+   stays on the input's line). Wraps on a narrow card. */
+.jini-byok-key-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 2px; }
+
 .jini-byok-field-row {
   display: flex;
   flex-wrap: wrap;
@@ -479,13 +509,25 @@
 
 /* Agent cards. The origin drew a responsive grid of selectable vendor cards;
    `auto-fill` keeps it one column inside a narrow settings panel and two or
-   more when the host gives the dialog room. */
+   more when the host gives the dialog room.
+
+   Settings grow inside the selected card's own column; top alignment keeps
+   its neighbour at its normal height. */
 .jini-agent-grid {
   display: grid;
+  align-items: start;
   grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
   gap: 10px;
 }
 
+/* "Show N not installed" — the uninstalled tail of the grid sits behind this toggle. */
+.jini-local-cli-more {
+  display: block;
+  width: auto;
+  align-self: flex-start;
+  margin: 10px 0;
+}
+
 .jini-agent-card {
   display: flex;
   flex-direction: column;
@@ -500,6 +542,7 @@
 }
 
 .jini-agent-card.is-selected {
+  grid-column: span 1;
   border-color: var(--jini-accent);
   box-shadow: 0 0 0 1px var(--jini-accent);
 }
@@ -532,30 +575,26 @@
 
 /* The whole card is the click target, not just the text at the top of it.
  *
- * `.jini-agent-grid` is a grid, so selecting one CLI stretches every card in
- * that row to match the expanded one — while `-select` keeps its natural
- * content height. The space the row-mate's expansion added was therefore
- * inert: clicking the lower two-thirds of a stretched-but-unselected card did
- * nothing, which reads as a broken card rather than as "aim higher".
+ * The select button owns the whole header, including its padding, when no
+ * other controls need that space.
  *
  * `:last-child` is load-bearing. A card renders its diagnostics, model config,
  * test result and path-repair actions as SIBLINGS after `-main`, and those
  * blocks contain their own buttons; growing `-main` unconditionally would push
  * them to the card's bottom edge, and a full-card overlay would swallow their
  * clicks outright. `-main:last-child` is true exactly when nothing rendered
- * after it — the unselected, no-diagnostics case this bug is about.
+ * after it — the no-diagnostics case this bug is about.
  *
- * `:not(.is-selected)` guards the padding move specifically: a SELECTED card
- * can render its Test button inside `-main`, and zeroing the padding there
- * would shove that button flush against the card edge. */
-.jini-agent-card:not(.is-selected) .jini-agent-card-main:last-child {
+ * Test stays in the selected card's header; settings follow `-main`, keeping
+ * both their controls and the header's Test button independently clickable. */
+.jini-agent-card .jini-agent-card-main:last-child {
   flex: 1 1 auto;
   /* Handed to the button below — left here it would ring the card in 12px of
      unclickable margin, a smaller version of the same bug. */
   padding: 0;
 }
 
-.jini-agent-card:not(.is-selected) .jini-agent-card-main:last-child > .jini-agent-card-select {
+.jini-agent-card .jini-agent-card-main:last-child > .jini-agent-card-select {
   /* The row is `align-items: flex-start` so the Test button never stretches;
      this opts the select button alone into filling the card. Its own
      `align-items: flex-start` keeps icon and text at the top — only the hit
@@ -605,15 +644,15 @@
   color: var(--jini-text);
 }
 
-.jini-agent-card-name-divider {
-  color: var(--jini-text-disabled);
-}
-
 .jini-agent-card-tagline {
   font-size: 12px;
   color: var(--jini-text-muted);
 }
 
+.jini-agent-card.is-selected .jini-agent-card-tagline:not(:empty)::before {
+  content: '·\00a0';
+}
+
 .jini-agent-card-badges {
   display: flex;
   flex-wrap: wrap;
@@ -657,14 +696,98 @@
   opacity: 0.7;
 }
 
-.jini-agent-card-config {
+/* Selection reads as the accent ring plus this check, never as a bigger card. */
+.jini-agent-card-check {
+  flex: 0 0 auto;
+  display: grid;
+  place-items: center;
+  width: 18px;
+  height: 18px;
+  margin-left: auto;
+  border-radius: 50%;
+  background: var(--jini-accent);
+  color: var(--jini-accent-ink);
+  font-size: 11px;
+  font-weight: 700;
+  line-height: 1;
+}
+
+/* Settings stay inside the selected card, with each label above its control
+   and the model's provenance sentence visible below the picker. */
+.jini-agent-settings {
   display: flex;
   flex-direction: column;
-  gap: 4px;
-  padding: 0 12px 12px;
+  gap: 8px;
+  padding: 10px 12px;
   border-top: 1px solid var(--jini-border);
-  margin-top: 2px;
-  padding-top: 10px;
+}
+
+.jini-agent-settings-row,
+.jini-agent-settings-tail {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  gap: 8px 16px;
+}
+
+.jini-agent-settings-tail {
+  gap: 8px 10px;
+}
+
+/* Wide enough for "Testing…", so starting a test never reflows its controls. */
+.jini-agent-settings-tail > .jini-agent-card-test {
+  min-width: 5.5rem;
+}
+
+.jini-agent-settings-field {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  gap: 4px;
+  min-width: 0;
+}
+
+.jini-agent-settings-label {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+
+.jini-agent-settings-field > .jini-field-label {
+  white-space: nowrap;
+}
+
+.jini-agent-settings .jini-searchable-select,
+.jini-agent-settings select.jini-input,
+.jini-agent-settings .jini-agent-settings-custom {
+  width: 100%;
+  min-width: 0;
+  max-width: none;
+}
+
+.jini-agent-settings-source {
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+}
+
+.jini-agent-settings-source > .jini-agent-model-source {
+  margin-left: 0;
+  white-space: nowrap;
+}
+
+.jini-agent-settings .jini-agent-card-test-result {
+  padding: 0;
+}
+
+.jini-agent-settings .jini-agent-card-path-repair {
+  margin: 0;
+}
+
+.jini-agent-settings .jini-agent-cli-env {
+  margin: 0;
+  padding-top: 8px;
 }
 
 /* The source badge is load-bearing, not decoration: a built-in list can be
@@ -895,7 +1018,21 @@
   width: 100%;
 }
 
+/* Hosts may pass the input class to the wrapper; only the trigger paints the control. */
+.jini-select.jini-input {
+  padding: 0;
+  border: 0;
+  background: none;
+  box-shadow: none;
+  min-height: 0;
+}
+.jini-select.is-missing > .jini-select-trigger {
+  border-color: color-mix(in srgb, var(--jini-danger) 55%, var(--jini-border));
+}
+
 .jini-select-trigger {
+  min-height: var(--jini-control-h, 37px);
+  box-sizing: border-box;
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -912,6 +1049,17 @@
   cursor: pointer;
 }
 
+.jini-select-trigger:focus-visible {
+  outline: none;
+  border-color: var(--jini-accent);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--jini-accent) 18%, transparent);
+}
+
+@media (max-width: 640px) {
+  .jini-input,
+  .jini-select-trigger { font-size: 16px; min-height: 40px; }
+}
+
 .jini-select-trigger:hover:not(:disabled) {
   border-color: var(--jini-border-strong);
 }

package/dist/features/tabbed-dialog/styles/tabbed-dialog.css

@@ -35,6 +35,10 @@
   border-radius: var(--jini-radius-lg);
   box-shadow: var(--jini-shadow-lg);
   overflow: hidden;
+  /* Layout follows the dialog's OWN width, not the viewport's: an inline settings page beside an
+     expanded nav and an open assistant dock is narrow on a wide screen, and a 375px modal is narrow
+     on any screen. See the `@container jini-tabbed-dialog` block at the end. */
+  container: jini-tabbed-dialog / inline-size;
 }
 
 /* Page (non-modal) variant: the shell renders without `onClose`, so it should
@@ -271,3 +275,90 @@
 .jini-tabbed-dialog-sidebar-toggle:focus-visible {
   opacity: 1;
 }
+
+/* ============================================================
+   Narrow dialog: the side nav becomes one top tab row
+   ============================================================
+   A 240px side nav inside a ~500px dialog left the form a thin column with
+   its controls spilling past the edge (Chat settings at 500px, Chrome check
+   2026-10-11). Below 600px of DIALOG width (a 40rem dialog, e.g. Sites
+   settings, keeps its desktop look) the nav turns into a horizontal,
+   swipeable tab row over a full-width panel. The collapse chevron has
+   nothing to reclaim there, so it hides, and a collapsed nav reappears as
+   the row: a narrow dialog never loses its tabs. Modal-only spacing skips
+   the inline (page) variant, whose host owns its page insets. */
+@container jini-tabbed-dialog (max-width: 600px) {
+  .jini-tabbed-dialog:not(.jini-tabbed-dialog--inline) .jini-tabbed-dialog-head {
+    padding: 20px 56px 8px 16px;
+  }
+
+  .jini-tabbed-dialog:not(.jini-tabbed-dialog--inline) .jini-tabbed-dialog-chrome {
+    top: 16px;
+    right: 16px;
+  }
+
+  .jini-tabbed-dialog:not(.jini-tabbed-dialog--inline) .jini-tabbed-dialog-head-line h2,
+  .jini-tabbed-dialog:not(.jini-tabbed-dialog--inline) .jini-tabbed-dialog-head h2 {
+    font-size: 22px;
+  }
+
+  .jini-tabbed-dialog-body,
+  .jini-tabbed-dialog-sidebar-collapsed .jini-tabbed-dialog-body {
+    grid-template-columns: minmax(0, 1fr);
+    grid-template-rows: auto minmax(0, 1fr);
+  }
+
+  .jini-tabbed-dialog-sidebar,
+  .jini-tabbed-dialog-sidebar-collapsed .jini-tabbed-dialog-sidebar {
+    display: flex;
+    flex-direction: row;
+    gap: 2px;
+    padding: 0 16px;
+    background: transparent;
+    border-right: 0;
+    box-shadow: inset 0 -1px 0 var(--jini-border);
+    overflow-x: auto;
+    overflow-y: hidden;
+    overscroll-behavior-x: contain;
+    scrollbar-width: none;
+  }
+
+  .jini-tabbed-dialog-sidebar::-webkit-scrollbar {
+    display: none;
+  }
+
+  .jini-tabbed-dialog-nav-item {
+    flex: 0 0 auto;
+    width: auto;
+    grid-template-columns: auto auto;
+    gap: 6px;
+    padding: 9px 10px;
+    border: 0;
+    border-bottom: 2px solid transparent;
+    border-radius: 0;
+    white-space: nowrap;
+  }
+
+  .jini-tabbed-dialog-nav-item:hover {
+    background: transparent;
+    color: var(--jini-text);
+  }
+
+  .jini-tabbed-dialog-nav-item.active,
+  .jini-tabbed-dialog-nav-item.active:hover {
+    background: transparent;
+    border-bottom-color: var(--jini-accent);
+  }
+
+  .jini-tabbed-dialog-nav-text small {
+    display: none;
+  }
+
+  .jini-tabbed-dialog-sidebar-toggle {
+    display: none;
+  }
+
+  .jini-tabbed-dialog:not(.jini-tabbed-dialog--inline) .jini-tabbed-dialog-content {
+    padding: 14px 16px 18px;
+  }
+}

package/dist/react/components/RemixIcon.d.ts

@@ -1,50 +1,11 @@
 import type { CSSProperties } from 'react';
+export { installRemixIconStylesheet, REMIXICON_STYLESHEET_MARKER } from './RemixIcon.stylesheet.js';
 interface RemixIconProps {
     name: string;
     size?: number;
     className?: string;
     style?: CSSProperties;
 }
-/**
- * Marks whichever stylesheet is currently serving `.ri-*` glyphs — this package's own default, or
- * a host override that got inserted first. `ensureRemixIconStylesheet` checks for this attribute
- * (not a specific `href`) before injecting, so a host that wants its own icon set/font just needs
- * to add a `<link data-jini-remixicon rel="stylesheet" href="...">` (or an equivalent `<style
- * data-jini-remixicon>`) anywhere in `<head>` before the first `RemixIcon` mounts, and this
- * package's default never loads.
- *
- * Exported because every host that has needed the override so far re-declared this string
- * literally rather than importing it -- three copies outside this file, across two apps of the
- * one downstream checkout inspected (2026-09-06), and they do not agree on element type: one
- * installs a `<style>`, the other a `<link>`. A copied magic string is a rename away from
- * silently double-loading the font; importing the constant is not.
- */
-export declare const REMIXICON_STYLESHEET_MARKER = "data-jini-remixicon";
-/**
- * Installs a caller-supplied stylesheet as the one serving `.ri-*` glyphs, claiming
- * {@link REMIXICON_STYLESHEET_MARKER} so this package's own default never loads.
- *
- * This is the supported opt-in for any host whose bundler defeats the default's `import.meta.url`
- * resolution (see {@link ensureRemixIconStylesheet}) — point it at
- * `@jini-ai/ui/remixicon.css`, which is a normal subpath export a bundler resolves and rewrites
- * like any other asset. Call it before the first `RemixIcon` mounts; module top level in the
- * host's entry file is the usual place, since the default injection runs from a `useEffect` and
- * therefore only has to lose a race against React's commit phase.
- *
- * Idempotent and safe to call unconditionally: it no-ops if any marked stylesheet is already
- * present (including one a previous call installed), and no-ops outside a DOM.
- *
- * @param options.href URL of a stylesheet defining the `.ri-*` classes and its own `@font-face`.
- *   Resolved by the browser against the document, so relative values follow the page's base URL —
- *   pass a bundler-produced URL rather than a hand-written relative path.
- * @returns `true` if this call inserted the stylesheet, `false` if it no-opped.
- * @sideEffects Appends one `<link>` to `document.head`.
- * @complexity O(1) time (one `querySelector` on an attribute selector), O(1) space.
- * @overallScore 100
- */
-export declare function installRemixIconStylesheet(options: {
-    href: string;
-}): boolean;
 /**
  * Thin wrapper around a RemixIcon webfont glyph (`ri-<name>`). Loads this package's own default
  * RemixIcon CSS/font the first time any `RemixIcon` mounts — see
@@ -52,5 +13,4 @@ export declare function installRemixIconStylesheet(options: {
  * {@link installRemixIconStylesheet} for what a bundled host should call instead.
  */
 export declare function RemixIcon({ name, size, className, style }: RemixIconProps): import("react").JSX.Element;
-export {};
 //# sourceMappingURL=RemixIcon.d.ts.map

package/dist/react/components/RemixIcon.js

@@ -1,180 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect } from 'react';
-/**
- * Marks whichever stylesheet is currently serving `.ri-*` glyphs — this package's own default, or
- * a host override that got inserted first. `ensureRemixIconStylesheet` checks for this attribute
- * (not a specific `href`) before injecting, so a host that wants its own icon set/font just needs
- * to add a `<link data-jini-remixicon rel="stylesheet" href="...">` (or an equivalent `<style
- * data-jini-remixicon>`) anywhere in `<head>` before the first `RemixIcon` mounts, and this
- * package's default never loads.
- *
- * Exported because every host that has needed the override so far re-declared this string
- * literally rather than importing it -- three copies outside this file, across two apps of the
- * one downstream checkout inspected (2026-09-06), and they do not agree on element type: one
- * installs a `<style>`, the other a `<link>`. A copied magic string is a rename away from
- * silently double-loading the font; importing the constant is not.
- */
-export const REMIXICON_STYLESHEET_MARKER = 'data-jini-remixicon';
-let injected = false;
-let warned = false;
-/**
- * One diagnostic per page load, not one per `RemixIcon` mount — the failure this reports is a
- * build/bundler property, so it is the same failure every time and a per-mount warning would bury
- * the rest of the console under it.
- *
- * @complexity O(1) time, O(1) space.
- * @overallScore 100
- */
-function warnOnce(message) {
-    if (warned)
-        return;
-    warned = true;
-    console.warn(`[@jini-ai/ui] RemixIcon: ${message}`);
-}
-const OPT_IN_HINT = 'Import the stylesheet yourself and install it via ' +
-    "`installRemixIconStylesheet({ href })` — the subpath export `@jini-ai/ui/remixicon.css` " +
-    'resolves through your bundler normally, unlike this runtime default.';
-/**
- * Installs a caller-supplied stylesheet as the one serving `.ri-*` glyphs, claiming
- * {@link REMIXICON_STYLESHEET_MARKER} so this package's own default never loads.
- *
- * This is the supported opt-in for any host whose bundler defeats the default's `import.meta.url`
- * resolution (see {@link ensureRemixIconStylesheet}) — point it at
- * `@jini-ai/ui/remixicon.css`, which is a normal subpath export a bundler resolves and rewrites
- * like any other asset. Call it before the first `RemixIcon` mounts; module top level in the
- * host's entry file is the usual place, since the default injection runs from a `useEffect` and
- * therefore only has to lose a race against React's commit phase.
- *
- * Idempotent and safe to call unconditionally: it no-ops if any marked stylesheet is already
- * present (including one a previous call installed), and no-ops outside a DOM.
- *
- * @param options.href URL of a stylesheet defining the `.ri-*` classes and its own `@font-face`.
- *   Resolved by the browser against the document, so relative values follow the page's base URL —
- *   pass a bundler-produced URL rather than a hand-written relative path.
- * @returns `true` if this call inserted the stylesheet, `false` if it no-opped.
- * @sideEffects Appends one `<link>` to `document.head`.
- * @complexity O(1) time (one `querySelector` on an attribute selector), O(1) space.
- * @overallScore 100
- */
-export function installRemixIconStylesheet(options) {
-    if (typeof document === 'undefined')
-        return false;
-    if (document.querySelector(`[${REMIXICON_STYLESHEET_MARKER}]`)) {
-        injected = true;
-        return false;
-    }
-    const link = document.createElement('link');
-    link.rel = 'stylesheet';
-    link.setAttribute(REMIXICON_STYLESHEET_MARKER, '');
-    link.href = options.href;
-    document.head.appendChild(link);
-    injected = true;
-    return true;
-}
-/**
- * Resolves this package's bundled RemixIcon CSS relative to its own module URL, or `null` when
- * that resolution has provably produced something unusable.
- *
- * The `null` case is not hypothetical. Bundling a `new URL(..., import.meta.url)` asset reference
- * into a non-ESM output (Vite/Rollup `iife`, for one) makes Rollup inline the referenced file as a
- * `data:text/css;base64,...` href instead. That stylesheet then loads, but its own
- * `@font-face { src: url("./remixicon.woff2") }` is relative and a `data:` URL has no location to
- * be relative *to*, so the font request is never even attempted and every glyph renders as tofu.
- * Injecting it is strictly worse than injecting nothing, because it also claims
- * {@link REMIXICON_STYLESHEET_MARKER} and so suppresses any override installed later.
- *
- * @returns An absolute URL string, or `null` if resolution failed or yielded a `data:`/`blob:` URL.
- * @complexity O(1) time, O(1) space.
- * @overallScore 100
- */
-function resolveDefaultStylesheetHref() {
-    let resolved;
-    try {
-        resolved = new URL('./remixicon-font/remixicon.css', import.meta.url);
-    }
-    catch {
-        return null;
-    }
-    if (resolved.protocol === 'data:' || resolved.protocol === 'blob:')
-        return null;
-    return resolved.href;
-}
-/**
- * Idempotently loads this package's default RemixIcon webfont/CSS on first use, so a host gets
- * working icons out of the box with zero setup — see {@link REMIXICON_STYLESHEET_MARKER} for how a
- * host overrides this and {@link installRemixIconStylesheet} for the supported way to do it.
- *
- * **This default only survives unbundled ESM, and that is not a fixable property of this
- * function.** It resolves the CSS with `new URL('./remixicon-font/remixicon.css',
- * import.meta.url)`, which is correct exactly while this module is still a real ES module sitting
- * next to its own `remixicon-font/` directory. Three bundler transformations break it three
- * different ways. The first two were confirmed live against this component; the third was
- * confirmed live against its sibling, and is listed because nothing exempts this file from it:
- *
- * - **`iife`/`umd` output** cannot express the reference at all and degrades it to an inlined
- *   `data:` URL whose own relative `@font-face` src can never resolve. Confirmed live in a
- *   downstream `lib`/`iife` widget bundle, where `document.fonts` reported the `remixicon` face
- *   as `status: "error"` with no matching resource entry at all — an unattempted fetch, not a
- *   404. Detected and refused by {@link resolveDefaultStylesheetHref}.
- * - **Production ESM builds** may copy the CSS as an opaque asset without descending into its
- *   `url(./remixicon.woff2)`, emitting the stylesheet without the font beside it. Confirmed live
- *   in a downstream admin SPA build, which is why that host imports the CSS through its
- *   bundler's real CSS pipeline instead of letting this default run.
- * - **Vite dev-server dependency pre-bundling** flattens a package module into a `.vite/deps/`
- *   chunk, so an `import.meta.url`-relative URL resolves against the chunk's location instead.
- *   Observed live for this package's `AgentIcon` (fixed in 58bf42fa by inlining those assets as
- *   `data:` URIs — not an option here, see {@link installRemixIconStylesheet}), *not* observed
- *   for this component, whose two known hosts both claim the marker before this default ever
- *   runs. Worth knowing how it presented there: not as a 404, but as the dev server's SPA
- *   history fallback answering `200 text/html`.
- *
- * A previous version of this comment claimed "Vite/Rollup/webpack all rewrite this correctly at
- * build time". They do not, and each downstream host that hit it rediscovered a different half
- * of the above independently. There is no runtime-resolvable URL that survives all of it — the
- * cannot know where, or whether, its sibling asset was emitted — so the honest contract is: the
- * default is a convenience for unbundled ESM, and any bundled host should call
- * {@link installRemixIconStylesheet} instead. This function's job is to make that failure *loud*
- * rather than silent, since tofu glyphs give no clue where to look.
- *
- * @sideEffects Appends at most one `<link>` to `document.head`; may emit one `console.warn`.
- * @complexity O(1) time, O(1) space.
- * @overallScore 100
- */
-function ensureRemixIconStylesheet() {
-    if (injected || typeof document === 'undefined')
-        return;
-    if (document.querySelector(`[${REMIXICON_STYLESHEET_MARKER}]`)) {
-        injected = true;
-        return;
-    }
-    const href = resolveDefaultStylesheetHref();
-    if (href === null) {
-        // Claiming the marker with a stylesheet that cannot work would block a later override, so
-        // stay out of the way entirely and let the host know why its icons are blank.
-        injected = true;
-        warnOnce(`this bundle defeated the default stylesheet's own URL resolution. ${OPT_IN_HINT}`);
-        return;
-    }
-    const link = document.createElement('link');
-    link.rel = 'stylesheet';
-    link.setAttribute(REMIXICON_STYLESHEET_MARKER, '');
-    link.href = href;
-    link.addEventListener('error', () => {
-        // The pre-bundling case above: undetectable synchronously, because the href looked perfectly
-        // well formed. Drop the dead <link> so it stops holding the marker hostage — a host can
-        // still recover by calling installRemixIconStylesheet — but leave `injected` set so a later
-        // mount does not re-request the same missing file.
-        //
-        // UNVERIFIED, and deliberately not relied on: whether this also fires for the `200 text/html`
-        // SPA-fallback shape that case actually takes. A stylesheet served as `text/html` is refused
-        // under strict MIME checking, which is specified to fire `error` — but that has not been
-        // exercised here, so treat the warning as a bonus in that shape, not a guarantee.
-        link.remove();
-        warnOnce(`the default stylesheet failed to load from ${href}. ${OPT_IN_HINT}`);
-    });
-    document.head.appendChild(link);
-    injected = true;
-}
+import { ensureRemixIconStylesheet } from './RemixIcon.stylesheet.js';
+export { installRemixIconStylesheet, REMIXICON_STYLESHEET_MARKER } from './RemixIcon.stylesheet.js';
 /**
  * Thin wrapper around a RemixIcon webfont glyph (`ri-<name>`). Loads this package's own default
  * RemixIcon CSS/font the first time any `RemixIcon` mounts — see
@@ -183,7 +10,7 @@ function ensureRemixIconStylesheet() {
  */
 export function RemixIcon({ name, size = 14, className, style }) {
     useEffect(() => {
-        ensureRemixIconStylesheet();
+        ensureRemixIconStylesheet({});
     }, []);
     return (_jsx("i", { className: `ri-${name}${className ? ` ${className}` : ''}`, "aria-hidden": "true", style: {
             fontSize: size,