@k2b/ui 0.21.0 → 0.23.0

package/dist/types/intl/messages.d.ts

@@ -1,628 +1,87 @@
+/** Common control chrome and date basics; specialized strings live beside their component families. */
 declare const uiMessages: import("@k2b/stdlib").Catalog<{
-    chartView: string;
-    chartDiagram: string;
-    chartData: string;
-    chartSeries: string;
-    chartOnly: string;
-    chartShowAll: string;
-    chartShowing: string;
-    chartSelectedDatum: string;
-    chartReference: string;
-    chartCurrent: string;
-    chartPinReference: string;
-    chartRemoveComparison: string;
-    chartPreviousData: string;
-    chartCopyData: string;
-    chartCopyFailed: string;
     actions: string;
     add: string;
-    addTag: string;
-    addImage: string;
     apply: string;
-    attachments: string;
-    assistant: string;
-    avatarLabel: ({ name }: {
-        name: string;
-    }) => string;
     all: string;
     calendar: string;
     clear: string;
     clearDate: string;
     clearSelection: string;
-    chooseOption: string;
     close: string;
     closeDialog: string;
     copied: string;
-    infoBlockNote: string;
-    infoBlockInfo: string;
-    infoBlockSuccess: string;
-    infoBlockWarning: string;
-    infoBlockDanger: string;
-    referencePdf: string;
-    referenceImage: string;
-    referenceDesign: string;
-    referenceFile: string;
-    referenceNote: string;
-    referenceHeading: string;
-    referenceTask: string;
-    referencePage: string;
     copy: string;
-    closeLightbox: string;
     couldNotLoadData: string;
-    couldNotDisplayContent: string;
     datePicker: string;
-    dataTable: string;
     datePresets: string;
-    decreaseValue: string;
     download: string;
-    downloadAsZip: string;
-    downloadImage: string;
-    dropFiles: string;
-    dropToUpload: string;
     dropdownMenu: string;
     durationPresets: string;
-    filterOptions: string;
-    fileTypeNotAccepted: string;
-    fileDropDropped: ({ count }: {
-        count: number;
-    }) => string;
-    fileDropDroppedOne: ({ name }: {
-        name: string;
-    }) => string;
-    fileDropMore: ({ count }: {
-        count: number;
-    }) => string;
-    fileDropRejectedType: ({ names }: {
-        names: string;
-    }) => string;
-    fileDropRejectedSize: ({ names, limit }: {
-        names: string;
-        limit: string;
-    }) => string;
-    fileDropRejectedCount: ({ names, max }: {
-        names: string;
-        max: number;
-    }) => string;
-    imageLightbox: string;
-    imageNavigation: string;
-    increaseValue: string;
     loading: string;
-    hidePassword: string;
-    noColumns: string;
     noData: string;
-    viewRaw: string;
-    viewFormatted: string;
-    noRecords: string;
-    noTagsYet: string;
-    noResultsFound: string;
-    nextImage: string;
-    noOptions: string;
-    optionsCouldNotLoad: string;
     noResults: string;
     nothingHere: string;
     nothingToShow: string;
     no: string;
     options: string;
-    pagination: string;
-    pageOf: ({ page, total }: {
-        page: number;
-        total: number;
-    }) => string;
     pickDate: string;
-    previousImage: string;
     previousMonth: string;
-    previousPage: string;
     previousYear: string;
     nextMonth: string;
-    nextPage: string;
     nextYear: string;
-    goToPage: ({ page }: {
-        page: number;
-    }) => string;
     retry: string;
-    refreshing: string;
     reset: string;
     required: string;
-    minCharacters: ({ count }: {
-        count: number;
-    }) => string;
-    maxCharacters: ({ count }: {
-        count: number;
-    }) => string;
-    minTags: ({ count }: {
-        count: number;
-    }) => string;
-    maxTags: ({ count }: {
-        count: number;
-    }) => string;
-    rename: string;
     delete: string;
     remove: string;
-    removeTag: string;
     search: string;
     searchLabel: string;
-    spotlightNoResults: string;
-    searchFailed: string;
     searchResults: string;
     save: string;
-    saveShortcut: string;
-    sectionsLabel: ({ title }: {
-        title: string;
-    }) => string;
-    searchOptions: string;
     select: string;
-    selectMatchingOption: string;
-    selectOption: string;
-    suggestions: string;
-    suggestionsCouldNotLoad: string;
-    showPassword: string;
     time: string;
     timeLabel: ({ label }: {
         label: string;
     }) => string;
-    completionSuggestions: string;
     contextMenu: string;
-    unknownUser: string;
-    uploading: string;
-    chooseFile: string;
-    chooseFiles: string;
-    chooseMatchingFile: string;
-    checkingOptions: string;
-    checkingOptionsLoading: string;
-    noMatchingOption: string;
-    noOptionsFound: string;
-    typeToSearch: string;
-    showGridView: string;
-    showListView: string;
     start: string;
     end: string;
-    addFileFolderUpload: string;
-    addPane: string;
-    addToChat: string;
-    attachFiles: string;
-    addGuidance: string;
-    calendarView: string;
-    openDate: ({ label }: {
-        label: string;
-    }) => string;
-    createEventOn: ({ label }: {
-        label: string;
-    }) => string;
-    hiddenOverlappingEvents: ({ count }: {
-        count: number;
-    }) => string;
-    calendarEventTime: ({ title, start, end }: {
-        title: string;
-        start: string;
-        end: string;
-    }) => string;
-    timeline: string;
-    timelineHint: string;
-    timelineTimeRange: ({ start, end }: {
-        start: string;
-        end: string;
-    }) => string;
-    timelineDone: string;
-    timelineOpen: string;
-    timelineNight: ({ start, end }: {
-        start: string;
-        end: string;
-    }) => string;
-    timelineNothingPlanned: string;
-    timelineFree: ({ duration }: {
-        duration: string;
-    }) => string;
-    timelineMore: ({ count }: {
-        count: number;
-    }) => string;
-    timelineNow: ({ time }: {
-        time: string;
-    }) => string;
     today: string;
     todayDate: ({ date }: {
         date: string;
     }) => string;
     day: string;
     week: string;
-    weekShort: string;
     month: string;
     year: string;
     allDay: string;
-    noEvents: string;
     previous: string;
     next: string;
-    moveEvent: string;
-    resizeEvent: string;
     cancel: string;
-    chat: string;
-    chooseModel: string;
-    closeWindow: string;
     code: string;
-    codeLabel: ({ title }: {
-        title: string;
-    }) => string;
-    column: ({ number }: {
-        number: number;
-    }) => string;
-    commands: string;
-    dropFilesToAttach: string;
-    conversation: string;
-    jumpToLatest: string;
-    feedJumpToLatest: string;
-    feedJumpToLatestCount: ({ count }: {
-        count: number;
-    }) => string;
-    feedNewItems: ({ count }: {
-        count: number;
-    }) => string;
-    feedNewMarker: string;
-    messageSent: string;
-    messageNotSent: string;
-    messageRetry: string;
-    messageShowMore: string;
-    messageShowLess: string;
-    messageReplyTo: string;
-    messageForwarded: string;
-    messageEdited: string;
-    messageDeleted: string;
-    messageVideo: string;
-    messageMoreAttachments: ({ count }: {
-        count: number;
-    }) => string;
-    messageReactions: string;
-    messageReaction: ({ emoji, count, names, own }: {
-        emoji: string;
-        count: number;
-        names?: string;
-        own?: boolean;
-    }) => string;
-    messageAddReaction: string;
-    messageReplies: ({ count }: {
-        count: number;
-    }) => string;
-    messageLastReply: ({ time }: {
-        time: string;
-    }) => string;
-    messageStop: string;
-    resourceUntitled: string;
-    resourceNoAccess: string;
-    resourceDeleted: string;
-    resourceUnavailable: string;
-    conversationMessages: ({ label }: {
-        label: string;
-    }) => string;
-    dialogTabs: string;
-    files: string;
-    chooseFileToPreview: string;
     change: string;
-    changeImage: string;
-    cropArea: string;
-    cropPreview: string;
-    discardChanges: string;
-    discardUnsavedFile: string;
-    downloadFailed: string;
-    failedLoadFiles: string;
-    failedLoadImage: string;
-    folderEmpty: string;
-    folderSelected: string;
-    newFile: string;
-    newFileName: string;
-    newFolder: string;
-    newFolderName: string;
-    fileActions: string;
-    actionsFor: ({ name }: {
-        name: string;
-    }) => string;
-    fileSaved: string;
-    pickFileFromTree: string;
-    imageProcessingFailed: string;
-    preparingImage: string;
-    processingImage: string;
-    removeImage: string;
-    rotateRight: string;
-    selectedImage: string;
-    selectFile: string;
-    spaceEmpty: string;
-    uploadFiles: string;
-    filterIcons: string;
-    loadEarlier: string;
-    loadingConversation: string;
-    loadingFiles: string;
-    loadingMessages: string;
-    failed: string;
-    generating: string;
-    loadOlderMessages: string;
-    loadingOlderMessages: string;
-    couldNotLoadOlderMessages: string;
-    couldNotLoadEarlierMessages: string;
-    couldNotPostMessage: string;
     message: string;
-    messageActions: string;
-    messageComposer: string;
-    messageInput: string;
-    confirmation: string;
-    typeToConfirm: ({ phrase }: {
-        phrase: string;
-    }) => string;
-    confirm: string;
     dialog: string;
-    discard: string;
     error: string;
-    form: string;
-    filterActions: string;
     info: string;
-    dismissNotification: string;
-    notifications: string;
-    interactiveLineChart: string;
-    interactiveChart: string;
-    chartFields: ({ key }: {
-        key: string;
-    }) => string;
-    interactiveMap: string;
-    interactiveTimeline: string;
     ok: string;
     success: string;
-    model: string;
-    input: string;
-    output: string;
-    loopTotal: string;
-    remaining: string;
-    notConfigured: string;
     unknown: string;
-    system: string;
-    tool: string;
-    user: string;
-    useColor: string;
-    useTransparent: string;
-    series: string;
-    waiting: string;
-    templateEditorPlaceholder: string;
-    templatePreview: string;
-    lastRequestContext: string;
-    contextWindowUsed: string;
-    contextWindow: string;
-    contextUsageUnavailable: string;
-    contextUsageUnavailableWithWindow: ({ window }: {
-        window: string;
-    }) => string;
-    tokensUsed: ({ total }: {
-        total: string;
-    }) => string;
-    tokensUsedPercent: ({ total, percent }: {
-        total: string;
-        percent: number;
-    }) => string;
-    moveDown: string;
-    moveUp: string;
-    moveNamedDown: ({ label }: {
-        label: string;
-    }) => string;
-    moveNamedUp: ({ label }: {
-        label: string;
-    }) => string;
-    rowAction: string;
-    sidebarUnread: ({ count }: {
-        count: number;
-    }) => string;
-    sidebarUnreadMany: string;
-    sidebarNewActivity: string;
-    sidebarMentioned: string;
-    sidebarMuted: string;
-    addToNamed: ({ name }: {
-        name: string;
-    }) => string;
-    insertBeforeNamed: ({ name }: {
-        name: string;
-    }) => string;
-    insertAtEnd: string;
-    addPaneSide: ({ side, name }: {
-        side: "left" | "right" | "top" | "bottom";
-        name: string;
-    }) => string;
-    discardUnsavedChanges: string;
-    unsavedChangesTitle: string;
-    tagName: string;
     name: string;
     color: string;
-    tagCouldNotBeSaved: string;
-    tagActionFailed: string;
-    tagsPlaceholder: string;
-    tagsAdded: ({ tags }: {
-        tags: string;
-    }) => string;
-    tagsRemoved: ({ tags }: {
-        tags: string;
-    }) => string;
-    noFiles: string;
-    noLogEntries: string;
-    noPreview: string;
-    openPreview: string;
-    paneTabs: string;
-    paneWorkspace: string;
-    pdfPreview: string;
-    pdfPreviewHttpError: ({ status }: {
-        status: number;
-    }) => string;
-    pdfPreviewTabBlocked: string;
-    pdfPreviewNoViewer: string;
-    pdfPreviewNoViewerDescription: string;
-    pdfPreviewRendering: string;
-    pickIcon: string;
-    postMessage: string;
     preview: string;
-    previewPdf: string;
-    renderPdfPreview: string;
-    queueMessage: string;
-    queueing: string;
-    sending: string;
-    steering: string;
-    writeMessage: string;
-    writeConversationMessage: string;
-    composerFormatting: string;
-    insertEmoji: string;
-    emojiSuggestions: string;
-    dictate: string;
-    dictateOrHold: string;
-    stopDictation: string;
-    microphoneOptions: string;
-    recordVoiceMessage: string;
-    dictationListening: string;
-    dictationRefining: string;
-    dictationRefined: string;
-    dictationUnrefined: string;
-    dictationInterrupted: string;
-    restoreOriginal: string;
-    openInNewTab: ({ name }: {
-        name: string;
-    }) => string;
     closeNamed: ({ name }: {
         name: string;
     }) => string;
-    goToImage: ({ index }: {
-        index: number;
-    }) => string;
-    pinDigit: ({ index, total }: {
-        index: number;
-        total: number;
-    }) => string;
-    moreSelected: ({ count }: {
-        count: number;
-    }) => string;
-    removeNamed: ({ name }: {
-        name: string;
-    }) => string;
-    resizeCrop: ({ handle }: {
-        handle: string;
-    }) => string;
     range: string;
-    resizePanes: string;
-    resizeNavigation: string;
-    resizeWorkspacePane: string;
-    resizeDetailPanel: string;
-    resizeBottomDrawer: string;
-    resetMapView: string;
-    resetTimelineView: string;
-    retryOlderMessages: string;
-    saveChanges: string;
-    saving: string;
-    sendMessage: string;
-    startConversation: string;
-    steerResponse: string;
-    stopResponse: string;
-    stopping: string;
-    unsaved: string;
-    unsavedChangeLabel: ({ count }: {
-        count: number;
-    }) => string;
-    noUnsavedChanges: string;
-    moveWindow: ({ title }: {
-        title: string;
-    }) => string;
-    resizeWindow: string;
-    window: string;
-    zoomIn: string;
-    zoomOut: string;
-    resetZoom: string;
-    openFullscreen: string;
-    zoomPanKeys: string;
-    binaryFile: string;
-    boldShortcut: string;
-    bulletListShortcut: string;
-    heading1Shortcut: string;
-    heading2Shortcut: string;
-    heading3Shortcut: string;
-    inlineCodeShortcut: string;
-    italicShortcut: string;
-    linkShortcut: string;
-    markdownFormatting: string;
-    editorLines: ({ count, value }: {
-        count: number;
-        value: string;
-    }) => string;
-    editorWords: ({ count, value }: {
-        count: number;
-        value: string;
-    }) => string;
-    editorCharacters: ({ count, value }: {
-        count: number;
-        value: string;
-    }) => string;
-    numberedListShortcut: string;
-    quote: string;
-    csvSettings: string;
-    csvEncoding: string;
-    csvSeparator: string;
-    csvDefaultSeparator: string;
-    csvComma: string;
-    csvSemicolon: string;
-    csvTab: string;
-    csvView: string;
-    csvRaw: string;
-    delimitedFileEmpty: string;
     edit: string;
-    emptyFile: string;
-    failedLoadFile: string;
-    noInlinePreview: string;
-    previewMoreLines: (n: number) => string;
-    previewColumnsLimited: string;
-    textEditor: string;
-    audioUnsupported: string;
-    videoUnsupported: string;
-    videoCannotPlay: string;
-    videoCannotPlayDescription: string;
     yes: string;
-    installApp: string;
-    installNative: ({ appName }: {
-        appName: string;
-    }) => string;
-    installRequested: string;
-    installFailed: string;
-    installOpenShare: string;
-    installOpenShareDetail: string;
-    installHomeScreen: string;
-    installHomeScreenDetail: string;
-    installConfirmAdd: string;
-    installConfirmAddDetail: string;
-    installOpenShareBrowserDetail: string;
-    installSafariFallback: string;
-    installSafariMenu: string;
-    installSafariMenuDetail: string;
-    installAddDock: string;
-    installAddDockDetail: string;
-    installBrowserMenu: string;
-    installBrowserMenuDetail: string;
-    installAndroidDetail: string;
-    installBrowserDetail: string;
-    installUnavailable: string;
-    installAppleInAppTitle: string;
-    installAppleInAppDetail: ({ appName }: {
-        appName: string;
-    }) => string;
-    installInAppTitle: string;
-    installInAppDetail: ({ appName }: {
-        appName: string;
-    }) => string;
-    installAppleBrowserTitle: string;
-    installAppleBrowserDetail: string;
-    installAndroidBrowserTitle: string;
-    installAndroidBrowserDetail: string;
-    installSamsungTitle: string;
-    installSamsungDetail: ({ appName }: {
-        appName: string;
-    }) => string;
-    installOpenChrome: string;
-    installCopyLink: string;
-    installLinkCopied: string;
-    installCopyFailed: string;
-    qrCameraPreview: string;
-    qrCameraStarting: string;
-    qrCameraInstructions: string;
-    qrCameraPrivacy: string;
 }>;
 export type UiMessages = ReturnType<(typeof uiMessages)["resolve"]>["t"];
-/** Generic component chrome owned by @k2b/ui, resolved from the inherited render locale. */
+/** Resolved from the inherited render locale. */
 export declare const useUiMessages: () => (() => UiMessages);
-/** Browser-only imperative UI (for example prompts) inherits the document locale. */
+/** Imperative UI inherits the document locale when no locale is supplied. */
 export declare const resolveUiMessages: (locale?: string) => UiMessages;
 export declare const checkUiMessages: () => import("@k2b/stdlib").CatalogIssue[];
 export {};

package/dist/types/layout/AppWorkspace.d.ts

@@ -5,8 +5,10 @@ import type { ScrollAreaProps } from "./ScrollArea";
 export type AppWorkspaceProps = {
     children: JSX.Element;
     class?: string;
-    /** A host with its own mobile chrome can use the full canvas below 1024px. */
+    /** A host with its own phone chrome can use the full canvas below 48rem (768 px). */
     mobileSurface?: "contained" | "flush";
+    /** Draws no frame: no border, corner radius, or shadow, for an overview that is the page itself. */
+    flat?: boolean;
     resizable?: boolean;
     /**
      * Restores a persisted layout when the workspace mounts. Persistence itself
@@ -68,6 +70,23 @@ export type AppWorkspaceDetailProps = {
     resizable?: boolean;
     minWidth?: number;
     maxWidth?: number;
+    /**
+     * Closes the panel: Escape, a swipe on a touch screen, and dragging the
+     * phone sheet down call it. A panel rendered on the server only marks its
+     * own close button or link with `data-workspace-detail-close` instead, and
+     * those gestures click it. Without either, they leave the panel open, and on
+     * a touch tablet in portrait the panel makes room beside `Main` instead of
+     * overlaying it as a drawer.
+     */
+    onClose?: () => void;
+    /**
+     * Shows the previous (`-1`) or next (`1`) item; J and K call it while the
+     * panel is open. Return the Main element that now shows the selection,
+     * usually its link: Escape and F6 then go there, and the workspace reveals
+     * it beside the panel or above the phone sheet. Returning nothing keeps the
+     * previous item.
+     */
+    onStep?: (direction: 1 | -1) => HTMLElement | null | undefined | void;
 };
 export type AppWorkspaceBottomDrawerHeight = "sm" | "md" | "lg";
 export type AppWorkspaceBottomDrawerProps = {
@@ -88,9 +107,11 @@ export type AppWorkspaceSidebarProps = {
     children: JSX.Element;
     class?: string;
     /**
-     * Below the desktop breakpoint the sidebar is hidden and the host's mobile
-     * navigation takes over. `"stacked"` keeps it as a block above the content
-     * instead, for overviews whose sidebar is the primary object list.
+     * Below 48rem (768 px) the sidebar is hidden and the host's mobile
+     * navigation takes over; from 48 to 64rem it is an overlay that a button in
+     * the workspace's head opens. `"stacked"` keeps it as a block above the
+     * content below 64rem instead, for overviews whose sidebar is the primary
+     * object list.
      */
     mobile?: "hidden" | "stacked";
     resizable?: boolean;
@@ -163,7 +184,12 @@ export type AppWorkspaceSidebarItemProps = {
     scroll?: NavigationScrollMode;
     onNavigate?: (event: LinkNavigateEvent) => void | Promise<void>;
     onClick?: (event: MouseEvent) => void;
-    active?: boolean;
+    /**
+     * Marks the current page (`aria-current="page"`). On a page deeper than the
+     * sidebar lists, pass `"ancestor"` for the item that contains it: it keeps
+     * the highlight, and the page keeps its back link.
+     */
+    active?: boolean | "ancestor";
     activeClass?: string;
     disabled?: boolean;
     icon?: string;
@@ -243,6 +269,15 @@ export type AppWorkspaceSidebarItemStatusProps = {
     mention?: boolean;
     /** Shows a muted bell. */
     muted?: boolean;
+    /**
+     * Items that wait for the person, such as requests to approve, in the unread slot instead of `unread`. `label` is
+     * the phrase a screen reader hears, for example "3 waiting". `0` stays as a muted count, for a count that dropped
+     * to zero while the row is still shown; leave the prop out when nothing waits.
+     */
+    waiting?: {
+        count: number;
+        label: string;
+    };
 };
 export type AppWorkspaceNavTreeProps = {
     children: JSX.Element;
@@ -275,6 +310,8 @@ export type AppWorkspaceNavTreeMove = {
 export type AppWorkspaceNavTreeItemProps = {
     id: string;
     label: JSX.Element;
+    /** Passive second line under the label, such as a date; keep controls in actions. */
+    description?: JSX.Element;
     children?: JSX.Element;
     href?: string;
     /** Document navigation by default; opt into enhanced navigation only when the owning island applies the target state. */