@projectfive/v-richtext-vue2 0.0.0-stage → 3.0.0

package/dist/types/richtext-vue/src/composables/use-popover.d.ts

@@ -0,0 +1,45 @@
+import { type Ref } from "vue";
+export type PopoverAlign = "start" | "center" | "end";
+export interface UsePopoverOptions {
+    open: () => boolean;
+    setOpen: (open: boolean) => void;
+    align?: () => PopoverAlign;
+    sideOffset?: () => number;
+}
+/**
+ * Shared logic for Popover and DropdownMenu, built on the native `popover`
+ * attribute and CSS anchor positioning instead of Radix.
+ *
+ * - The trigger gets `popovertarget`, so the browser handles toggling, light
+ *   dismiss (click outside) and Escape.
+ * - `open` stays controllable: the `toggle` event syncs the browser's state
+ *   back, and changing `open` programmatically calls show/hidePopover.
+ * - Browsers without anchor positioning get a one-off position on open.
+ * - An `[autofocus]` element inside the content is focused once it is shown.
+ */
+export declare function usePopover({ open, setOpen, align, sideOffset, }: UsePopoverOptions): {
+    id: string;
+    contentRef: Ref<HTMLElement | null>;
+    triggerAttrs: import("vue").ComputedRef<{
+        popovertarget: string;
+        "aria-controls": string;
+        "aria-expanded": string;
+        "data-state": string;
+        style: {
+            anchorName: string;
+        };
+    }>;
+    contentAttrs: import("vue").ComputedRef<{
+        id: string;
+        popover: string;
+        "data-state": string;
+        "data-side": string;
+        "data-align": PopoverAlign;
+        style: {
+            positionAnchor: string;
+            "--tt-popover-offset": string;
+        };
+    }>;
+    onToggle: (event: Event) => void;
+    close: () => void;
+};

package/dist/types/richtext-vue/src/composables/use-tiptap-editor.d.ts

@@ -0,0 +1,16 @@
+import type { Editor } from "@tiptap/core";
+import { type ComputedRef, type Ref } from "vue";
+import { type MaybeGetter } from "@/composables/utils";
+/**
+ * Makes the editor available to every tiptap-ui component below this one.
+ * Replaces the React template's `EditorContext.Provider`.
+ */
+export declare function provideTiptapEditor(editor: Ref<Editor | null | undefined>): void;
+/**
+ * Returns the editor passed in explicitly (e.g. an `editor` prop), falling
+ * back to the one provided by the nearest `provideTiptapEditor`.
+ *
+ * Unlike the React hook this does not re-render on every transaction; use
+ * `useEditorState` to select the bits of state a component needs.
+ */
+export declare function useTiptapEditor(providedEditor?: MaybeGetter<Editor | null | undefined>): ComputedRef<Editor | null>;

package/dist/types/richtext-vue/src/composables/use-top-layer.d.ts

@@ -0,0 +1,9 @@
+import { type Ref } from "vue";
+/**
+ * p5: shows an element with `popover="manual"` in the browser's top layer as
+ * soon as it's rendered, so it isn't hidden behind modal <dialog>s or a
+ * fullscreen element (which are in the top layer too). `onShown` runs
+ * afterwards, e.g. to measure it: a popover has no size until it's shown.
+ * Without popover support the element simply stays where it is.
+ */
+export declare function useTopLayer(element: Ref<HTMLElement | null>, onShown?: () => void): void;

package/dist/types/richtext-vue/src/composables/use-translations.d.ts

@@ -0,0 +1,7 @@
+import { type ComputedRef } from "vue";
+import { type RichtextMessages } from "@/locales";
+import type { RichtextLocale } from "@/components/input-richtext/types";
+/** p5: makes the texts for `locale` available to all components below */
+export declare function provideTranslations(locale: () => RichtextLocale | undefined): ComputedRef<RichtextMessages>;
+/** The texts of the surrounding editor's locale, or the default locale */
+export declare function useTranslations(): ComputedRef<RichtextMessages>;

package/dist/types/richtext-vue/src/composables/utils.d.ts

@@ -0,0 +1,21 @@
+import { type Ref } from "vue";
+/**
+ * A plain value, a ref, or a getter. Lets composables accept reactive props
+ * (`() => props.type`) as well as static values.
+ *
+ * Deliberately not Vue's `MaybeRefOrGetter`/`toValue` (Vue 3.3+), so this also
+ * works on Vue 2.7 should we ever port back.
+ */
+export type MaybeGetter<T> = T | Ref<T> | (() => T);
+/**
+ * A config object whose values may be getters, except callbacks (`on*`),
+ * which are passed through as-is.
+ */
+export type MaybeGetters<T> = {
+    [K in keyof T]: K extends `on${string}` ? T[K] : MaybeGetter<T[K]>;
+};
+export declare function resolveValue<T>(value: MaybeGetter<T>): T;
+/**
+ * Compares primitives with Object.is and plain objects/arrays one level deep.
+ */
+export declare function shallowEqual(a: unknown, b: unknown): boolean;

package/dist/types/richtext-vue/src/index.d.ts

@@ -0,0 +1,14 @@
+import InputRichtext from "./components/input-richtext/InputRichtext.vue";
+export { InputRichtext };
+export { addLiquidConditions, stripLiquidConditions, } from "./components/input-richtext/liquid";
+export type * from "./components/input-richtext/types";
+/**
+ * Registers <InputRichtext> globally: `app.use(RichtextPlugin)`.
+ * Or import `InputRichtext` and register it locally.
+ */
+export declare const RichtextPlugin: {
+    install(app: {
+        component: (name: string, component: any) => unknown;
+    }): void;
+};
+export default RichtextPlugin;

package/dist/types/richtext-vue/src/lib/pointer.d.ts

@@ -0,0 +1,6 @@
+export declare const isPointerDown: () => boolean;
+/**
+ * Runs `callback` once the current pointer press has fully ended, including
+ * the click it causes: the timeout lets the browser dispatch that first.
+ */
+export declare function afterPointerRelease(callback: () => void): void;

package/dist/types/richtext-vue/src/lib/resize-image.d.ts

@@ -0,0 +1,6 @@
+/**
+ * p5: scales an image down to `maxWidth` (keeping its ratio) before it's
+ * uploaded. Returns the file itself when it's already narrow enough, isn't a
+ * resizable format, or can't be decoded.
+ */
+export declare function resizeImage(file: File, maxWidth: number): Promise<File>;

package/dist/types/richtext-vue/src/lib/shortcuts.d.ts

@@ -0,0 +1,24 @@
+/**
+ * p5: keyboard shortcuts handled by InputRichtext, on top of Tiptap's own
+ * (bold, lists, headings, …). Buttons that open a popover or menu carry
+ * `data-rt-shortcut`, and InputRichtext clicks them on a matching key press.
+ */
+export declare const SHORTCUTS: {
+    readonly focusToolbar: "alt+f10";
+    readonly clearFormatting: "mod+\\";
+    readonly link: "mod+k";
+    readonly highlight: "mod+shift+h";
+    readonly image: "mod+alt+i";
+    readonly file: "mod+alt+f";
+    readonly table: "mod+alt+t";
+    readonly visibilityCondition: "mod+alt+v";
+};
+/**
+ * Whether a keydown matches e.g. "mod+shift+h" ("mod" is Ctrl, or ⌘ on Mac).
+ *
+ * Compares `event.key`, so AltGr characters don't trigger Ctrl+Alt shortcuts:
+ * on Windows AltGr is Ctrl+Alt, and on e.g. US-International AltGr+I types "í"
+ * (event.key "í", not "i"). On Mac, Option changes event.key too (Option+I is a
+ * dead key), so letters fall back to event.code there.
+ */
+export declare function matchesShortcut(event: KeyboardEvent, keys: string): boolean;

package/dist/types/richtext-vue/src/lib/throttle.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Calls `fn` at most once per `wait` ms: right away, then once more at the end
+ * of the wait if it was called again in the meantime (lodash's defaults).
+ * p5: replaces lodash.throttle, which was the only use of that dependency.
+ */
+export declare function throttle(fn: () => void, wait: number): {
+    (): void;
+    flush(): void;
+    cancel(): void;
+};

package/dist/types/richtext-vue/src/lib/tiptap-utils.d.ts

@@ -0,0 +1,109 @@
+import type { Node as PMNode } from "@tiptap/pm/model";
+import type { Editor } from "@tiptap/core";
+export declare const MAX_FILE_SIZE: number;
+export declare const MAC_SYMBOLS: Record<string, string>;
+/**
+ * Determines if the current platform is macOS
+ * @returns boolean indicating if the current platform is Mac
+ */
+export declare function isMac(): boolean;
+/**
+ * Formats a shortcut key based on the platform (Mac or non-Mac)
+ * @param key - The key to format (e.g., "ctrl", "alt", "shift")
+ * @param isMac - Boolean indicating if the platform is Mac
+ * @param capitalize - Whether to capitalize the key (default: true)
+ * @returns Formatted shortcut key symbol
+ */
+export declare const formatShortcutKey: (key: string, isMac: boolean, capitalize?: boolean) => string;
+/**
+ * Parses a shortcut key string into an array of formatted key symbols
+ * @param shortcutKeys - The string of shortcut keys (e.g., "ctrl-alt-shift")
+ * @param delimiter - The delimiter used to split the keys (default: "-")
+ * @param capitalize - Whether to capitalize the keys (default: true)
+ * @returns Array of formatted shortcut key symbols
+ */
+export declare const parseShortcutKeys: (props: {
+    shortcutKeys: string | undefined;
+    delimiter?: string;
+    capitalize?: boolean;
+}) => string[];
+/**
+ * Checks if a mark exists in the editor schema
+ * @param markName - The name of the mark to check
+ * @param editor - The editor instance
+ * @returns boolean indicating if the mark exists in the schema
+ */
+export declare const isMarkInSchema: (markName: string, editor: Editor | null) => boolean;
+/**
+ * Checks if a node exists in the editor schema
+ * @param nodeName - The name of the node to check
+ * @param editor - The editor instance
+ * @returns boolean indicating if the node exists in the schema
+ */
+export declare const isNodeInSchema: (nodeName: string, editor: Editor | null) => boolean;
+/**
+ * Checks if a value is a valid number (not null, undefined, or NaN)
+ * @param value - The value to check
+ * @returns boolean indicating if the value is a valid number
+ */
+export declare function isValidPosition(pos: number | null | undefined): pos is number;
+export declare function isExtensionAvailable(editor: Editor | null, extensionNames: string | string[]): boolean;
+/**
+ * Finds a node at the specified position with error handling
+ * @param editor The Tiptap editor instance
+ * @param position The position in the document to find the node
+ * @returns The node at the specified position, or null if not found
+ */
+export declare function findNodeAtPosition(editor: Editor, position: number): PMNode | null;
+/**
+ * Finds the position and instance of a node in the document
+ * @param props Object containing editor, node (optional), and nodePos (optional)
+ * @param props.editor The Tiptap editor instance
+ * @param props.node The node to find (optional if nodePos is provided)
+ * @param props.nodePos The position of the node to find (optional if node is provided)
+ * @returns An object with the position and node, or null if not found
+ */
+export declare function findNodePosition(props: {
+    editor: Editor | null;
+    node?: PMNode | null;
+    nodePos?: number | null;
+}): {
+    pos: number;
+    node: PMNode;
+} | null;
+/**
+ * Determines whether the current selection contains a node whose type matches
+ * any of the provided node type names.
+ * @param editor Tiptap editor instance
+ * @param nodeTypeNames List of node type names to match against
+ * @param checkAncestorNodes Whether to check ancestor node types up the depth chain
+ */
+export declare function isNodeTypeSelected(editor: Editor | null, nodeTypeNames?: string[], checkAncestorNodes?: boolean): boolean;
+/**
+ * Check whether the current selection is fully within nodes
+ * whose type names are in the provided `types` list.
+ *
+ * - NodeSelection → checks the selected node.
+ * - Text/AllSelection → ensures all textblocks within [from, to) are allowed.
+ */
+export declare function selectionWithinConvertibleTypes(editor: Editor, types?: string[]): boolean;
+type ProtocolOptions = {
+    /**
+     * The protocol scheme to be registered.
+     * @default '''
+     * @example 'ftp'
+     * @example 'git'
+     */
+    scheme: string;
+    /**
+     * If enabled, it allows optional slashes after the protocol.
+     * @default false
+     * @example true
+     */
+    optionalSlashes?: boolean;
+};
+type ProtocolConfig = Array<ProtocolOptions | string>;
+export declare function isAllowedUri(uri: string | undefined, protocols?: ProtocolConfig): true | RegExpMatchArray | null;
+export declare function sanitizeUrl(inputUrl: string, baseUrl: string, protocols?: ProtocolConfig): string;
+export declare function getSelectedBlockNodes(editor: Editor): PMNode[];
+export {};

package/dist/types/richtext-vue/src/locales/en.d.ts

@@ -0,0 +1,140 @@
+/**
+ * English texts. Also defines the shape of every locale: a text missing in
+ * another locale is a type error.
+ */
+export declare const en: {
+    placeholder: string;
+    toolbar: string;
+    tableOfContents: string;
+    back: string;
+    undo: string;
+    redo: string;
+    marks: {
+        bold: string;
+        italic: string;
+        strike: string;
+        underline: string;
+        code: string;
+        superscript: string;
+        subscript: string;
+    };
+    heading: {
+        button: string;
+        menu: string;
+        level: (level: number) => string;
+    };
+    list: {
+        button: string;
+        menu: string;
+        bulletList: string;
+        orderedList: string;
+        taskList: string;
+        /** Screen reader label of a task's checkbox */
+        taskCheckbox: (text: string) => string;
+    };
+    blockquote: string;
+    codeBlock: string;
+    align: {
+        left: string;
+        center: string;
+        right: string;
+        justify: string;
+    };
+    highlight: {
+        button: string;
+        menu: string;
+        remove: string;
+        colors: {
+            default: string;
+            gray: string;
+            brown: string;
+            orange: string;
+            yellow: string;
+            green: string;
+            blue: string;
+            purple: string;
+            pink: string;
+            red: string;
+        };
+    };
+    link: {
+        button: string;
+        placeholder: string;
+        apply: string;
+        newTab: string;
+        open: string;
+        remove: string;
+    };
+    image: {
+        button: string;
+        choose: string;
+        open: string;
+        remove: string;
+        add: string;
+    };
+    file: {
+        button: string;
+        choose: string;
+        open: string;
+        remove: string;
+        add: string;
+    };
+    upload: {
+        pasteLink: string;
+        orPasteLink: string;
+        uploading: string;
+        uploadingFile: (name: string) => string;
+        dismiss: string;
+        failed: string;
+        tooLarge: (megabytes: number) => string;
+    };
+    youtube: {
+        button: string;
+        placeholder: string;
+        add: string;
+        remove: string;
+        invalid: string;
+    };
+    table: {
+        button: string;
+        insert: string;
+        addRowBefore: string;
+        addRowAfter: string;
+        deleteRow: string;
+        addColumnBefore: string;
+        addColumnAfter: string;
+        deleteColumn: string;
+        toggleHeaderRow: string;
+        mergeOrSplit: string;
+        delete: string;
+    };
+    templates: {
+        button: string;
+    };
+    visibilityConditions: {
+        button: string;
+        remove: string;
+        hidden: (label: string) => string;
+    };
+    media: {
+        toolbar: string;
+        caption: string;
+        small: string;
+        medium: string;
+        large: string;
+        floatLeft: string;
+        floatNone: string;
+        floatRight: string;
+    };
+    mentions: {
+        noResults: string;
+    };
+    characterCount: {
+        count: (count: number) => string;
+        atLeast: (min: number) => string;
+    };
+    validation: {
+        minCharacters: (min: number, current: number) => string;
+    };
+};
+export type RichtextMessages = typeof en;

package/dist/types/richtext-vue/src/locales/index.d.ts

@@ -0,0 +1,5 @@
+import { type RichtextMessages } from "./en";
+import type { RichtextLocale } from "@/components/input-richtext/types";
+export type { RichtextMessages };
+export declare const DEFAULT_LOCALE: RichtextLocale;
+export declare const locales: Record<RichtextLocale, RichtextMessages>;

package/dist/types/richtext-vue/src/locales/nl.d.ts

@@ -0,0 +1,2 @@
+import type { RichtextMessages } from "./en";
+export declare const nl: RichtextMessages;

package/dist/types/richtext-vue2/src/components/tiptap-ui-primitive/portal/Portal.vue.d.ts

@@ -0,0 +1,15 @@
+declare const __VLS_template: () => {
+    __VLS_Slots: {
+        default?: (props: {}) => any;
+    };
+};
+type __VLS_Slots = ReturnType<typeof __VLS_template>['__VLS_Slots'];
+declare const __VLS_base: import("vue").DefineComponent<{}, unknown, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+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/types/richtext-vue2/src/lib/tiptap-vue.d.ts

@@ -0,0 +1,9 @@
+import { Editor, EditorContent } from "@tiptap/vue-2";
+import type { EditorOptions } from "@tiptap/core";
+/**
+ * Vue 2 version of ../../../richtext-vue/src/lib/tiptap-vue.ts. @tiptap/vue-2
+ * has no `useEditor`, so this is the same as @tiptap/vue-3's: the editor is
+ * created on mount and destroyed on unmount.
+ */
+export declare function useEditor(options?: Partial<EditorOptions>): import("vue").ShallowRef<Editor | undefined>;
+export { EditorContent };