@webx-ui/core 0.22.0 → 0.24.0

package/dist/components/FormItem/FormItem.d.ts

@@ -23,6 +23,7 @@ declare const __VLS_component: import('vue').DefineComponent<FormItemProps, {
     labelWidth: string;
     help: string;
     reserveErrorSpace: boolean;
+    wide: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/FormItem/types.d.ts

@@ -21,4 +21,13 @@ export interface FormItemProps {
     labelWidth?: string;
     /** Renders the error slot area even when empty, so rows do not jump. */
     reserveErrorSpace?: boolean;
+    /**
+     * Lets the control take the whole width instead of stopping at the readable one.
+     *
+     * A field is read and typed into, so it stops at `--wx-field-max-width` however wide the
+     * screen is: an input stretched across a 2000px monitor is a line the eye cannot follow
+     * back to its label. What is not a field in that sense — an editor, a table, a list of
+     * blocks — says so with this.
+     */
+    wide?: boolean;
 }

package/dist/components/RichText/RichText.d.ts

@@ -1,7 +1,7 @@
-import { RichTextProps, RichTextTool } from './types';
+import { RichTextLabels, RichTextModelValue, RichTextProps, RichTextTool } from './types';
 type __VLS_Props = RichTextProps;
 type __VLS_PublicProps = {
-    modelValue?: string;
+    modelValue?: RichTextModelValue;
 } & __VLS_Props;
 declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
     editor: import('vue').ShallowRef<import('@tiptap/vue-3').Editor | undefined, import('@tiptap/vue-3').Editor | undefined>;
@@ -9,13 +9,13 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
     clear: () => boolean | undefined;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     change: (html: string) => any;
-    "update:modelValue": (value: string) => any;
+    "update:modelValue": (value: RichTextModelValue) => any;
     blur: () => any;
     focus: () => any;
     uploadError: (error: unknown, file: File) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     onChange?: ((html: string) => any) | undefined;
-    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: RichTextModelValue) => any) | undefined;
     onBlur?: (() => any) | undefined;
     onFocus?: (() => any) | undefined;
     onUploadError?: ((error: unknown, file: File) => any) | undefined;
@@ -29,9 +29,11 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
     id: string;
     readonly: boolean;
     minHeight: string;
+    localized: boolean;
     tools: RichTextTool[];
     pickImage: import('./types').RichTextImagePicker;
     accept: string[];
+    labels: RichTextLabels;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     fileInput: HTMLInputElement;
 }, any>;

package/dist/components/RichText/tools.d.ts

@@ -1,4 +1,4 @@
-import { RichTextTool } from './types';
+import { RichTextTableTool, RichTextTool } from './types';
 /**
  * Kept out of the component because `withDefaults` cannot reference a binding
  * declared inside `<script setup>` — it is hoisted out of `setup()`.
@@ -12,37 +12,9 @@ export interface ToolMeta {
 }
 export declare const TOOL_META: Record<Exclude<RichTextTool, 'divider'>, ToolMeta>;
 /** Shown as a second row while the caret sits inside a table. */
-export declare const TABLE_TOOLS: readonly [{
-    readonly key: "addRowAfter";
-    readonly label: "Row below";
-    readonly icon: "rowAfter";
-}, {
-    readonly key: "addRowBefore";
-    readonly label: "Row above";
-    readonly icon: "rowBefore";
-}, {
-    readonly key: "addColumnAfter";
-    readonly label: "Column after";
-    readonly icon: "columnAfter";
-}, {
-    readonly key: "addColumnBefore";
-    readonly label: "Column before";
-    readonly icon: "columnBefore";
-}, {
-    readonly key: "deleteRow";
-    readonly label: "Delete row";
-    readonly icon: "deleteRow";
-}, {
-    readonly key: "deleteColumn";
-    readonly label: "Delete column";
-    readonly icon: "deleteColumn";
-}, {
-    readonly key: "mergeOrSplit";
-    readonly label: "Merge or split cells";
-    readonly icon: "mergeCells";
-}, {
-    readonly key: "deleteTable";
-    readonly label: "Delete table";
-    readonly icon: "deleteTable";
-}];
-export type TableToolKey = (typeof TABLE_TOOLS)[number]['key'];
+export declare const TABLE_TOOLS: {
+    key: RichTextTableTool;
+    label: string;
+    icon: string;
+}[];
+export type TableToolKey = RichTextTableTool;

package/dist/components/RichText/types.d.ts

@@ -1,16 +1,48 @@
 import { ControlSize, ControlStatus } from '../../composables/useFormField';
+import { LocalizedFieldProps, LocalizedValue } from '../../composables/useLocalized';
 export type RichTextTool = 'bold' | 'italic' | 'strike' | 'code' | 'h2' | 'h3' | 'h4' | 'bulletList' | 'orderedList' | 'blockquote' | 'hr' | 'link' | 'table' | 'image' | 'youtube' | 'undo' | 'redo'
 /** A vertical rule between groups. */
  | 'divider';
-export interface RichTextUploadResult {
+/** The keys of the second toolbar, the one that appears inside a table. */
+export type RichTextTableTool = 'addRowAfter' | 'addRowBefore' | 'addColumnAfter' | 'addColumnBefore' | 'deleteRow' | 'deleteColumn' | 'mergeOrSplit' | 'deleteTable';
+/**
+ * Everything this editor says out loud: a tooltip on every button, the two lines of the link
+ * bar, and the word shown while a file is going up.
+ */
+export type RichTextLabelKey = Exclude<RichTextTool, 'divider'> | RichTextTableTool
+/** The accessible name of the toolbar itself. */
+ | 'toolbar' | 'linkAddress' | 'youtubeAddress' | 'apply' | 'cancel' | 'uploading';
+/**
+ * What the editor calls its own buttons. It knows nothing about the panel it is opened in, so
+ * whoever opens it translates it; a key left out stays English.
+ */
+export type RichTextLabels = Partial<Record<RichTextLabelKey, string>>;
+/**
+ * A picture going into the document: where it is right now, and what it is filed under.
+ *
+ * `path` is the library's own key, written into the document as `data-wx-path` and kept there.
+ * The address is not the picture — a bucket that moves, a signed link that expires, an image
+ * edited in place all change the URL and none of them change the key — so whoever stores the
+ * document can work the address out again from the key rather than serving last month's.
+ * Without a `path` the picture is simply an address, which is what an external one is.
+ */
+export interface RichTextImage {
     url: string;
+    path?: string;
     alt?: string;
 }
-/** Uploads one file and resolves with the URL it ended up at. */
-export type RichTextUpload = (file: File) => Promise<RichTextUploadResult>;
-/** Opens a media library and resolves with the chosen URL, or `null` if cancelled. */
-export type RichTextImagePicker = () => Promise<string | null>;
-export interface RichTextProps {
+/** What an upload answers with. */
+export type RichTextUploadResult = RichTextImage;
+/** Uploads one file and resolves with where it ended up. */
+export type RichTextUpload = (file: File) => Promise<RichTextImage>;
+/**
+ * Opens a media library and resolves with what was chosen, or `null` if cancelled. A bare
+ * string is an address and nothing else — fine for a picker with no library behind it.
+ */
+export type RichTextImagePicker = () => Promise<RichTextImage | string | null>;
+/** One language's HTML, or every language's when the field is localized. */
+export type RichTextModelValue = string | LocalizedValue;
+export interface RichTextProps extends LocalizedFieldProps {
     placeholder?: string;
     disabled?: boolean;
     readonly?: boolean;
@@ -32,6 +64,8 @@ export interface RichTextProps {
     pickImage?: RichTextImagePicker;
     /** MIME types accepted for upload. */
     accept?: string[];
+    /** What the buttons and the link bar are called, for a panel that is not in English. */
+    labels?: RichTextLabels;
 }
 export interface RichTextEmits {
     change: [html: string];

package/dist/composables/useHoverPointer.d.ts

@@ -0,0 +1,2 @@
+import { Ref } from 'vue';
+export declare function useHoverPointer(): Ref<boolean>;

package/dist/index.d.ts

@@ -4,6 +4,7 @@ export type { ControlSize, ControlStatus, ValidationErrors } from './composables
 export { useControlAttrs, type ControlAttrs } from './composables/useControlAttrs';
 export { provideLocales, useLocales, useLocalized, localeLabel, localizedValue, localesKey, type LocaleOption, type LocalesContext, type LocalizedValue, type LocalizedFieldProps, } from './composables/useLocalized';
 export { useElementWidth } from './composables/useElementWidth';
+export { useHoverPointer } from './composables/useHoverPointer';
 export { useToast, toast, toastQueue, dismissToast, removeToast, clearToasts, type ToastApi, type ToastHandle, type ToastOptions, type ToastRecord, type ToastType, type ToastAction, } from './composables/useToast';
 export { openModal, createModal, useModal, connectModals, modalKey, type ModalHandle, type ModalOptions, type ModalPromise, } from './composables/useModal';
 export { confirm, type ConfirmOptions } from './composables/confirm';