@synopackageland/ui 0.17.9 → 0.17.11

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # Changelog
 
+## 0.17.11 (2026-10-30)
+
+Settings forms follow DSM's own Control Panel layout by default. Two DOM changes: `Fieldset`'s chevron points up while open and down while collapsed (it was down and right), and a `password` `Input` is now an outer `<span>` (layout attrs) around an inner one holding the field and its toggle.
+
+- `Fieldset` takes `description` (or `#description`): one line under the title across the whole section width (`data-fieldset-description`).
+- `Input` takes `unit` (or `#unit`): text such as s, MB or characters right after the field, a number's too, dimmed while disabled (`data-ui-input-unit`).
+- A `text-only` `FormItem` sets its value level with the label, so a read-only value and an `#after` button (Edit) line up with the rows around it.
+- `FormNote` with one remark reads "Note: …" on one line; two or more `items` keep the heading over a list. `inset` starts it on the field column (inside a `FormGroup` too), one field gap under the field it is about (`data-inset`).
+- docs/layout-rules.md describes the whole settings page: section description, read-only value with Edit, dependent options in a `FormGroup`, section buttons inside the group, units, notes and one Apply in the footer. The Control Panel story adds Network > General.
+
+## 0.17.10 (2026-10-30)
+
+Breaking, with no compatibility layer: the comment Markdown functions are renamed, `MentionTextarea` is gone, and comment bodies read a little differently. A stored body that relied on the old reading needs a one-time conversion; the library keeps no old names or fallback.
+
+- `commentMarkdownParts` and `commentMarkdownText` are renamed `richTextParts(body, { people, headings })` and `richTextText`, with no alias; `CommentBlock` and `CommentInline` are now `RichTextBlock` and `RichTextInline`. A list item is `{ parts, list? }` instead of an array of parts. Add `richTextFileIds`, the image files a body uses.
+- The restricted Markdown grows: `~~strike~~`, `1. ` numbered lists (from any start), lists two levels deep, `> ` quotes, fenced code (a longer fence holds ``` lines), `## ` and `### ` headings with `headings`, and `![alt](file:ID)` images of stored files (any other address stays as typed). A blank line now starts a new paragraph. A backslash keeps the punctuation after it as typed, and `&lt;`, `&gt;`, `&amp;` and `&nbsp;` read as their characters. `**` closes next to CJK punctuation, as in `**「引號」**後面`. Link addresses may hold one level of parentheses. HTML, tables and `---` still show as typed.
+- `CommentItem` renders its body with the new `RichTextView` and takes `files(id)` to show images. Its inner hooks are renamed: `data-ui-comment-mention`, `-link`, `-code` and `-list` are now `data-ui-rich-mention`, `-link`, `-code` and `-list`; paragraphs are `data-ui-rich-paragraph`.
+- Remove `MentionTextarea`, `mentionTokens` and `mentionText`. Comment boxes use the compact `RichTextEditor`.
+- Add the `@synopackageland/ui/rich-text` entry with `RichTextEditor`, a Tiptap 3 editor (MIT parts only) that reads and writes the restricted Markdown, plus `markdownToDoc` and `docToMarkdown`. `variant="full"` has a toolbar that stays at the top and moves what does not fit into More; `variant="compact"` is a comment box that grows from one line, with Markdown as you type, Ctrl/⌘+B, I and K, a toolbar over selected text with a mouse, an "Aa" row of formats (one box at a time, Escape closes it), Ctrl/⌘+Enter or the send button to `submit`, and images under the text. Pasted, dropped and chosen images upload through the app's `upload`; HEIC, HEIF and AVIF are refused with a note, images from other websites are left out with a note, and the box cannot send while an image uploads (`pending`). Tiptap is a dependency loaded only by this entry.
+- Add `RichTextView`, `FileThumbs` (thumbnails and +N), `ImageLightbox` (full-size files with arrow keys and swipes), `UploadQueue` (progress, retry, cancel) with `useUploadQueue`, `MentionList`, `FileItem`, `isPicture` and `isUnsupportedPicture`. `useUiText` is exported for companion entries.
+- `FilePicker` takes pasted files with `paste`: a paste on the picker, or its Paste button where the browser can read the clipboard. A pasted screenshot is named after the time it was pasted.
+- New strings in all nine built-in languages for the editor, the file views and the upload queue.
+
 ## 0.17.9 (2026-10-30)
 
 - A `CommentItem` body with many unmatched `*` or `**` no longer slows down: each line is read in one pass, so a 70,000-character comment of unclosed stars takes milliseconds instead of seconds. What the comment shows is unchanged.

package/README.md

@@ -621,7 +621,7 @@ touch keyboard is open; set `hidden` while a full-screen drawer covers the page.
 </AppLayout>
 ```
 
-### Collaboration: CompletionToggle, MentionTextarea, CommentItem
+### Collaboration: CompletionToggle, CommentItem, rich text and files
 
 `CompletionToggle` is the round done toggle of a task row, card or detail
 header: a `role="checkbox"` with a 44px touch target. Show the new state at
@@ -629,24 +629,58 @@ once, set `pending` while it saves, and on failure put the old state back and
 set `error`. Its click does not reach the row, so it never also opens the item.
 Name it after the item: `label="Done: Send the quote"`.
 
-`MentionTextarea` opens a list of people on `@`. The app owns the people: it
-answers `search` (the text after `@`) by setting `candidates`, and turns
-`filter` off when its server already matched them. A chosen person is written
-`@Label` in the text and kept in `v-model:mentions`; `mentionTokens(text,
-mentions).body` is what to store, with `@[id]` tokens, and `mentionText(body,
-people)` turns a stored body back for editing. With `maxlength` the box counts
-the stored characters near and over the limit; it never cuts text, so disable
-sending while it is over (`data-over`).
-
-`CommentItem` shows one comment: avatar, author, the time as the app formats
-it, and the stored body with its line breaks, mentions as names and http(s)
-links. `edited`, `deleted` and `highlighted` (a one-time flash for a comment
-opened from a notification) cover the rest; edit and delete controls go in
-`#actions`.
+Comments and rich text fields store one restricted Markdown: `**bold**`,
+`*italic*`, `~~strike~~`, `` `code` ``, `[text](https://…)` or `mailto:`,
+`@[id]` mentions, `![alt](file:ID)` images of stored files, `- ` and `1. `
+lists two levels deep, `> ` quotes, fenced code and, in a field, `## ` and
+`### ` headings. A backslash keeps punctuation as typed; HTML, tables and
+`---` always show as typed. `richTextParts(body, { people, headings })` reads it
+into blocks of parts, never HTML; `richTextText` gives plain text for a
+notification or a search; `richTextFileIds` lists the image files a body uses.
+
+`RichTextView` shows a body: mentions as names, safe links, images that keep
+their shape while they load and open in an `ImageLightbox`. The app passes
+`files(id)`, which describes a stored file (`FileItem`: name, type, `thumb`,
+`preview`, `url`, `width`, `height`, `dominant` colour and a `state` of
+`processing`, `missing` or `changed`). `CommentItem` shows one comment with a
+`RichTextView` body: avatar, author, the time as the app formats it; `edited`,
+`deleted` and `highlighted` (a one-time flash for a comment opened from a
+notification) cover the rest; edit and delete controls go in `#actions`.
+
+`RichTextEditor` comes from its own entry, `@synopackageland/ui/rich-text`, so
+an app that only shows rich text never loads Tiptap; load it when an editor
+first opens. Both looks write the same Markdown:
+
+- `variant="full"`, for a rich text field: a toolbar that stays at the top, with
+  what does not fit in a More menu; images sit in the text.
+- `variant="compact"`, for a comment box (as in Slack, Linear and GitHub): one
+  line that grows, Markdown as you type, Ctrl/⌘+B, I and K, a toolbar over
+  selected text with a mouse, and an "Aa" button that opens one row of formats
+  (the only one on a touch screen). Enter starts a line; Ctrl/⌘+Enter or the
+  send button emits `submit`. Images line up under the text, and the box does
+  not send while one uploads.
+
+The editor knows nothing of the server. `upload(file, { signal, onProgress })`
+sends one file and resolves with its id; pasted, dropped and chosen JPEG, PNG,
+WebP and GIF images go through it, and HEIC is refused with a note (the picker
+names its types, so iOS hands over JPEG). `pending` reports images still
+uploading or failed: a form should not save while there are any. `@` opens the
+people in `candidates`; answer `search` and turn `filter` off when the server
+already matched them. With `maxlength` the box counts characters near and over
+the limit and never cuts text.
+
+`FileThumbs` shows a few thumbnails and "+N", `ImageLightbox` shows files full
+size (arrow keys and swipes), and `UploadQueue` lists uploads with progress,
+retry and cancel. `useUploadQueue(upload, { concurrency, retries })` runs the
+uploads it shows. `FilePicker` takes pasted files with `paste`.
 
 ```vue
-<CommentItem v-for="c in comments" :key="c.id" :author="c.author.name" :time="c.when" :body="c.body" :mentions="c.mentions" :edited="!!c.editedAt" :deleted="c.deleted" />
-<MentionTextarea v-model="text" v-model:mentions="mentions" :candidates="people" :filter="false" :maxlength="4000" @search="findPeople" />
+<CommentItem v-for="c in comments" :key="c.id" :author="c.author.name" :time="c.when" :body="c.body" :mentions="people" :files="fileById" :edited="!!c.editedAt" :deleted="c.deleted" />
+<RichTextEditor v-model="text" variant="compact" :candidates="people" :filter="false" :maxlength="4000" :upload="sendFile" :files="fileById" @search="findPeople" @submit="post" />
+```
+
+```ts
+const RichTextEditor = defineAsyncComponent(() => import('@synopackageland/ui/rich-text').then(module => module.RichTextEditor))
 ```
 
 ### Status: StatusDot, StepList, ConnectionTopology

package/dist/components/composite/comment-item/CommentItem.vue.d.ts

@@ -1,4 +1,5 @@
 import { MentionCandidate } from '../../../lib/mentions';
+import { FileItem } from '../../../lib/files';
 type __VLS_Props = {
     author: string;
     /** Keeps the avatar colour stable across renamed accounts. */
@@ -9,10 +10,12 @@ type __VLS_Props = {
     time?: string;
     /** The same time for machines (`<time datetime>`), such as an ISO string. */
     datetime?: string;
-    /** Text with `@[id]` mention tokens and basic Markdown: bold, italic, code, links and `- ` lists. */
+    /** Restricted Markdown with `@[id]` mention tokens and `![alt](file:ID)` images (see `richTextParts`). */
     body?: string;
     /** Names for the mention tokens; an unknown id shows as itself. */
     mentions?: MentionCandidate[];
+    /** The file behind an image's id. */
+    files?: (id: string) => FileItem | undefined;
     edited?: boolean;
     deleted?: boolean;
     highlighted?: boolean;
@@ -30,6 +33,7 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {},
     time: string;
     avatar: string;
     mentions: MentionCandidate[];
+    files: (id: string) => FileItem | undefined;
     authorId: string;
     datetime: string;
     edited: boolean;

package/dist/components/composite/copy-button/CopyButton.vue.d.ts

@@ -18,11 +18,11 @@ type __VLS_Props = {
     disabled?: boolean;
 };
 declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    copied: (text: string) => any;
     failed: (text: string) => any;
+    copied: (text: string) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onCopied?: ((text: string) => any) | undefined;
     onFailed?: ((text: string) => any) | undefined;
+    onCopied?: ((text: string) => any) | undefined;
 }>, {
     label: string;
     size: "sm" | "md";

package/dist/components/composite/file-picker/FilePicker.vue.d.ts

@@ -15,17 +15,19 @@ type __VLS_Props = {
     directory?: boolean;
     showList?: boolean;
     variant?: 'dropzone' | 'compact';
+    /** Takes files pasted while the picker has focus, and adds a Paste button where the browser can read the clipboard (an iPhone has no keyboard to paste with). */
+    paste?: boolean;
     locale?: UiLocale;
     text?: Partial<FilePickerText>;
     title?: string;
     description?: string;
 };
-declare var __VLS_27: {
+declare var __VLS_53: {
     file: File;
     index: number;
 };
 type __VLS_Slots = {} & {
-    'file-actions'?: (props: typeof __VLS_27) => any;
+    'file-actions'?: (props: typeof __VLS_53) => any;
 };
 declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (files: File[]) => any;
@@ -38,6 +40,7 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {},
     disabled: boolean;
     modelValue: File[];
     multiple: boolean;
+    paste: boolean;
     maxFiles: number;
     maxSize: number;
     directory: boolean;

package/dist/components/composite/file-thumbs/FileThumbs.vue.d.ts

@@ -0,0 +1,24 @@
+import { FileItem } from '../../../lib/files';
+type __VLS_Props = {
+    items: FileItem[];
+    /** Thumbnails shown before "+N"; 0 shows them all. */
+    max?: number;
+    /** `sm` (28px) fits a table row; `md` (64px) a form or a comment box. */
+    size?: 'sm' | 'md';
+    removable?: boolean;
+    lightbox?: boolean;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    open: (index: number, item: FileItem) => any;
+    remove: (item: FileItem) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onOpen?: ((index: number, item: FileItem) => any) | undefined;
+    onRemove?: ((item: FileItem) => any) | undefined;
+}>, {
+    size: "sm" | "md";
+    max: number;
+    removable: boolean;
+    lightbox: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/composite/form/FormItem.vue.d.ts

@@ -40,7 +40,7 @@ type __VLS_Props = {
     defaultValidateTrigger?: ValidateTrigger;
     /** Validates once on mount. */
     immediateValidate?: boolean;
-    /** The slot content is plain text, not a control. */
+    /** The slot content is plain text, not a control: a read-only value, set level with the label. An `#after` button follows the field column. */
     textOnly?: boolean;
     /** Indentation level (multiples of 28px) or any CSS length. */
     indent?: string | number;

package/dist/components/composite/form-note/FormNote.vue.d.ts

@@ -1,12 +1,16 @@
 type __VLS_Props = {
     /** Replaces the "Note:" heading. */
     title?: string;
-    /** One bullet each; the default slot follows them. */
+    /** One bullet each; a single item reads inline after the heading. The default slot follows them. */
     items?: string[];
+    /** Starts the note on the field column, past the label column (inside a FormGroup too). */
+    inset?: boolean;
 };
-declare var __VLS_1: {};
+declare var __VLS_1: {}, __VLS_3: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_3) => any;
 };
 declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/components/composite/image-lightbox/ImageLightbox.vue.d.ts

@@ -0,0 +1,19 @@
+import { FileItem } from '../../../lib/files';
+type __VLS_Props = {
+    items: FileItem[];
+    open?: boolean;
+    /** The file shown, from 0. */
+    index?: number;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:open": (open: boolean) => any;
+    "update:index": (index: number) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:open"?: ((open: boolean) => any) | undefined;
+    "onUpdate:index"?: ((index: number) => any) | undefined;
+}>, {
+    open: boolean;
+    index: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/composite/mention-list/MentionList.vue.d.ts

@@ -0,0 +1,31 @@
+import { MentionCandidate } from '../../../lib/mentions';
+type __VLS_Props = {
+    open: boolean;
+    /** Where the list opens, such as the caret's box. */
+    reference: {
+        getBoundingClientRect: () => DOMRect;
+    } | null;
+    people: readonly MentionCandidate[];
+    active?: number;
+    /** The listbox id; each option is `${id}-${index}`. */
+    id: string;
+    /** Shows "Loading…" while the list is empty. */
+    loading?: boolean;
+    /** An element inside the app, which keeps the list within the app's window. */
+    boundary?: HTMLElement;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    choose: (person: MentionCandidate) => any;
+    close: () => any;
+    hover: (index: number) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onChoose?: ((person: MentionCandidate) => any) | undefined;
+    onClose?: (() => any) | undefined;
+    onHover?: ((index: number) => any) | undefined;
+}>, {
+    loading: boolean;
+    active: number;
+    boundary: HTMLElement;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/composite/rich-text-view/RichTextBlocks.vue.d.ts

@@ -0,0 +1,14 @@
+import { RichTextBlock } from '../../../lib/richText';
+import { FileItem } from '../../../lib/files';
+type __VLS_Props = {
+    blocks: RichTextBlock[];
+    file: (id: string, alt: string) => FileItem;
+    imageHeight: number;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    open: (id: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onOpen?: ((id: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/composite/rich-text-view/RichTextImage.vue.d.ts

@@ -0,0 +1,12 @@
+import { FileItem } from '../../../lib/files';
+type __VLS_Props = {
+    item: FileItem;
+    height: number;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    open: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onOpen?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/composite/rich-text-view/RichTextInline.vue.d.ts

@@ -0,0 +1,23 @@
+import { RichTextInline } from '../../../lib/richText';
+type __VLS_Props = {
+    parts: RichTextInline[];
+};
+declare var __VLS_1: {
+    image: {
+        type: "image";
+        id: string;
+        alt: string;
+    };
+};
+type __VLS_Slots = {} & {
+    image?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/composite/rich-text-view/RichTextView.vue.d.ts

@@ -0,0 +1,28 @@
+import { MentionCandidate } from '../../../lib/mentions';
+import { FileItem } from '../../../lib/files';
+type __VLS_Props = {
+    body?: string;
+    /** Names for the mention tokens; an unknown id shows as itself. */
+    mentions?: MentionCandidate[];
+    /** Reads `## ` and `### ` as headings, as a rich text field does. */
+    headings?: boolean;
+    /** The file behind an image's id; an unknown id shows as missing. */
+    files?: (id: string) => FileItem | undefined;
+    /** Tallest an image is drawn, in px, before it opens full size. */
+    imageHeight?: number;
+    lightbox?: boolean;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "open-image": (id: string, index: number) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onOpen-image"?: ((id: string, index: number) => any) | undefined;
+}>, {
+    body: string;
+    imageHeight: number;
+    mentions: MentionCandidate[];
+    headings: boolean;
+    files: (id: string) => FileItem | undefined;
+    lightbox: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/composite/stat-tile/StatTile.vue.d.ts

@@ -28,8 +28,8 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {},
     disabled: boolean;
     value: string | number;
     modelValue: boolean;
-    tone: StatTileTone;
     unit: string;
+    tone: StatTileTone;
     note: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/components/composite/upload-queue/UploadQueue.vue.d.ts

@@ -0,0 +1,36 @@
+import { UploadStatus } from '../../../lib/uploadQueue';
+export type UploadQueueItem = {
+    key: string;
+    name: string;
+    size: number;
+    loaded: number;
+    status: UploadStatus;
+    error?: string;
+};
+type __VLS_Props = {
+    tasks: UploadQueueItem[];
+    /** Files the server is still making thumbnails for, added to the summary. */
+    processing?: number;
+    collapsible?: boolean;
+    /** Shows a close button once nothing waits or sends. */
+    closable?: boolean;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    cancel: (key: string) => any;
+    close: () => any;
+    retry: (key: string) => any;
+    retryAll: () => any;
+    cancelAll: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onCancel?: ((key: string) => any) | undefined;
+    onClose?: (() => any) | undefined;
+    onRetry?: ((key: string) => any) | undefined;
+    onRetryAll?: (() => any) | undefined;
+    onCancelAll?: (() => any) | undefined;
+}>, {
+    collapsible: boolean;
+    closable: boolean;
+    processing: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/composite/wizard/WizardStep.vue.d.ts

@@ -11,11 +11,11 @@ declare const __VLS_base: import('vue').DefineComponent<WizardStepProps, {
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<WizardStepProps> & Readonly<{}>, {
     footer: boolean;
     type: import('./types').WizardStepType;
+    lazy: boolean;
     headline: string;
     nextDisabled: boolean;
     showNext: boolean;
     showBack: boolean;
-    lazy: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/containers/fieldset/Fieldset.vue.d.ts

@@ -5,6 +5,8 @@ export type FieldsetTitle = string | {
 export type FieldsetCollapseTrigger = 'click' | 'dblclick' | 'none';
 type __VLS_Props = {
     title?: FieldsetTitle;
+    /** One line under the title, across the whole width (DSM's "Enter the server name, ..."). */
+    description?: string;
     collapsible?: boolean;
     /** Mouse gesture that toggles; Enter/Space always works on the header. */
     collapseTriggerEvent?: FieldsetCollapseTrigger;
@@ -12,7 +14,7 @@ type __VLS_Props = {
     /** Bound with `v-model:collapsed`; defaults to expanded when left unbound. */
     collapsed?: boolean;
 };
-declare var __VLS_1: {}, __VLS_8: {}, __VLS_10: {}, __VLS_12: {};
+declare var __VLS_1: {}, __VLS_8: {}, __VLS_10: {}, __VLS_12: {}, __VLS_14: {};
 type __VLS_Slots = {} & {
     'collapse-icon'?: (props: typeof __VLS_1) => any;
 } & {
@@ -20,7 +22,9 @@ type __VLS_Slots = {} & {
 } & {
     title?: (props: typeof __VLS_10) => any;
 } & {
-    default?: (props: typeof __VLS_12) => any;
+    description?: (props: typeof __VLS_12) => any;
+} & {
+    default?: (props: typeof __VLS_14) => any;
 };
 declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
     isCollapsed: import('vue').ComputedRef<boolean>;

package/dist/components/primitives/input/Input.vue.d.ts

@@ -10,8 +10,14 @@ type __VLS_Props = {
     name?: string;
     ariaLabel?: string;
     ariaLabelledby?: string;
+    /** Text right after the field, such as s, MB or characters; the `#unit` slot replaces it. */
+    unit?: string;
 };
-declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+declare var __VLS_11: {};
+type __VLS_Slots = {} & {
+    unit?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (value: string) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
@@ -23,5 +29,11 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {
     readonly: boolean;
     invalid: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/rich-text-editor/RichTextEditor.vue.d.ts

@@ -0,0 +1,83 @@
+import { FileItem, MentionCandidate, UploadFunction } from '../../index';
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import('vue').DefineComponent<{
+    modelValue?: string;
+    variant?: "compact" | "full";
+    /** `## ` and `### ` headings; on by default in `full` only. */
+    headings?: boolean;
+    placeholder?: string;
+    disabled?: boolean;
+    invalid?: boolean;
+    id?: string;
+    ariaLabel?: string;
+    /** Characters the stored body may hold; the count shows from 90% and over, and a body over it cannot be sent. */
+    maxlength?: number;
+    /** Images one body may hold: 20 in `compact`, 50 in `full` by default. */
+    maxImages?: number;
+    /** Sends one file and resolves with its stored id; without it the box takes no images. */
+    upload?: UploadFunction<string>;
+    /** The file behind a stored image's id. */
+    files?: (id: string) => FileItem | undefined;
+    /** People to offer for the text typed after `@`. */
+    candidates?: MentionCandidate[];
+    /** Narrows `candidates` by the query here; turn off when the server already did. */
+    filter?: boolean;
+    /** Shows "Loading…" in the list of people while the app fetches. */
+    loading?: boolean;
+    /** `compact` only: the send button shows a spinner and the box cannot send again. */
+    sending?: boolean;
+}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    search: (query: string) => any;
+    submit: (body: string) => any;
+    pending: (count: number) => any;
+    "update:modelValue": (body: string) => any;
+}, string, import('vue').PublicProps, Readonly<{
+    modelValue?: string;
+    variant?: "compact" | "full";
+    /** `## ` and `### ` headings; on by default in `full` only. */
+    headings?: boolean;
+    placeholder?: string;
+    disabled?: boolean;
+    invalid?: boolean;
+    id?: string;
+    ariaLabel?: string;
+    /** Characters the stored body may hold; the count shows from 90% and over, and a body over it cannot be sent. */
+    maxlength?: number;
+    /** Images one body may hold: 20 in `compact`, 50 in `full` by default. */
+    maxImages?: number;
+    /** Sends one file and resolves with its stored id; without it the box takes no images. */
+    upload?: UploadFunction<string>;
+    /** The file behind a stored image's id. */
+    files?: (id: string) => FileItem | undefined;
+    /** People to offer for the text typed after `@`. */
+    candidates?: MentionCandidate[];
+    /** Narrows `candidates` by the query here; turn off when the server already did. */
+    filter?: boolean;
+    /** Shows "Loading…" in the list of people while the app fetches. */
+    loading?: boolean;
+    /** `compact` only: the send button shows a spinner and the box cannot send again. */
+    sending?: boolean;
+}> & Readonly<{
+    onSearch?: ((query: string) => any) | undefined;
+    onSubmit?: ((body: string) => any) | undefined;
+    onPending?: ((count: number) => any) | undefined;
+    "onUpdate:modelValue"?: ((body: string) => any) | undefined;
+}>, {
+    filter: boolean;
+    variant: "compact" | "full";
+    loading: boolean;
+    disabled: boolean;
+    id: string;
+    modelValue: string;
+    placeholder: string;
+    invalid: boolean;
+    ariaLabel: string;
+    headings: boolean;
+    files: (id: string) => FileItem | undefined;
+    upload: UploadFunction<string>;
+    maxlength: number;
+    maxImages: number;
+    candidates: MentionCandidate[];
+    sending: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/rich-text-editor/extensions.d.ts

@@ -0,0 +1,30 @@
+import { Node, AnyExtension } from '@tiptap/core';
+import { SuggestionOptions } from '@tiptap/suggestion';
+import { FileItem, MentionCandidate } from '../../index';
+export type ImageView = {
+    /** The file behind a stored image's id. */
+    file: (id: string) => FileItem | undefined;
+    labels: {
+        uploading: string;
+        failed: string;
+        missing: string;
+    };
+};
+/**
+ * An image of a stored file, a block of its own. `id` is the stored file;
+ * `upload` names an image still being sent, drawn from the local `src`, with
+ * its `progress` from 0 to 1, or -1 once it failed.
+ */
+export declare function fileImage(view: ImageView): Node<any, any>;
+export type ExtensionOptions = {
+    headings: boolean;
+    placeholder: string;
+    image: ImageView;
+    mention: Omit<SuggestionOptions<MentionCandidate>, 'editor' | 'char'>;
+    /** Ctrl+Enter or Cmd+Enter; returns whether it was taken. Never while an input method composes. */
+    submit?: () => boolean;
+    /** Ctrl+K or Cmd+K. */
+    link: () => boolean;
+    escape: () => boolean;
+};
+export declare function extensions(options: ExtensionOptions): AnyExtension[];

package/dist/components/rich-text-editor/markdown.d.ts

@@ -0,0 +1,22 @@
+import { JSONContent } from '@tiptap/core';
+import { MentionCandidate } from '../../index';
+export type MarkdownOptions = {
+    people?: readonly MentionCandidate[];
+    headings?: boolean;
+    /** Leaves images out of the document and returns their ids, for a comment box that lists them under the text. */
+    imagesApart?: boolean;
+};
+/** A stored body → the editor's document, and the file ids of its images when `imagesApart`. */
+export declare function markdownToDoc(body: string, options?: MarkdownOptions): {
+    doc: JSONContent;
+    images: {
+        id: string;
+        alt: string;
+    }[];
+};
+export type SerializeOptions = {
+    /** Between top-level blocks: a blank line by default; a comment box uses a single line break. */
+    blockSeparator?: string;
+};
+/** The editor's document → the stored body. Images still uploading (no `id`) are left out. */
+export declare function docToMarkdown(doc: JSONContent, options?: SerializeOptions): string;