@jini-ai/ui 0.6.12 → 0.6.15-rc.2

package/dist/features/panel-kit/fetch-query/adapter.react.d.ts

@@ -1,11 +1,16 @@
 import { type ReactNode } from 'react';
-import { type FetchQueryEnvironmentPort } from '@jini-ai/core/fetch';
+import { type FetchQueryCacheOptions } from '@jini-ai/core/fetch';
 import type { CachedLoader, CachedLoaderDefaults, CachedLoaderOptions, FetchMutationOptions, FetchQueryOptions, MutationResult, QueryKey, QueryResult } from '@jini-ai/core/fetch';
-/** Isolated cache scope; no external provider or query-library singleton is needed. */
-export declare function FetchQueryProvider({ children, environment }: {
+/** Isolated cache scope; no external provider or query-library singleton is needed.
+ * Omitted timing ports use core's real clock and native timers. Keep port identities stable:
+ * replacing a port creates a new cache and disposes the previous scope's timers/subscriptions.
+ * @param props Children and optional host environment, clock and scheduler ports.
+ * @returns The provider-scoped query binding; activates on mount and disposes on unmount.
+ * @example <FetchQueryProvider clock={clock} scheduler={scheduler}><Records /></FetchQueryProvider>
+ * @complexity O(1) setup time and space; disposal scales with cached entries. */
+export declare function FetchQueryProvider({ children, environment, ...timing }: {
     children: ReactNode;
-    environment?: FetchQueryEnvironmentPort;
-}): import("react").JSX.Element;
+} & Pick<FetchQueryCacheOptions, 'environment' | 'clock' | 'scheduler'>): import("react").JSX.Element;
 /**
  * Without prior successful data, a disabled read hides cached errors so gesture-gated
  * content cannot display a failure the user has not asked to retry. With prior data, retain

package/dist/features/panel-kit/fetch-query/adapter.react.js

@@ -4,11 +4,17 @@ import { DEFAULT_STALE_TIME, FetchQueryCache, toQueryError, withCachedLoaderFetc
 import { browserFetchQueryEnvironment } from './environment.browser.js';
 import { FetchQueryBinding } from './binding.react.js';
 const CacheContext = createContext(null);
-/** Isolated cache scope; no external provider or query-library singleton is needed. */
-export function FetchQueryProvider({ children, environment = browserFetchQueryEnvironment }) {
+/** Isolated cache scope; no external provider or query-library singleton is needed.
+ * Omitted timing ports use core's real clock and native timers. Keep port identities stable:
+ * replacing a port creates a new cache and disposes the previous scope's timers/subscriptions.
+ * @param props Children and optional host environment, clock and scheduler ports.
+ * @returns The provider-scoped query binding; activates on mount and disposes on unmount.
+ * @example <FetchQueryProvider clock={clock} scheduler={scheduler}><Records /></FetchQueryProvider>
+ * @complexity O(1) setup time and space; disposal scales with cached entries. */
+export function FetchQueryProvider({ children, environment = browserFetchQueryEnvironment, ...timing }) {
     // A module singleton would leak cache values between independent providers/tests,
     // producing cases that pass alone but fail together. Scope ownership to this provider.
-    const cache = useMemo(() => new FetchQueryCache({}, { environment }), [environment]);
+    const cache = useMemo(() => new FetchQueryCache({}, { environment, ...timing }), [environment, timing.clock, timing.scheduler]);
     useEffect(() => {
         cache.activate();
         return () => cache.dispose();

package/dist/features/panel-kit/fetch-query/binding.react.d.ts

@@ -14,4 +14,8 @@ export declare const useFetchMutation: FetchQueryAdapter['useFetchMutation'];
 export declare const useInvalidate: FetchQueryAdapter['useInvalidate'];
 /** Promise loader using the same cache as reactive reads. */
 export declare const useCachedLoader: FetchQueryAdapter['useCachedLoader'];
+/** Stable API identity shared by observers of the same provider, expressed as a primitive key. */
+export declare function useFetchQueryScope(required: {
+    owner: object;
+}, _options?: Record<string, never>): number;
 //# sourceMappingURL=binding.react.d.ts.map

package/dist/features/panel-kit/fetch-query/binding.react.js

@@ -1,24 +1,43 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext } from 'react';
+import { createContext, useContext, useMemo, useState } from 'react';
+/** Allocate primitive namespace keys within one cache provider; weak keys do not retain APIs. */
+function createQueryScopes(_required, _options = {}) {
+    const scopes = new WeakMap();
+    let nextScope = 0;
+    return ({ owner }, _optional = {}) => {
+        let scope = scopes.get(owner);
+        if (scope === undefined) {
+            scope = ++nextScope;
+            scopes.set(owner, scope);
+        }
+        return scope;
+    };
+}
 const AdapterContext = createContext(null);
 /** Internal composition seam: hooks and imperative loaders always use the same provider.
  * Keep the adapter fixed for this provider's lifetime to preserve React hook ordering. */
 export function FetchQueryBinding({ adapter, children }) {
-    return _jsx(AdapterContext.Provider, { value: adapter, children: children });
+    const [scopeFor] = useState(() => createQueryScopes({}));
+    const binding = useMemo(() => ({ adapter, scopeFor }), [adapter, scopeFor]);
+    return _jsx(AdapterContext.Provider, { value: binding, children: children });
 }
 /** Resolve the nearest provider; fail before attempting an unscoped read or write. */
-function useAdapter() {
-    const adapter = useContext(AdapterContext);
-    if (!adapter)
+function useBinding() {
+    const binding = useContext(AdapterContext);
+    if (!binding)
         throw new Error('Fetch-query hooks require FetchQueryProvider');
-    return adapter;
+    return binding;
 }
 /** Library-free read facade; the provider selects its implementation. */
-export const useFetchQuery = (required, optional = {}) => useAdapter().useFetchQuery(required, optional);
+export const useFetchQuery = (required, optional = {}) => useBinding().adapter.useFetchQuery(required, optional);
 /** Library-free write facade, including safe discarded promises. */
-export const useFetchMutation = (required, optional = {}) => useAdapter().useFetchMutation(required, optional);
+export const useFetchMutation = (required, optional = {}) => useBinding().adapter.useFetchMutation(required, optional);
 /** Prefix invalidator for the nearest provider's cache. */
-export const useInvalidate = () => useAdapter().useInvalidate();
+export const useInvalidate = () => useBinding().adapter.useInvalidate();
 /** Promise loader using the same cache as reactive reads. */
-export const useCachedLoader = (required, optional = {}) => useAdapter().useCachedLoader(required, optional);
+export const useCachedLoader = (required, optional = {}) => useBinding().adapter.useCachedLoader(required, optional);
+/** Stable API identity shared by observers of the same provider, expressed as a primitive key. */
+export function useFetchQueryScope(required, _options = {}) {
+    return useBinding().scopeFor(required);
+}
 //# sourceMappingURL=binding.react.js.map

package/dist/features/panel-kit/fetch-query/index.d.ts

@@ -1,5 +1,5 @@
 export { FetchQueryProvider } from './adapter.react.js';
-export { useFetchQuery, useFetchMutation, useCachedLoader, useInvalidate } from './binding.react.js';
+export { useFetchQuery, useFetchMutation, useCachedLoader, useInvalidate, useFetchQueryScope } from './binding.react.js';
 /** @deprecated Import the framework-neutral environment port from @jini-ai/core/fetch. */
 export type { FetchQueryEnvironmentPort } from '@jini-ai/core/fetch';
 /** @deprecated Import framework-neutral query contracts from @jini-ai/core/fetch. */

package/dist/features/panel-kit/fetch-query/index.js

@@ -1,3 +1,3 @@
 export { FetchQueryProvider } from './adapter.react.js';
-export { useFetchQuery, useFetchMutation, useCachedLoader, useInvalidate } from './binding.react.js';
+export { useFetchQuery, useFetchMutation, useCachedLoader, useInvalidate, useFetchQueryScope } from './binding.react.js';
 //# sourceMappingURL=index.js.map

package/dist/features/panel-kit/fetch-query/tanstack.d.ts

@@ -1,6 +1,6 @@
 /** Optional adapter entry. Importing the default entry never loads TanStack. */
 export { FetchQueryProvider } from './adapter.tanstack.js';
-export { useFetchQuery, useFetchMutation, useCachedLoader, useInvalidate } from './binding.react.js';
+export { useFetchQuery, useFetchMutation, useCachedLoader, useInvalidate, useFetchQueryScope } from './binding.react.js';
 /** @deprecated Import the framework-neutral environment port from @jini-ai/core/fetch. */
 export type { FetchQueryEnvironmentPort } from '@jini-ai/core/fetch';
 /** @deprecated Import framework-neutral query contracts from @jini-ai/core/fetch. */

package/dist/features/panel-kit/fetch-query/tanstack.js

@@ -1,4 +1,4 @@
 /** Optional adapter entry. Importing the default entry never loads TanStack. */
 export { FetchQueryProvider } from './adapter.tanstack.js';
-export { useFetchQuery, useFetchMutation, useCachedLoader, useInvalidate } from './binding.react.js';
+export { useFetchQuery, useFetchMutation, useCachedLoader, useInvalidate, useFetchQueryScope } from './binding.react.js';
 //# sourceMappingURL=tanstack.js.map

package/dist/features/privacy/react/components/PrivacyTab.d.ts

@@ -3,8 +3,6 @@ export interface PrivacyTabLabels {
     consentKicker?: string;
     consentLead?: string;
     consentFooter?: string;
-    declineLabel?: string;
-    shareLabel?: string;
     metricsLabel?: string;
     metricsHint?: string;
     contentLabel?: string;
@@ -30,7 +28,7 @@ export interface PrivacyTabProps {
     agentHandle?: string;
 }
 /**
- * Telemetry consent card (share/decline + two per-category toggles) over a
+ * Telemetry consent card (two per-category toggles) over a
  * generic `{ metrics, content }` shape, plus an installation-id
  * generate/rotate ("Delete my data") flow. Origin: `PrivacySection.tsx`,
  * mounted by `SettingsDialog.tsx`'s `privacy` tab — flagged "likely

package/dist/features/privacy/react/components/PrivacyTab.js

@@ -1,8 +1,8 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { agentHandleProps, agentSubHandle } from '@jini-ai/agentic';
 import { useT } from '../../../i18n/index.js';
 import { Icon } from '../../../../react/components/Icon.js';
-import { hasMadeConsentDecision, isSharingEnabled, nextStateForDeclineAll, nextStateForDeleteMyData, nextStateForShareAll, nextStateForTelemetryPatch, } from '../../rules.js';
+import { hasMadeConsentDecision, nextStateForDeleteMyData, nextStateForTelemetryPatch, } from '../../rules.js';
 function ToggleRow({ label, hint, checked, onChange, agentHandle }) {
     return (_jsxs("button", { type: "button", className: `jini-toggle-row${checked ? ' on' : ''}`, onClick: () => onChange(!checked), "aria-pressed": checked, ...agentHandleProps({}, { base: agentHandle, ...({ role: 'checkbox', label }) }), children: [_jsxs("div", { className: "jini-toggle-row-text", children: [_jsx("span", { className: "jini-toggle-row-label", children: label }), _jsx("span", { className: "jini-toggle-row-hint", children: hint })] }), _jsx("span", { className: "jini-toggle-row-switch", "aria-hidden": true })] }));
 }
@@ -11,8 +11,6 @@ function resolveConsentLabels({ labels }, { t }) {
         consentKicker: labels.consentKicker ?? t('Help improve this product'),
         consentLead: labels.consentLead ?? t('Choose what you share. You can change this anytime.'),
         consentFooter: labels.consentFooter ?? t('Nothing is shared unless you opt in.'),
-        declineLabel: labels.declineLabel ?? t("Don't share"),
-        shareLabel: labels.shareLabel ?? t('Share usage'),
         metricsLabel: labels.metricsLabel ?? t('Anonymous metrics'),
         metricsHint: labels.metricsHint ?? t('Feature usage and performance data, with no personal content.'),
         contentLabel: labels.contentLabel ?? t('Conversation and tool content'),
@@ -28,7 +26,7 @@ function resolveInstallationLabels({ labels }, { t }) {
     };
 }
 /**
- * Telemetry consent card (share/decline + two per-category toggles) over a
+ * Telemetry consent card (two per-category toggles) over a
  * generic `{ metrics, content }` shape, plus an installation-id
  * generate/rotate ("Delete my data") flow. Origin: `PrivacySection.tsx`,
  * mounted by `SettingsDialog.tsx`'s `privacy` tab — flagged "likely
@@ -39,10 +37,9 @@ function resolveInstallationLabels({ labels }, { t }) {
 export function PrivacyTab({ state, onChange, labels, now = Date.now, agentHandle }) {
     const t = useT();
     const decided = hasMadeConsentDecision(state);
-    const sharing = decided ? isSharingEnabled(state.telemetry) : undefined;
     const labelOverrides = labels ?? {};
-    const { consentKicker, consentLead, consentFooter, declineLabel, shareLabel, metricsLabel, metricsHint, contentLabel, contentHint, } = resolveConsentLabels({ labels: labelOverrides }, { t });
+    const { consentKicker, consentLead, consentFooter, metricsLabel, metricsHint, contentLabel, contentHint, } = resolveConsentLabels({ labels: labelOverrides }, { t });
     const { installationIdLabel, installationIdHint, optedOutLabel, deleteMyDataLabel, } = resolveInstallationLabels({ labels: labelOverrides }, { t });
-    return (_jsxs("section", { className: "jini-settings-section jini-settings-privacy", children: [_jsxs("div", { className: "jini-settings-subsection", children: [_jsx("div", { className: "jini-section-head", children: _jsxs("div", { children: [_jsx("h4", { children: consentKicker }), _jsx("p", { className: "jini-hint", children: consentLead })] }) }), _jsxs("dl", { className: "jini-settings-privacy-disclosure", children: [_jsxs("div", { children: [_jsx("dt", { children: metricsLabel }), _jsx("dd", { children: metricsHint })] }), _jsxs("div", { children: [_jsx("dt", { children: contentLabel }), _jsx("dd", { children: contentHint })] })] }), _jsx("p", { className: "jini-hint", children: consentFooter }), _jsxs("div", { className: "jini-privacy-consent-actions", role: "group", "aria-label": consentKicker, children: [_jsx("button", { type: "button", className: `jini-privacy-consent-action${sharing === false ? ' is-active' : ''}`, "aria-pressed": sharing === false, onClick: () => onChange(nextStateForDeclineAll(state, now())), ...agentHandleProps({}, { base: agentHandle, ...({ action: 'decline', role: 'button', label: declineLabel }) }), children: declineLabel }), _jsx("button", { type: "button", className: `jini-privacy-consent-action jini-privacy-consent-action--primary${sharing === true ? ' is-active' : ''}`, "aria-pressed": sharing === true, onClick: () => onChange(nextStateForShareAll(state, now())), ...agentHandleProps({}, { base: agentHandle, ...({ action: 'share', role: 'button', label: shareLabel }) }), children: shareLabel })] })] }), decided ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "jini-settings-privacy-toggles", children: [_jsx(ToggleRow, { label: metricsLabel, hint: metricsHint, checked: state.telemetry.metrics === true, onChange: (v) => onChange(nextStateForTelemetryPatch(state, { metrics: v }, now())), ...(agentHandle ? { agentHandle: agentSubHandle({ base: agentHandle, action: 'metrics-toggle' }) } : {}) }), _jsx(ToggleRow, { label: contentLabel, hint: contentHint, checked: state.telemetry.content === true, onChange: (v) => onChange(nextStateForTelemetryPatch(state, { content: v }, now())), ...(agentHandle ? { agentHandle: agentSubHandle({ base: agentHandle, action: 'content-toggle' }) } : {}) })] }), _jsxs("div", { className: "jini-settings-subsection", children: [_jsx("div", { className: "jini-section-head", children: _jsxs("div", { children: [_jsx("h4", { children: installationIdLabel }), _jsx("p", { className: "jini-hint", children: installationIdHint })] }) }), _jsx("div", { className: "jini-settings-field", children: _jsx("input", { type: "text", readOnly: true, value: state.installationId ?? optedOutLabel, "aria-label": installationIdLabel, ...agentHandleProps({}, { base: agentHandle, ...({ action: 'installation-id', role: 'field', label: installationIdLabel }) }) }) }), _jsxs("button", { type: "button", className: "jini-button jini-button-ghost", onClick: () => onChange(nextStateForDeleteMyData(state, now())), ...agentHandleProps({}, { base: agentHandle, ...({ action: 'delete-my-data', role: 'button', label: deleteMyDataLabel }) }), children: [_jsx(Icon, { name: "trash", size: 13 }), _jsx("span", { children: deleteMyDataLabel })] })] })] })) : null] }));
+    return (_jsxs("section", { className: "jini-settings-section jini-settings-privacy", children: [_jsxs("div", { className: "jini-settings-subsection", children: [_jsx("div", { className: "jini-section-head", children: _jsxs("div", { children: [_jsx("h4", { children: consentKicker }), _jsx("p", { className: "jini-hint", children: consentLead })] }) }), _jsxs("div", { className: "jini-settings-privacy-toggles", children: [_jsx(ToggleRow, { label: metricsLabel, hint: metricsHint, checked: state.telemetry.metrics === true, onChange: (v) => onChange(nextStateForTelemetryPatch(state, { metrics: v }, now())), ...(agentHandle ? { agentHandle: agentSubHandle({ base: agentHandle, action: 'metrics-toggle' }) } : {}) }), _jsx(ToggleRow, { label: contentLabel, hint: contentHint, checked: state.telemetry.content === true, onChange: (v) => onChange(nextStateForTelemetryPatch(state, { content: v }, now())), ...(agentHandle ? { agentHandle: agentSubHandle({ base: agentHandle, action: 'content-toggle' }) } : {}) })] }), _jsx("p", { className: "jini-hint", children: consentFooter })] }), decided ? (_jsxs("div", { className: "jini-settings-subsection", children: [_jsx("div", { className: "jini-section-head", children: _jsxs("div", { children: [_jsx("h4", { children: installationIdLabel }), _jsx("p", { className: "jini-hint", children: installationIdHint })] }) }), _jsx("div", { className: "jini-settings-field", children: _jsx("input", { type: "text", readOnly: true, value: state.installationId ?? optedOutLabel, "aria-label": installationIdLabel, ...agentHandleProps({}, { base: agentHandle, ...({ action: 'installation-id', role: 'field', label: installationIdLabel }) }) }) }), _jsxs("button", { type: "button", className: "jini-button jini-button-ghost", onClick: () => onChange(nextStateForDeleteMyData(state, now())), ...agentHandleProps({}, { base: agentHandle, ...({ action: 'delete-my-data', role: 'button', label: deleteMyDataLabel }) }), children: [_jsx(Icon, { name: "trash", size: 13 }), _jsx("span", { children: deleteMyDataLabel })] })] })) : null] }));
 }
 //# sourceMappingURL=PrivacyTab.js.map

package/dist/features/resource-dashboard/react/components/ResourceBoardView.js

@@ -1,11 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ResourceBoardAlerts, ResourceBoardContent, ResourceBoardViewToolbar } from './ResourceBoardViewParts.js';
+import { ResourceBoardAlerts, ResourceBoardContent } from './ResourceBoardViewParts.js';
+import { ResourceBoardToolbar } from './ResourceBoardToolbar.js';
 /**
  * Pure composition (props in, JSX out): the toolbar, then either the empty
  * state, the card grid, or the kanban board — DesignsTab's own
  * `filtered.length === 0 ? empty : view === "grid" ? grid : kanban` branch.
  */
 export function ResourceBoardView(props) {
-    return (_jsxs("div", { className: `resource-board${props.viewMode === 'kanban' ? ' is-kanban' : ''}`, children: [_jsx(ResourceBoardViewToolbar, { ...props }), _jsx(ResourceBoardAlerts, { ...props }), _jsx(ResourceBoardContent, { ...props })] }));
+    return (_jsxs("div", { className: `resource-board${props.viewMode === 'kanban' ? ' is-kanban' : ''}`, children: [_jsx(ResourceBoardToolbar, { ...props, selectedCount: props.selected.size }), _jsx(ResourceBoardAlerts, { ...props }), _jsx(ResourceBoardContent, { ...props })] }));
 }
 //# sourceMappingURL=ResourceBoardView.js.map

package/dist/features/resource-dashboard/react/components/ResourceBoardViewParts.d.ts

@@ -1,6 +1,4 @@
 import type { ResourceBoardViewProps } from './ResourceBoardView.js';
-/** Maps the view's props onto `ResourceBoardToolbar` (sort, search, view toggle, select-mode/bulk-delete, create CTA). */
-export declare function ResourceBoardViewToolbar<TBody>(props: ResourceBoardViewProps<TBody>): import("react").JSX.Element;
 /** The LOAD-failure banner and, independently, the single-item action-failure banner (shown ABOVE the still-visible item list). */
 export declare function ResourceBoardAlerts<TBody>({ error, errorLabel, actionError, actionErrorLabel, }: Pick<ResourceBoardViewProps<TBody>, 'error' | 'errorLabel' | 'actionError' | 'actionErrorLabel'>): import("react").JSX.Element;
 /** The card grid: one `ResourceCard` per item, with the item's id bound into each per-card callback. */

package/dist/features/resource-dashboard/react/components/ResourceBoardViewParts.js

@@ -1,12 +1,6 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { ResourceBoardToolbar } from './ResourceBoardToolbar.js';
 import { ResourceCard } from './ResourceCard.js';
 import { ResourceKanbanBoard } from './ResourceKanbanBoard.js';
-/** Maps the view's props onto `ResourceBoardToolbar` (sort, search, view toggle, select-mode/bulk-delete, create CTA). */
-export function ResourceBoardViewToolbar(props) {
-    const { activeSort, createLabel, onCreate } = props;
-    return (_jsx(ResourceBoardToolbar, { sortOptions: props.sortOptions, ...(activeSort !== undefined ? { activeSort } : {}), onSortChange: props.onSortChange, sortAriaLabel: props.sortAriaLabel, query: props.query, onQueryChange: props.onQueryChange, searchPlaceholder: props.searchPlaceholder, viewMode: props.viewMode, onViewModeChange: props.onViewModeChange, viewToggleAriaLabel: props.viewToggleAriaLabel, gridViewLabel: props.gridViewLabel, kanbanViewLabel: props.kanbanViewLabel, enableBulkDelete: props.enableBulkDelete, selectMode: props.selectMode, selectedCount: props.selected.size, bulkDeleteBusy: props.bulkDeleteBusy, onEnterSelectMode: props.onEnterSelectMode, onExitSelectMode: props.onExitSelectMode, onBulkDelete: props.onBulkDelete, selectModeLabel: props.selectModeLabel, selectedCountLabel: props.selectedCountLabel, deleteSelectedLabel: props.deleteSelectedLabel, cancelSelectLabel: props.cancelSelectLabel, ...(createLabel !== undefined ? { createLabel } : {}), ...(onCreate !== undefined ? { onCreate } : {}) }));
-}
 /** The LOAD-failure banner and, independently, the single-item action-failure banner (shown ABOVE the still-visible item list). */
 export function ResourceBoardAlerts({ error, errorLabel, actionError, actionErrorLabel, }) {
     return (_jsxs(_Fragment, { children: [error ? (_jsx("div", { className: "resource-board-error", role: "alert", children: errorLabel ?? error })) : null, actionError ? (_jsx("div", { className: "resource-board-action-error", role: "alert", children: actionErrorLabel ?? actionError })) : null] }));

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

@@ -1274,16 +1274,11 @@ select.jini-input {
 /* ============================================================
    Privacy tab
    ============================================================
-   `PrivacyTab.tsx`'s disclosure list was a bare `<dl>`/`<dt>`/`<dd>` (browser
-   default `<dd>` indent leaking through), its consent buttons
-   (`jini-privacy-consent-action*`) were unstyled text, and its toggle
-   switches (`jini-toggle-row*`) had NO rules anywhere in this file — not
-   even a partial match; `grep -i "toggle|switch"` against the file returned
-   nothing before this. Reference: `od-settings-privacy.png` — the two
-   disclosure items read as plain title+description pairs, the two consent
-   buttons sit side by side with the primary one filled, and the granular
-   toggles are real switches once a consent decision exists
-   (`hasMadeConsentDecision`). */
+   `PrivacyTab.tsx`'s toggle switches (`jini-toggle-row*`) had NO rules
+   anywhere in this file — not even a partial match; `grep -i
+   "toggle|switch"` against the file returned nothing before this. The two
+   choices show once, as these switches (the disclosure list and
+   share/decline buttons that repeated them were removed 2026-10-26). */
 
 /* `PrivacyTab.tsx` puts its two `jini-section-head` headings ("Help improve
    this product", "Installation ID") in a bare `<h4>` with no className of
@@ -1301,66 +1296,6 @@ select.jini-input {
   color: var(--jini-text-strong);
 }
 
-.jini-settings-privacy-disclosure {
-  margin: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-}
-
-.jini-settings-privacy-disclosure > div {
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-}
-
-.jini-settings-privacy-disclosure dt {
-  margin: 0;
-  font-size: 13px;
-  font-weight: 600;
-  color: var(--jini-text-strong);
-}
-
-.jini-settings-privacy-disclosure dd {
-  margin: 0;
-  font-size: 12px;
-  color: var(--jini-text-muted);
-}
-
-.jini-privacy-consent-actions {
-  display: flex;
-  gap: 10px;
-}
-
-.jini-privacy-consent-action {
-  flex: 1 1 0;
-  padding: 9px 16px;
-  font: inherit;
-  font-size: 13px;
-  font-weight: 600;
-  color: var(--jini-text);
-  background: var(--jini-bg-panel);
-  border: 1px solid var(--jini-border-strong);
-  border-radius: var(--jini-radius-sm);
-  cursor: pointer;
-}
-
-.jini-privacy-consent-action:hover {
-  border-color: var(--jini-text-muted);
-}
-
-.jini-privacy-consent-action--primary {
-  color: var(--jini-accent-ink);
-  background: var(--jini-accent);
-  border-color: var(--jini-accent);
-}
-
-.jini-privacy-consent-action--primary:hover,
-.jini-privacy-consent-action--primary.is-active {
-  background: var(--jini-accent-hover);
-  border-color: var(--jini-accent-hover);
-}
-
 .jini-settings-privacy-toggles {
   display: flex;
   flex-direction: column;

package/dist/features/source-config-list/react/components/SourceConfigField.js

@@ -1,6 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useRef, useState } from 'react';
+import { useEffect, useRef } from 'react';
 import { useT } from '../../../i18n/index.js';
+import { SecretInput, SecretTextarea } from '../../../../react/components/SecretInput.js';
+import { useSecretReveal as useSecretInputReveal } from '../../../../react/components/SecretInput.hooks.js';
 import { sourceConfigAgentProps } from '../../agent-handles.js';
 import { maskFieldValue } from '../../rules.js';
 /**
@@ -36,10 +38,10 @@ import { maskFieldValue } from '../../rules.js';
  */
 export function SourceConfigField({ spec, value, error, disabled = false, idPrefix = 'source-config-field', agentHandle, onChange }) {
     const t = useT();
-    const { revealed, toggleRevealed, isLockedSecret } = useSecretReveal({ kind: spec.kind, value });
     const inputId = `${idPrefix}-${spec.key}`;
     const errorId = error ? `${inputId}-error` : undefined;
     const fieldLabel = t(spec.label);
+    const { revealed, toggleRevealed, isLockedSecret } = useSecretReveal({ kind: spec.kind, value, label: fieldLabel });
     const shared = {
         disabled,
         'aria-invalid': Boolean(error) || undefined,
@@ -55,15 +57,16 @@ export function SourceConfigField({ spec, value, error, disabled = false, idPref
         action: 'reveal',
     });
     const reveal = { revealed, disabled, agentProps: revealAgentProps, onToggle: toggleRevealed };
-    return (_jsxs("label", { className: "source-config-field", htmlFor: inputId, children: [_jsxs("span", { className: "source-config-field-label", children: [fieldLabel, spec.required ? (_jsx("span", { className: "source-config-field-required", "aria-label": t('required'), children: "*" })) : null] }), _jsx(SourceConfigFieldControl, { spec: spec, value: value, inputId: inputId, shared: shared, reveal: reveal, isLockedSecret: isLockedSecret }), error ? (_jsx("span", { id: errorId, className: "source-config-field-error", role: "alert", children: error })) : null] }));
+    return (_jsxs("div", { className: "source-config-field", children: [_jsxs("label", { className: "source-config-field-label", htmlFor: inputId, children: [fieldLabel, spec.required ? (_jsx("span", { className: "source-config-field-required", "aria-label": t('required'), children: "*" })) : null] }), _jsx(SourceConfigFieldControl, { spec: spec, value: value, inputId: inputId, shared: shared, reveal: reveal, isLockedSecret: isLockedSecret }), error ? (_jsx("span", { id: errorId, className: "source-config-field-error", role: "alert", children: error })) : null] }));
 }
 /**
  * The `password`/`secret-textarea` show-hide state. The toggle is small local
  * disclosure state (per the vertical-slice guardrail allowing that in a leaf
  * component).
  */
-function useSecretReveal({ kind, value }) {
-    const [revealed, setRevealed] = useState(false);
+function useSecretReveal({ kind, value, label }, _options = {}) {
+    const t = useT();
+    const { revealed, toggle } = useSecretInputReveal({ value, labels: { show: `${t('Show')} ${label}`, hide: `${t('Hide')} ${label}` } });
     // Whether THIS mount ever had a pre-existing secret to protect, captured
     // once rather than recomputed from `value` on every render. A plain
     // `Boolean(value)` gate would look right at first glance but re-locks the
@@ -87,7 +90,6 @@ function useSecretReveal({ kind, value }) {
     // or from the user clearing an existing secret mid-edit to type a new one.
     useEffect(() => {
         if (!value) {
-            setRevealed(false);
             hadStoredSecretRef.current = false;
         }
     }, [value]);
@@ -95,8 +97,8 @@ function useSecretReveal({ kind, value }) {
     // secret still un-revealed. A field with nothing to protect — first-time
     // entry, or one already cleared out — is immediately editable, no
     // "Show"/reveal click required.
-    const isLockedSecret = kind === 'secret-textarea' && hadStoredSecretRef.current && !revealed;
-    return { revealed, toggleRevealed: () => setRevealed((current) => !current), isLockedSecret };
+    const isLockedSecret = kind === 'secret-textarea' && Boolean(value) && hadStoredSecretRef.current && !revealed;
+    return { revealed, toggleRevealed: toggle, isLockedSecret };
 }
 /** Picks the control for `spec.kind`: a select, a (secret-)textarea, a password input, or a plain text/url input. */
 function SourceConfigFieldControl(props) {
@@ -116,25 +118,24 @@ function SelectControl({ spec, value, inputId, shared, placeholder, }) {
     return (_jsxs("select", { id: inputId, value: value, ...shared, children: [_jsx("option", { value: "", disabled: true, hidden: true, children: placeholder ?? t('Select…') }), (spec.options ?? []).map((option) => (_jsx("option", { value: option.value, children: t(option.label) }, option.value)))] }));
 }
 function TextareaControl({ spec, value, inputId, shared, reveal, isLockedSecret, placeholder }) {
-    return (_jsxs("span", { className: "source-config-field-row", children: [_jsx("textarea", { id: inputId, value: isLockedSecret ? maskFieldValue(spec.kind, value) : value, placeholder: placeholder, 
-                // A masked textarea must not be typed into — the visible text is not
-                // the real value, so an edit would commit the mask characters.
-                // Revealing is the way in, exactly like the password field. Only
-                // applies when there is a stored secret to protect — see
-                // `isLockedSecret`.
-                readOnly: isLockedSecret, ...shared }), spec.kind === 'secret-textarea' ? _jsx(RevealToggle, { ...reveal }) : null] }));
-}
-function PasswordControl({ value, inputId, shared, reveal, placeholder }) {
-    return (_jsxs("span", { className: "source-config-field-row", children: [_jsx("input", { id: inputId, type: reveal.revealed ? 'text' : 'password', 
-                // `new-password`, NOT `off`: Chrome deliberately ignores `off` and fills a saved site
-                // login into the first password input it finds (and the text input above it as the
-                // username). A source's credential is never the operator's own login.
-                autoComplete: "new-password", value: value, placeholder: placeholder, ...shared }), _jsx(RevealToggle, { ...reveal })] }));
+    const t = useT();
+    if (spec.kind !== 'secret-textarea') {
+        return _jsx("span", { className: "source-config-field-row", children: _jsx("textarea", { id: inputId, value: value, placeholder: placeholder, ...shared }) });
+    }
+    return (_jsx("span", { className: "source-config-field-row", children: _jsx(SecretTextarea, { id: inputId, label: t(spec.label), revealed: reveal.revealed, onRevealedChange: reveal.onToggle, toggleAttrs: reveal.agentProps, value: value, maskedValue: isLockedSecret ? maskFieldValue(spec.kind, value) : undefined, placeholder: placeholder, 
+            // A masked textarea must not be typed into — the visible text is not
+            // the real value, so an edit would commit the mask characters.
+            // Revealing is the way in, exactly like the password field. Only
+            // applies when there is a stored secret to protect — see
+            // `isLockedSecret`.
+            readOnly: isLockedSecret, autoComplete: "off", ...shared }) }));
 }
-/** The `password`/`secret-textarea` Show/Hide button. */
-function RevealToggle({ revealed, disabled, agentProps, onToggle }) {
+function PasswordControl({ spec, value, inputId, shared, reveal, placeholder }) {
     const t = useT();
-    const label = revealed ? t('Hide') : t('Show');
-    return (_jsx("button", { type: "button", className: "source-config-field-toggle", disabled: disabled, ...agentProps, onClick: onToggle, title: label, children: label }));
+    return (_jsx("span", { className: "source-config-field-row", children: _jsx(SecretInput, { id: inputId, label: t(spec.label), "aria-label": t(spec.label), revealed: reveal.revealed, onRevealedChange: reveal.onToggle, toggleAttrs: reveal.agentProps, 
+            // `new-password`, NOT `off`: Chrome deliberately ignores `off` and fills a saved site
+            // login into the first password input it finds (and the text input above it as the
+            // username). A source's credential is never the operator's own login.
+            autoComplete: "new-password", value: value, placeholder: placeholder, ...shared }) }));
 }
 //# sourceMappingURL=SourceConfigField.js.map

package/dist/index.d.ts

@@ -105,6 +105,7 @@ export * from './browser/useModalWindowDragGuard.js';
 export * from './browser/index.js';
 export { Icon, ICON_PATH_DATA, type IconName } from './react/components/Icon.js';
 export * from './react/components/RemixIcon.js';
+export { SecretInput, SecretTextarea, type SecretInputProps, type SecretTextareaProps } from './react/components/SecretInput.js';
 export * from './react/components/AgentIcon.js';
 export * from './react/components/Toast.js';
 export * from './react/components/Loading.js';

package/dist/index.js

@@ -112,6 +112,7 @@ export * from './browser/index.js';
 // not reach this published package's public surface.
 export { Icon, ICON_PATH_DATA } from './react/components/Icon.js';
 export * from './react/components/RemixIcon.js';
+export { SecretInput, SecretTextarea } from './react/components/SecretInput.js';
 export * from './react/components/AgentIcon.js';
 export * from './react/components/Toast.js';
 export * from './react/components/Loading.js';

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

@@ -0,0 +1,47 @@
+import type { InputHTMLAttributes, TextareaHTMLAttributes } from 'react';
+/**
+ * @file The shared masked input: a password/token/key `<input>` with an eye toggle inside its right
+ * edge. Drop-in for `<input type="password">` — every other input prop passes straight through.
+ *
+ * Same markup and classes as `@jini-ai/ui-kit`'s password `TextField` and the mcp-ui secret fields
+ * (`.jini-secret` / `.jini-secret-toggle`), so one host stylesheet styles all of them; hosts own
+ * the visual rules.
+ *
+ * Keep it OUT of a wrapping `<label>`: the toggle's "Show <label>" name would join the input's own
+ * accessible name. Pair it with a sibling `<label htmlFor>` (or `aria-label`) instead.
+ *
+ * `SecretTextarea` is the multi-line twin (a `<textarea>` cannot be `type="password"`, so it masks
+ * with `-webkit-text-security` while hidden); its wrapper adds `.jini-secret--multiline` so a host
+ * can pin the toggle to the top corner instead of the vertical middle.
+ */
+/** The props both secret fields share: how the eye toggle is named and whether it starts shown. */
+interface SecretToggleProps {
+    /** The field's visible label, translated; names the toggle ("Show API key"). */
+    readonly label: string;
+    /** The toggle's full names, for a host with its own translator (chat, user-management). Default:
+     *  `t('Show')`/`t('Hide')` + `label`, from this package's `I18nProvider`. Same contract as
+     *  ui-kit `TextField`'s `secretToggleLabels`. */
+    readonly toggleLabels?: {
+        readonly show: string;
+        readonly hide: string;
+    };
+    /** Extra attributes for the toggle button, e.g. an agent handle. */
+    readonly toggleAttrs?: Readonly<Record<string, string | boolean | undefined>>;
+    /** Controlled mode: the host owns the shown/hidden state. */
+    readonly revealed?: boolean;
+    readonly onRevealedChange?: (revealed: boolean) => void;
+}
+export type SecretInputProps = SecretToggleProps & Omit<InputHTMLAttributes<HTMLInputElement>, 'type'>;
+export type SecretTextareaProps = SecretToggleProps & TextareaHTMLAttributes<HTMLTextAreaElement> & {
+    /** Safe replacement text while hidden (e.g. env names with masked values). Read-only while
+     *  displayed: editing replacement characters would overwrite the actual secret. */
+    readonly maskedValue?: string | undefined;
+};
+export declare const SecretInput: import("react").ForwardRefExoticComponent<SecretToggleProps & Omit<InputHTMLAttributes<HTMLInputElement>, "type"> & import("react").RefAttributes<HTMLInputElement>>;
+export declare const SecretTextarea: import("react").ForwardRefExoticComponent<SecretToggleProps & TextareaHTMLAttributes<HTMLTextAreaElement> & {
+    /** Safe replacement text while hidden (e.g. env names with masked values). Read-only while
+     *  displayed: editing replacement characters would overwrite the actual secret. */
+    readonly maskedValue?: string | undefined;
+} & import("react").RefAttributes<HTMLTextAreaElement>>;
+export {};
+//# sourceMappingURL=SecretInput.d.ts.map

package/dist/react/components/SecretInput.hooks.d.ts

@@ -0,0 +1,26 @@
+export interface SecretRevealRequired {
+    /** The input's current value. A transition to `''` re-hides (the usual sign a save succeeded). */
+    readonly value: unknown;
+    /** The toggle's full accessible names, translated ("Show API key" / "Hide API key"). */
+    readonly labels: {
+        readonly show: string;
+        readonly hide: string;
+    };
+}
+export interface SecretRevealOptional {
+    /** Controlled mode: the host owns the shown/hidden state (e.g. to reset it per provider). */
+    readonly revealed?: boolean;
+    readonly onRevealedChange?: (revealed: boolean) => void;
+}
+/**
+ * The show/hide state behind `SecretInput`'s eye toggle. Starts hidden. Uncontrolled, it re-hides on
+ * the value's transition to empty only — an empty field may still be revealed before pasting.
+ * @complexity O(1).
+ */
+export declare function useSecretReveal(required: SecretRevealRequired, optional?: SecretRevealOptional): {
+    readonly revealed: boolean;
+    readonly inputType: "text" | "password";
+    readonly toggleLabel: string;
+    readonly toggle: () => void;
+};
+//# sourceMappingURL=SecretInput.hooks.d.ts.map

package/dist/react/components/SecretInput.hooks.js

@@ -0,0 +1,25 @@
+import { useState } from 'react';
+/**
+ * The show/hide state behind `SecretInput`'s eye toggle. Starts hidden. Uncontrolled, it re-hides on
+ * the value's transition to empty only — an empty field may still be revealed before pasting.
+ * @complexity O(1).
+ */
+export function useSecretReveal(required, optional = {}) {
+    const [ownRevealed, setOwnRevealed] = useState(false);
+    const [lastValue, setLastValue] = useState(required.value);
+    if (required.value !== lastValue) {
+        setLastValue(required.value);
+        if (required.value === '')
+            setOwnRevealed(false);
+    }
+    const revealed = optional.revealed ?? ownRevealed;
+    const toggleLabel = revealed ? required.labels.hide : required.labels.show;
+    const toggle = () => {
+        if (optional.onRevealedChange)
+            optional.onRevealedChange(!revealed);
+        else
+            setOwnRevealed(!revealed);
+    };
+    return { revealed, inputType: revealed ? 'text' : 'password', toggleLabel, toggle };
+}
+//# sourceMappingURL=SecretInput.hooks.js.map

package/dist/react/components/SecretInput.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { useT } from '../../features/i18n/index.js';
+import { Icon } from './Icon.js';
+import { useSecretReveal } from './SecretInput.hooks.js';
+/** Reveal state + the eye button, shared by `SecretInput` and `SecretTextarea`. */
+function useSecretToggle({ label, toggleLabels, toggleAttrs, revealed, onRevealedChange }, { value, disabled } = {}) {
+    const t = useT();
+    const reveal = useSecretReveal({ value, labels: toggleLabels ?? { show: `${t('Show')} ${label}`, hide: `${t('Hide')} ${label}` } }, { ...(revealed === undefined ? {} : { revealed }), ...(onRevealedChange ? { onRevealedChange } : {}) });
+    // One signal only: the name flips Show/Hide, so no `aria-pressed` — both together made screen
+    // readers announce "Hide API key, toggle button, pressed" (Opus UI review 2026-10-26).
+    const button = (_jsx("button", { ...toggleAttrs, type: "button", className: "jini-secret-toggle", "aria-label": reveal.toggleLabel, title: reveal.toggleLabel, disabled: disabled, onClick: reveal.toggle, children: _jsx(Icon, { name: reveal.revealed ? 'eye-off' : 'eye', size: 18 }) }));
+    return { reveal, button };
+}
+export const SecretInput = forwardRef(function SecretInput(props, ref) {
+    // The toggle props are pulled off so they never reach the DOM `<input>`.
+    const { label, toggleLabels, toggleAttrs, revealed, onRevealedChange, ...inputProps } = props;
+    const { reveal, button } = useSecretToggle(props, { value: inputProps.value, disabled: inputProps.disabled });
+    return (_jsxs("span", { className: "jini-secret", children: [_jsx("input", { ...inputProps, spellCheck: false, ref: ref, type: reveal.inputType }), button] }));
+});
+export const SecretTextarea = forwardRef(function SecretTextarea(props, ref) {
+    const { label, toggleLabels, toggleAttrs, revealed, onRevealedChange, style, maskedValue, ...textareaProps } = props;
+    const { reveal, button } = useSecretToggle(props, { value: textareaProps.value, disabled: textareaProps.disabled });
+    const replacementShown = !reveal.revealed && maskedValue !== undefined;
+    /* Not a standard CSS property, so it is set here rather than left to a host stylesheet: a host
+       that forgot it would show the secret in clear text. pre-wrap keeps line breaks while masked. */
+    const masked = { ...style, ...{ WebkitTextSecurity: reveal.revealed || replacementShown ? 'none' : 'disc' }, whiteSpace: 'pre-wrap' };
+    return (_jsxs("span", { className: "jini-secret jini-secret--multiline", children: [_jsx("textarea", { ...textareaProps, ...(replacementShown ? { value: maskedValue, readOnly: true } : {}), spellCheck: false, ref: ref, style: masked }), button] }));
+});
+//# sourceMappingURL=SecretInput.js.map

package/dist/styles/lightbox.css

@@ -126,7 +126,7 @@
 }
 .jini-lightbox-button:hover:not(:disabled) { background: var(--jini-lightbox-button-bg-hover); border-color: var(--jini-lightbox-button-border-hover); }
 .jini-lightbox-button:focus-visible { outline: 2px solid var(--jini-lightbox-ink); outline-offset: 2px; }
-/* Same chip, only fainter: a host `button:disabled` fill (the Tovu admin's light `--surface-3`) would
+/* Same chip, only fainter: a host `button:disabled` fill (the host admin's light `--surface-3`) would
    otherwise turn the end-of-set arrow into a bright pressed-looking disc. */
 .jini-lightbox-button:disabled {
   opacity: 0.3;