@adecore/agents-react 0.31.12 → 0.32.0

package/dist/chat/visual-viewport.js

@@ -1,92 +1,103 @@
 import { visualViewportGeometry } from './logic/visual-viewport.js';
 /* Keeps one small frame in a full-height timeline row, without rendering React on scroll. */
 export class VisualViewportController {
-    box;
-    viewport;
-    scroller;
-    bridge;
-    observer;
-    attributes;
-    view;
-    frame = 0;
-    disposed = false;
-    last = '';
-    pendingDelta = 0;
-    onScroll;
-    constructor(box, viewport, scroller, bridge) {
-        this.box = box;
-        this.viewport = viewport;
-        this.scroller = scroller;
-        this.bridge = bridge;
-        this.view = box.ownerDocument.defaultView;
-        this.onScroll = () => this.refresh();
-        this.observer = new ResizeObserver(this.onScroll);
-        this.observer.observe(box);
-        this.observer.observe(scroller);
-        this.attributes = new MutationObserver(this.onScroll);
-        const row = box.closest('[data-index]');
-        if (row) {
-            this.attributes.observe(row, { attributes: true, attributeFilter: ['style'] });
-        }
-        scroller.addEventListener('scroll', this.onScroll, { passive: true });
-        this.refresh();
+  box;
+  viewport;
+  scroller;
+  bridge;
+  observer;
+  attributes;
+  view;
+  frame = 0;
+  disposed = false;
+  last = '';
+  pendingDelta = 0;
+  onScroll;
+  constructor(box, viewport, scroller, bridge) {
+    this.box = box;
+    this.viewport = viewport;
+    this.scroller = scroller;
+    this.bridge = bridge;
+    this.view = box.ownerDocument.defaultView;
+    this.onScroll = () => this.refresh();
+    this.observer = new ResizeObserver(this.onScroll);
+    this.observer.observe(box);
+    this.observer.observe(scroller);
+    this.attributes = new MutationObserver(this.onScroll);
+    const row = box.closest('[data-index]');
+    if (row) {
+      this.attributes.observe(row, {
+        attributes: true,
+        attributeFilter: ['style']
+      });
     }
-    refresh() {
-        if (this.disposed) {
-            return;
-        }
-        const top = this.offsetInScroller(this.scroller.getBoundingClientRect(), this.box.getBoundingClientRect());
-        const available = this.scroller.clientHeight;
-        const geometry = visualViewportGeometry(this.box.offsetHeight, available, top);
-        this.viewport.style.height = `${geometry.height}px`;
-        const key = `${geometry.top}:${geometry.height}`;
-        if (key !== this.last) {
-            this.last = key;
-            this.bridge.setViewport(geometry);
-        }
+    scroller.addEventListener('scroll', this.onScroll, {
+      passive: true
+    });
+    this.refresh();
+  }
+  refresh() {
+    if (this.disposed) {
+      return;
     }
-    scroll(request) {
-        const outer = this.scroller.getBoundingClientRect();
-        const box = this.box.getBoundingClientRect();
-        if (this.disposed || box.bottom <= outer.top || box.top >= outer.bottom) {
-            return;
-        }
-        if ('by' in request) {
-            this.pendingDelta += request.by;
-            this.schedule();
-            return;
-        }
-        this.pendingDelta = 0;
-        const start = this.scroller.scrollTop + this.offsetInScroller(outer, box);
-        const top = 'to' in request ? start + request.to : request.edge === 'start' ? 0 : this.scroller.scrollHeight;
-        this.scroller.scrollTo({ top, behavior: 'instant' });
-        this.refresh();
+    const top = this.offsetInScroller(this.scroller.getBoundingClientRect(), this.box.getBoundingClientRect());
+    const available = this.scroller.clientHeight;
+    const geometry = visualViewportGeometry(this.box.offsetHeight, available, top);
+    this.viewport.style.height = `${geometry.height}px`;
+    const key = `${geometry.top}:${geometry.height}`;
+    if (key !== this.last) {
+      this.last = key;
+      this.bridge.setViewport(geometry);
     }
-    dispose() {
-        this.disposed = true;
-        this.view.cancelAnimationFrame(this.frame);
-        this.observer.disconnect();
-        this.attributes.disconnect();
-        this.scroller.removeEventListener('scroll', this.onScroll);
-        this.bridge.setViewport(null);
+  }
+  scroll(request) {
+    const outer = this.scroller.getBoundingClientRect();
+    const box = this.box.getBoundingClientRect();
+    if (this.disposed || box.bottom <= outer.top || box.top >= outer.bottom) {
+      return;
     }
-    /* The box's top below the scroller's visible top, in the scroller's own pixels. */
-    offsetInScroller(outer, box) {
-        // A chat on a canvas can be scaled; messages inside its frame use unscaled CSS pixels.
-        const scale = outer.height / this.scroller.offsetHeight || 1;
-        return (box.top - outer.top) / scale - this.scroller.clientTop;
+    if ('by' in request) {
+      this.pendingDelta += request.by;
+      this.schedule();
+      return;
     }
-    schedule() {
-        if (this.frame || this.disposed) {
-            return;
-        }
-        this.frame = this.view.requestAnimationFrame(() => {
-            this.frame = 0;
-            if (this.pendingDelta !== 0) {
-                this.scroller.scrollBy({ top: this.pendingDelta, behavior: 'instant' });
-                this.pendingDelta = 0;
-            }
-            this.refresh();
-        });
+    this.pendingDelta = 0;
+    const start = this.scroller.scrollTop + this.offsetInScroller(outer, box);
+    const top = 'to' in request ? start + request.to : request.edge === 'start' ? 0 : this.scroller.scrollHeight;
+    this.scroller.scrollTo({
+      top,
+      behavior: 'instant'
+    });
+    this.refresh();
+  }
+  dispose() {
+    this.disposed = true;
+    this.view.cancelAnimationFrame(this.frame);
+    this.observer.disconnect();
+    this.attributes.disconnect();
+    this.scroller.removeEventListener('scroll', this.onScroll);
+    this.bridge.setViewport(null);
+  }
+  /* The box's top below the scroller's visible top, in the scroller's own pixels. */
+  offsetInScroller(outer, box) {
+    // A chat on a canvas can be scaled; messages inside its frame use unscaled CSS pixels.
+    const scale = outer.height / this.scroller.offsetHeight || 1;
+    return (box.top - outer.top) / scale - this.scroller.clientTop;
+  }
+  schedule() {
+    if (this.frame || this.disposed) {
+      return;
     }
-}
+    this.frame = this.view.requestAnimationFrame(() => {
+      this.frame = 0;
+      if (this.pendingDelta !== 0) {
+        this.scroller.scrollBy({
+          top: this.pendingDelta,
+          behavior: 'instant'
+        });
+        this.pendingDelta = 0;
+      }
+      this.refresh();
+    });
+  }
+}

package/dist/chat/visuals.js

@@ -1,8 +1,16 @@
 import { create } from 'zustand';
-export const useVisualDialog = create((set) => ({
+export const useVisualDialog = create(set => ({
+  chatKey: null,
+  visualId: null,
+  kind: null,
+  open: (chatKey, visualId, kind) => set({
+    chatKey,
+    visualId,
+    kind
+  }),
+  close: () => set({
     chatKey: null,
     visualId: null,
-    kind: null,
-    open: (chatKey, visualId, kind) => set({ chatKey, visualId, kind }),
-    close: () => set({ chatKey: null, visualId: null, kind: null })
-}));
+    kind: null
+  })
+}));

package/dist/host-hooks.d.ts

@@ -0,0 +1,29 @@
+import type { ProviderPlatform } from '@adecore/agent-contracts';
+import { type ChatHost, type CommandLook } from './host.js';
+export declare function useHostCodeMode(): 'light' | 'dark';
+export declare function useHostCodeThemes(): {
+    light: string;
+    dark: string;
+};
+export declare function useHostAttachmentUrl(...args: Parameters<ChatHost['attachments']['useUrl']>): ReturnType<ChatHost['attachments']['useUrl']>;
+export declare function useHostTasks(...args: Parameters<ChatHost['tasks']['useTasks']>): ReturnType<ChatHost['tasks']['useTasks']>;
+export declare function useHostTask(...args: Parameters<ChatHost['tasks']['useTask']>): ReturnType<ChatHost['tasks']['useTask']>;
+export declare function useHostExtraPrompts(...args: Parameters<ChatHost['prompts']['useExtra']>): ReturnType<ChatHost['prompts']['useExtra']>;
+export declare function useHostStreaming(): ReturnType<ChatHost['useStreaming']>;
+export declare function useHostSendDelivery(): ReturnType<ChatHost['useSendDelivery']>;
+export declare function useHostTimelineFind(...args: Parameters<ChatHost['useTimelineFind']>): ReturnType<ChatHost['useTimelineFind']>;
+export declare function useHostReferableChats(): ReturnType<ChatHost['useReferableChats']>;
+export declare function useHostLoginBlocked(...args: Parameters<ChatHost['useLoginBlocked']>): ReturnType<ChatHost['useLoginBlocked']>;
+export declare function useHostMachinePlatform(scopeId: string): ProviderPlatform | null;
+export declare function useHostProjectLook(...args: Parameters<ChatHost['useProjectLook']>): ReturnType<ChatHost['useProjectLook']>;
+export declare function useHostMachineLabel(...args: Parameters<ChatHost['useMachineLabel']>): ReturnType<ChatHost['useMachineLabel']>;
+export declare function useHostChatPlace(...args: Parameters<ChatHost['useChatPlace']>): ReturnType<ChatHost['useChatPlace']>;
+export declare function useHostContextSources(...args: Parameters<ChatHost['useContextSources']>): ReturnType<ChatHost['useContextSources']>;
+export declare function useHostHidesFolder(...args: Parameters<ChatHost['useHidesFolder']>): ReturnType<ChatHost['useHidesFolder']>;
+export declare function useHostWelcome(...args: Parameters<ChatHost['useWelcome']>): ReturnType<ChatHost['useWelcome']>;
+export declare function useHostResumeAtReset(...args: Parameters<ChatHost['useResumeAtReset']>): ReturnType<ChatHost['useResumeAtReset']>;
+export declare function useHostComposerPlaceholder(...args: Parameters<ChatHost['useComposerPlaceholder']>): ReturnType<ChatHost['useComposerPlaceholder']>;
+export declare function useHostThreadCards(...args: Parameters<ChatHost['useThreadCards']>): ReturnType<ChatHost['useThreadCards']>;
+export declare function useHostReplyAuthor(...args: Parameters<ChatHost['useReplyAuthor']>): ReturnType<ChatHost['useReplyAuthor']>;
+export declare function useHostMapSource(maps: NonNullable<ChatHost['maps']>, scopeId: string): ReturnType<NonNullable<ChatHost['maps']>['useSource']>;
+export declare function useCommandNames(look: Required<Pick<CommandLook, 'useNames'>>, scopeId: string, chatId: string): ReturnType<NonNullable<CommandLook['useNames']>>;

package/dist/host-hooks.js

@@ -0,0 +1,78 @@
+'use no memo';
+
+import { useChatHost } from './host.js';
+export function useHostCodeMode() {
+  return useChatHost().code.useMode();
+}
+export function useHostCodeThemes() {
+  return useChatHost().code.useThemes();
+}
+export function useHostAttachmentUrl(...args) {
+  return useChatHost().attachments.useUrl(...args);
+}
+export function useHostTasks(...args) {
+  return useChatHost().tasks.useTasks(...args);
+}
+export function useHostTask(...args) {
+  return useChatHost().tasks.useTask(...args);
+}
+export function useHostExtraPrompts(...args) {
+  return useChatHost().prompts.useExtra(...args);
+}
+export function useHostStreaming() {
+  return useChatHost().useStreaming();
+}
+export function useHostSendDelivery() {
+  return useChatHost().useSendDelivery();
+}
+export function useHostTimelineFind(...args) {
+  return useChatHost().useTimelineFind(...args);
+}
+export function useHostReferableChats() {
+  return useChatHost().useReferableChats();
+}
+export function useHostLoginBlocked(...args) {
+  return useChatHost().useLoginBlocked(...args);
+}
+const noPlatform = () => null;
+/* Null where the host does not say, as it need not. */
+export function useHostMachinePlatform(scopeId) {
+  const useMachinePlatform = useChatHost().useMachinePlatform ?? noPlatform;
+  return useMachinePlatform(scopeId);
+}
+export function useHostProjectLook(...args) {
+  return useChatHost().useProjectLook(...args);
+}
+export function useHostMachineLabel(...args) {
+  return useChatHost().useMachineLabel(...args);
+}
+export function useHostChatPlace(...args) {
+  return useChatHost().useChatPlace(...args);
+}
+export function useHostContextSources(...args) {
+  return useChatHost().useContextSources(...args);
+}
+export function useHostHidesFolder(...args) {
+  return useChatHost().useHidesFolder(...args);
+}
+export function useHostWelcome(...args) {
+  return useChatHost().useWelcome(...args);
+}
+export function useHostResumeAtReset(...args) {
+  return useChatHost().useResumeAtReset(...args);
+}
+export function useHostComposerPlaceholder(...args) {
+  return useChatHost().useComposerPlaceholder(...args);
+}
+export function useHostThreadCards(...args) {
+  return useChatHost().useThreadCards(...args);
+}
+export function useHostReplyAuthor(...args) {
+  return useChatHost().useReplyAuthor(...args);
+}
+export function useHostMapSource(maps, scopeId) {
+  return maps.useSource(scopeId);
+}
+export function useCommandNames(look, scopeId, chatId) {
+  return look.useNames(scopeId, chatId);
+}

package/dist/host.js

@@ -1,51 +1,92 @@
+import { c as _c } from "react/compiler-runtime";
 import { createContext, createElement, useContext, useState } from 'react';
 import { isApplePlatform } from '@adecore/ui';
 import { PlainTextarea } from './ui/PlainTextarea.js';
 const NO_PROMPTS = [];
 const NO_CHATS = [];
 const NO_ROWS = [];
-const NO_FIND = { open: false, bar: null, reveal: null, hitRows: NO_ROWS, currentRow: null };
+const NO_FIND = {
+  open: false,
+  bar: null,
+  reveal: null,
+  hitRows: NO_ROWS,
+  currentRow: null
+};
 const NO_SOURCES = [];
-const NO_URL = { url: null, failure: null };
-const NOWHERE = { title: null, go: () => undefined };
+const NO_URL = {
+  url: null,
+  failure: null
+};
+const NOWHERE = {
+  title: null,
+  go: () => undefined
+};
 const NO_CARDS = [];
 const DEFAULT_HOST = {
-    accents: { all: [], featured: [], label: (id) => id, current: () => '' },
-    isApplePlatform,
-    isAppShortcut: () => false,
-    notify: () => undefined,
-    actions: null,
-    searchFiles: null,
-    attachments: { useUrl: () => NO_URL, read: () => Promise.reject(new Error('This app keeps no attached files')) },
-    ReadImage: null,
-    code: { useMode: () => 'light', useThemes: () => ({ light: 'github-light', dark: 'github-dark' }), custom: [] },
-    useStreaming: () => 'words',
-    useSendDelivery: () => 'queue',
-    fileLinks: null,
-    useTimelineFind: () => NO_FIND,
-    dictation: { Textarea: PlainTextarea, composer: null },
-    prompts: { useExtra: () => NO_PROMPTS, render: () => null, answer: () => Promise.reject(new Error('This app raises no prompts of its own')) },
-    useReferableChats: () => NO_CHATS,
-    openLogin: null,
-    useLoginBlocked: () => null,
-    useProjectLook: () => null,
-    useMachineLabel: () => null,
-    useChatPlace: () => NOWHERE,
-    useContextSources: () => NO_SOURCES,
-    useHidesFolder: () => false,
-    useWelcome: () => false,
-    tasks: { useTasks: () => undefined, useTask: () => null },
-    confirm: { stopSubagents: (_scopeId, _chatId, run) => run(), stopTask: (_scopeId, _childId, _title, run) => run() },
-    fork: null,
-    openNewChat: null,
-    openSettings: () => undefined,
-    useResumeAtReset: () => true,
-    useComposerPlaceholder: () => null,
-    ComposerSlot: null,
-    SubagentSlot: null,
-    useThreadCards: () => NO_CARDS,
-    useReplyAuthor: () => null,
-    visuals: null
+  accents: {
+    all: [],
+    featured: [],
+    label: id => id,
+    current: () => ''
+  },
+  isApplePlatform,
+  isAppShortcut: () => false,
+  notify: () => undefined,
+  actions: null,
+  searchFiles: null,
+  attachments: {
+    useUrl: () => NO_URL,
+    read: () => Promise.reject(new Error('This app keeps no attached files'))
+  },
+  ReadImage: null,
+  code: {
+    useMode: () => 'light',
+    useThemes: () => ({
+      light: 'github-light',
+      dark: 'github-dark'
+    }),
+    custom: []
+  },
+  useStreaming: () => 'words',
+  useSendDelivery: () => 'queue',
+  fileLinks: null,
+  useTimelineFind: () => NO_FIND,
+  dictation: {
+    Textarea: PlainTextarea,
+    composer: null
+  },
+  prompts: {
+    useExtra: () => NO_PROMPTS,
+    render: () => null,
+    answer: () => Promise.reject(new Error('This app raises no prompts of its own'))
+  },
+  useReferableChats: () => NO_CHATS,
+  openLogin: null,
+  useLoginBlocked: () => null,
+  useProjectLook: () => null,
+  useMachineLabel: () => null,
+  useChatPlace: () => NOWHERE,
+  useContextSources: () => NO_SOURCES,
+  useHidesFolder: () => false,
+  useWelcome: () => false,
+  tasks: {
+    useTasks: () => undefined,
+    useTask: () => null
+  },
+  confirm: {
+    stopSubagents: (_scopeId, _chatId, run) => run(),
+    stopTask: (_scopeId, _childId, _title, run) => run()
+  },
+  fork: null,
+  openNewChat: null,
+  openSettings: () => undefined,
+  useResumeAtReset: () => true,
+  useComposerPlaceholder: () => null,
+  ComposerSlot: null,
+  SubagentSlot: null,
+  useThreadCards: () => NO_CARDS,
+  useReplyAuthor: () => null,
+  visuals: null
 };
 const ChatHostContext = createContext(DEFAULT_HOST);
 /*
@@ -55,15 +96,46 @@ const ChatHostContext = createContext(DEFAULT_HOST);
  * The host is read once, as the provider mounts, since a hook that changed under a mounted view would
  * break the order of its hooks: a provider that gets another `host` throws, and a new `key` remounts it.
  */
-export function ChatHostProvider({ host, children }) {
-    const parent = useContext(ChatHostContext);
-    const [pinned] = useState(() => ({ host, value: { ...parent, ...host } }));
-    if (pinned.host !== host) {
-        throw new Error('A ChatHostProvider reads its host once: hand it the same object on every render, or a new key to mount it with another');
-    }
-    return createElement(ChatHostContext.Provider, { value: pinned.value }, children);
+export function ChatHostProvider(t0) {
+  const $ = _c(6);
+  const {
+    host,
+    children
+  } = t0;
+  const parent = useContext(ChatHostContext);
+  let t1;
+  if ($[0] !== host || $[1] !== parent) {
+    t1 = () => ({
+      host,
+      value: {
+        ...parent,
+        ...host
+      }
+    });
+    $[0] = host;
+    $[1] = parent;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  const [pinned] = useState(t1);
+  if (pinned.host !== host) {
+    throw new Error("A ChatHostProvider reads its host once: hand it the same object on every render, or a new key to mount it with another");
+  }
+  let t2;
+  if ($[3] !== children || $[4] !== pinned.value) {
+    t2 = createElement(ChatHostContext.Provider, {
+      value: pinned.value
+    }, children);
+    $[3] = children;
+    $[4] = pinned.value;
+    $[5] = t2;
+  } else {
+    t2 = $[5];
+  }
+  return t2;
 }
 /* The host of the nearest `ChatHostProvider`, or the defaults outside one. */
 export function useChatHost() {
-    return useContext(ChatHostContext);
-}
+  return useContext(ChatHostContext);
+}

package/dist/index.js

@@ -7,4 +7,4 @@ export { configureAgentMarks } from './agents/agent-marks.js';
 export { configureChatStorage } from './storage.js';
 export { setLazyPrefetch, onLazyOpenError } from './lazy.js';
 export { MountedRegistry } from './mounted-registry.js';
-export { PROVIDERS_SECTION, USAGE_SECTION, settingsSection } from './settings/sections.js';
+export { PROVIDERS_SECTION, USAGE_SECTION, settingsSection } from './settings/sections.js';

package/dist/lazy.js

@@ -1,6 +1,6 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 import { lazy } from 'react';
 import { LoadedComponent } from '@adecore/ui';
+import { jsx as _jsx } from "react/jsx-runtime";
 const loaders = [];
 let register = null;
 const openErrorListeners = new Set();
@@ -9,20 +9,20 @@ const openErrorListeners = new Set();
  * one made from now on. Without it they load on their first render, as `React.lazy` does.
  */
 export function setLazyPrefetch(next) {
-    register = next;
-    for (const load of loaders) {
-        next(load);
-    }
+  register = next;
+  for (const load of loaders) {
+    next(load);
+  }
 }
 /*
  * Tells `listener` when a module the chat loads for a render fails to load, the way `onLazyOpenError`
  * of `@adecore/ui` does for the app's own. A failed prefetch never reaches it.
  */
 export function onLazyOpenError(listener) {
-    openErrorListeners.add(listener);
-    return () => {
-        openErrorListeners.delete(listener);
-    };
+  openErrorListeners.add(listener);
+  return () => {
+    openErrorListeners.delete(listener);
+  };
 }
 /*
  * `React.lazy` for a module that exports its component by name, `default` included. Once the module
@@ -30,28 +30,34 @@ export function onLazyOpenError(listener) {
  * module the prefetcher already fetched.
  */
 export function lazyNamed(load, name, options) {
-    // Through `LoadedComponent`, so a `LazyBoundary` around it draws the moment the module lands.
-    const loaded = new LoadedComponent(async () => (await load())[name]);
-    const open = () => loaded.load();
-    if (options?.prefetch !== false) {
-        loaders.push(open);
-        register?.(open);
+  // Through `LoadedComponent`, so a `LazyBoundary` around it draws the moment the module lands.
+  const loaded = new LoadedComponent(async () => (await load())[name]);
+  const open = () => loaded.load();
+  if (options?.prefetch !== false) {
+    loaders.push(open);
+    register?.(open);
+  }
+  // Only a render loads through here; a prefetch calls `open` itself, so its failures report nothing.
+  const Lazy = lazy(async () => {
+    try {
+      return {
+        default: await open()
+      };
+    } catch (error) {
+      for (const listener of openErrorListeners) {
+        listener(error);
+      }
+      throw error;
     }
-    // Only a render loads through here; a prefetch calls `open` itself, so its failures report nothing.
-    const Lazy = lazy(async () => {
-        try {
-            return { default: await open() };
-        }
-        catch (error) {
-            for (const listener of openErrorListeners) {
-                listener(error);
-            }
-            throw error;
-        }
+  });
+  const LazyNamed = props => {
+    // `loaded` fills in place; compiled, the element drawn before the module landed would stay.
+    'use no memo';
+
+    const Component = loaded.current ?? Lazy;
+    return /*#__PURE__*/_jsx(Component, {
+      ...props
     });
-    const LazyNamed = (props) => {
-        const Component = loaded.current ?? Lazy;
-        return _jsx(Component, { ...props });
-    };
-    return LazyNamed;
-}
+  };
+  return LazyNamed;
+}

package/dist/locales/en/agent-chat.d.ts

@@ -48,6 +48,10 @@ declare const _default: {
         carried: string;
         keep: string;
         compact: string;
+        cacheExpired: {
+            title: string;
+            carried: string;
+        };
     };
     goal: {
         status: {
@@ -305,6 +309,10 @@ declare const _default: {
             anyCli: string;
         };
         notice: {
+            effort: string;
+            effortHighest: string;
+            effortLowest: string;
+            noEffort: string;
             clearFailed: string;
             stashChatsDropped_one: string;
             stashChatsDropped_other: string;
@@ -444,6 +452,8 @@ declare const _default: {
             requires: string;
             requiresHere: string;
             providerSettings: string;
+            star: string;
+            unstar: string;
         };
         stash: {
             title: string;
@@ -685,6 +695,30 @@ declare const _default: {
             };
         };
     };
+    modelOptions: {
+        effort: {
+            label: string;
+            choices: {
+                low: string;
+                medium: string;
+                high: string;
+                xhigh: string;
+                max: string;
+            };
+        };
+        contextWindow: {
+            label: string;
+        };
+        fastMode: {
+            label: string;
+        };
+        thinking: {
+            label: string;
+        };
+        serviceTier: {
+            label: string;
+        };
+    };
     readingWidth: {
         label: string;
         narrow: {