npm - @sabrenski/spire-ui-vue - Versions diffs - 0.3.24 → 0.3.26 - Mend

@sabrenski/spire-ui-vue 0.3.24 → 0.3.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (18) hide show

package/dist/components/Chat/Chat.vue.d.ts CHANGED Viewed

@@ -123,6 +123,7 @@ declare function __VLS_template(): {
                         readonly minHeight?: string | undefined;
                         readonly maxHeight?: string | undefined;
                         readonly preset?: import('..').ToolbarPreset | undefined;
+                        readonly toolbar?: import('..').CustomToolbar | undefined;
                         readonly hideToolbar?: boolean | undefined;
                         readonly bubbleMenu?: boolean | undefined;
                         readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -253,6 +254,7 @@ declare function __VLS_template(): {
                         readonly minHeight?: string | undefined;
                         readonly maxHeight?: string | undefined;
                         readonly preset?: import('..').ToolbarPreset | undefined;
+                        readonly toolbar?: import('..').CustomToolbar | undefined;
                         readonly hideToolbar?: boolean | undefined;
                         readonly bubbleMenu?: boolean | undefined;
                         readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -364,6 +366,7 @@ declare function __VLS_template(): {
                         readonly minHeight?: string | undefined;
                         readonly maxHeight?: string | undefined;
                         readonly preset?: import('..').ToolbarPreset | undefined;
+                        readonly toolbar?: import('..').CustomToolbar | undefined;
                         readonly hideToolbar?: boolean | undefined;
                         readonly bubbleMenu?: boolean | undefined;
                         readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -524,6 +527,7 @@ declare function __VLS_template(): {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -635,6 +639,7 @@ declare function __VLS_template(): {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -928,6 +933,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -1058,6 +1064,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -1169,6 +1176,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -1329,6 +1337,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                 readonly minHeight?: string | undefined;
                 readonly maxHeight?: string | undefined;
                 readonly preset?: import('..').ToolbarPreset | undefined;
+                readonly toolbar?: import('..').CustomToolbar | undefined;
                 readonly hideToolbar?: boolean | undefined;
                 readonly bubbleMenu?: boolean | undefined;
                 readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -1440,6 +1449,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                 readonly minHeight?: string | undefined;
                 readonly maxHeight?: string | undefined;
                 readonly preset?: import('..').ToolbarPreset | undefined;
+                readonly toolbar?: import('..').CustomToolbar | undefined;
                 readonly hideToolbar?: boolean | undefined;
                 readonly bubbleMenu?: boolean | undefined;
                 readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -1579,6 +1589,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -1709,6 +1720,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -1820,6 +1832,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -1980,6 +1993,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                 readonly minHeight?: string | undefined;
                 readonly maxHeight?: string | undefined;
                 readonly preset?: import('..').ToolbarPreset | undefined;
+                readonly toolbar?: import('..').CustomToolbar | undefined;
                 readonly hideToolbar?: boolean | undefined;
                 readonly bubbleMenu?: boolean | undefined;
                 readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -2091,6 +2105,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                 readonly minHeight?: string | undefined;
                 readonly maxHeight?: string | undefined;
                 readonly preset?: import('..').ToolbarPreset | undefined;
+                readonly toolbar?: import('..').CustomToolbar | undefined;
                 readonly hideToolbar?: boolean | undefined;
                 readonly bubbleMenu?: boolean | undefined;
                 readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -2332,6 +2347,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -2462,6 +2478,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -2573,6 +2590,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                     readonly minHeight?: string | undefined;
                     readonly maxHeight?: string | undefined;
                     readonly preset?: import('..').ToolbarPreset | undefined;
+                    readonly toolbar?: import('..').CustomToolbar | undefined;
                     readonly hideToolbar?: boolean | undefined;
                     readonly bubbleMenu?: boolean | undefined;
                     readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -2733,6 +2751,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                 readonly minHeight?: string | undefined;
                 readonly maxHeight?: string | undefined;
                 readonly preset?: import('..').ToolbarPreset | undefined;
+                readonly toolbar?: import('..').CustomToolbar | undefined;
                 readonly hideToolbar?: boolean | undefined;
                 readonly bubbleMenu?: boolean | undefined;
                 readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -2844,6 +2863,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatProps, {
                 readonly minHeight?: string | undefined;
                 readonly maxHeight?: string | undefined;
                 readonly preset?: import('..').ToolbarPreset | undefined;
+                readonly toolbar?: import('..').CustomToolbar | undefined;
                 readonly hideToolbar?: boolean | undefined;
                 readonly bubbleMenu?: boolean | undefined;
                 readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;

package/dist/components/Chat/ChatInput.vue.d.ts CHANGED Viewed

@@ -25,6 +25,7 @@ declare function __VLS_template(): {
                 readonly minHeight?: string | undefined;
                 readonly maxHeight?: string | undefined;
                 readonly preset?: import('..').ToolbarPreset | undefined;
+                readonly toolbar?: import('..').CustomToolbar | undefined;
                 readonly hideToolbar?: boolean | undefined;
                 readonly bubbleMenu?: boolean | undefined;
                 readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -145,6 +146,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatInputProps, {
             readonly minHeight?: string | undefined;
             readonly maxHeight?: string | undefined;
             readonly preset?: import('..').ToolbarPreset | undefined;
+            readonly toolbar?: import('..').CustomToolbar | undefined;
             readonly hideToolbar?: boolean | undefined;
             readonly bubbleMenu?: boolean | undefined;
             readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -256,6 +258,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatInputProps, {
             readonly minHeight?: string | undefined;
             readonly maxHeight?: string | undefined;
             readonly preset?: import('..').ToolbarPreset | undefined;
+            readonly toolbar?: import('..').CustomToolbar | undefined;
             readonly hideToolbar?: boolean | undefined;
             readonly bubbleMenu?: boolean | undefined;
             readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;
@@ -386,6 +389,7 @@ declare const __VLS_component: import('vue').DefineComponent<ChatInputProps, {
             readonly minHeight?: string | undefined;
             readonly maxHeight?: string | undefined;
             readonly preset?: import('..').ToolbarPreset | undefined;
+            readonly toolbar?: import('..').CustomToolbar | undefined;
             readonly hideToolbar?: boolean | undefined;
             readonly bubbleMenu?: boolean | undefined;
             readonly characterCount?: (import('..').CharacterCountConfig | boolean) | undefined;

package/dist/components/Dropdown/DropdownMenu.vue.d.ts CHANGED Viewed

@@ -132,6 +132,7 @@ declare const __VLS_component: import('vue').DefineComponent<DropdownMenuProps,
 }>, {
     variant: DropdownMenuVariant;
     color: DropdownMenuColor;
+    maxHeight: string;
     selectionMode: import('./types').DropdownSelectionMode;
     hideSelectedIcon: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {

package/dist/components/Dropdown/DropdownSubmenu.vue.d.ts CHANGED Viewed

@@ -12,6 +12,7 @@ declare function __VLS_template(): {
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<DropdownSubmenuProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<DropdownSubmenuProps> & Readonly<{}>, {
     isDisabled: boolean;
+    maxHeight: string;
     openDelay: number;
     closeDelay: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;

package/dist/components/Dropdown/types.d.ts CHANGED Viewed

@@ -30,6 +30,8 @@ export interface DropdownSubmenuProps {
     openDelay?: number;
     /** Delay before closing on mouse leave (ms) */
     closeDelay?: number;
+    /** Maximum height of the submenu content area (e.g., '300px', '20rem') */
+    maxHeight?: string;
 }
 export interface DropdownProps {
     /** Semantic type affecting ARIA roles */
@@ -64,6 +66,8 @@ export interface DropdownMenuProps {
     hideSelectedIcon?: boolean;
     /** Override parent closeOnSelect */
     closeOnSelect?: boolean;
+    /** Maximum height of the menu content area (e.g., '300px', '20rem') */
+    maxHeight?: string;
 }
 export interface DropdownSectionProps {
     /** Section title displayed above items */

package/dist/components/RichTextEditor/RichTextEditorToolbar.vue.d.ts CHANGED Viewed

@@ -1,7 +1,12 @@
-import { ToolbarPreset } from './types';
+import { ToolbarPreset, CustomToolbar } from './types';
 export interface RichTextEditorToolbarProps {
-    /** Toolbar preset configuration */
+    /** Toolbar preset configuration (ignored if toolbar prop is provided) */
     preset?: ToolbarPreset;
+    /**
+     * Custom toolbar items array. Overrides preset when provided.
+     * Each inner array creates a button group separated by dividers.
+     */
+    toolbar?: CustomToolbar;
 }
 declare const _default: import('vue').DefineComponent<RichTextEditorToolbarProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<RichTextEditorToolbarProps> & Readonly<{}>, {
     preset: ToolbarPreset;

package/dist/components/RichTextEditor/extensions.d.ts CHANGED Viewed

@@ -1,5 +1,13 @@
 import { AnyExtension } from '@tiptap/vue-3';
 import { RichTextEditorProps } from './types';
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        fontSize: {
+            setFontSize: (fontSize: string) => ReturnType;
+            unsetFontSize: () => ReturnType;
+        };
+    }
+}
 /**
  * Creates the TipTap extensions array based on component props.
  */

package/dist/components/RichTextEditor/index.d.ts CHANGED Viewed

@@ -2,9 +2,9 @@ export { default as RichTextEditor } from './RichTextEditor.vue';
 export { default as RichTextEditorToolbar } from './RichTextEditorToolbar.vue';
 export { default as RichTextEditorBubbleMenu } from './RichTextEditorBubbleMenu.vue';
 export { default as RichTextEditorCharacterCount } from './RichTextEditorCharacterCount.vue';
-export type { RichTextEditorProps, RichTextEditorSize, RichTextEditorVariant, ToolbarPreset, CharacterCountConfig, ImageUploadHandler, RichTextEditorContext, ToolbarButtonProps, CharacterCountProps, LinkModalProps, ImageModalProps, } from './types';
+export type { RichTextEditorProps, RichTextEditorSize, RichTextEditorVariant, ToolbarPreset, ToolbarItemId, CustomToolbar, CharacterCountConfig, ImageUploadHandler, RichTextEditorContext, ToolbarButtonProps, CharacterCountProps, LinkModalProps, ImageModalProps, } from './types';
 export { RICH_TEXT_EDITOR_KEY } from './types';
 export { TOOLBAR_PRESETS, getToolbarPreset, type ToolbarItem } from './presets';
 export { createExtensions } from './extensions';
 export { useRichTextEditor } from './composables';
-export { ToolbarButton, ToolbarDivider, ToolbarGroup, BoldButton, ItalicButton, UnderlineButton, StrikeButton, CodeButton, HeadingSelect, TextAlignSelect, BulletListButton, OrderedListButton, TaskListButton, BlockquoteButton, CodeBlockButton, HorizontalRuleButton, LinkButton, ImageButton, TableButton, UndoButton, RedoButton, ClearFormattingButton, } from './toolbar';
+export { ToolbarButton, ToolbarDivider, ToolbarGroup, BoldButton, ItalicButton, UnderlineButton, StrikeButton, CodeButton, HeadingSelect, TextAlignSelect, BulletListButton, OrderedListButton, TaskListButton, BlockquoteButton, CodeBlockButton, HorizontalRuleButton, LinkButton, ImageButton, TableButton, UndoButton, RedoButton, ClearFormattingButton, FontFamilySelect, FontSizeSelect, TextColorSelect, HighlightColorSelect, } from './toolbar';

package/dist/components/RichTextEditor/toolbar/FontFamilySelect.vue.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLSpanElement>;
2	+ export default _default;

package/dist/components/RichTextEditor/toolbar/FontSizeSelect.vue.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLSpanElement>;
2	+ export default _default;

package/dist/components/RichTextEditor/toolbar/HighlightColorSelect.vue.d.ts ADDED Viewed

@@ -0,0 +1,115 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+    popoverRef: ({
+        $: import('vue').ComponentInternalInstance;
+        $data: {};
+        $props: {
+            readonly modelValue?: boolean | undefined;
+            readonly trigger?: (import('../..').PopoverTrigger | import('../..').PopoverTrigger[]) | undefined;
+            readonly placement?: import('../../..').Placement | undefined;
+            readonly showDelay?: number | undefined;
+            readonly hideDelay?: number | undefined;
+            readonly strategy?: import('../..').PopoverStrategy | undefined;
+            readonly disabled?: boolean | undefined;
+            readonly closeOnClickOutside?: boolean | undefined;
+            readonly closeOnEscape?: boolean | undefined;
+            readonly onClose?: (() => any) | undefined;
+            readonly "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+            readonly onOpen?: (() => any) | undefined;
+        } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        } & {
+            dialogRef: HTMLDialogElement;
+        };
+        $slots: Readonly<{
+            [name: string]: import('vue').Slot<any> | undefined;
+        }>;
+        $root: import('vue').ComponentPublicInstance | null;
+        $parent: import('vue').ComponentPublicInstance | null;
+        $host: Element | null;
+        $emit: ((event: "close") => void) & ((event: "update:modelValue", value: boolean) => void) & ((event: "open") => void);
+        $el: any;
+        $options: import('vue').ComponentOptionsBase<Readonly<import('../..').PopoverProps> & Readonly<{
+            onClose?: (() => any) | undefined;
+            "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+            onOpen?: (() => any) | undefined;
+        }>, {
+            open: () => void;
+            close: () => void;
+            toggle: () => void;
+            isOpen: import('vue').Ref<boolean, boolean>;
+            triggerRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+            contentRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+            dialogRef: import('vue').Ref<HTMLDialogElement | null, HTMLDialogElement | null>;
+        }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            close: () => any;
+            "update:modelValue": (value: boolean) => any;
+            open: () => any;
+        }, string, {
+            disabled: boolean;
+            placement: import('../../..').Placement;
+            trigger: import('../..').PopoverTrigger | import('../..').PopoverTrigger[];
+            showDelay: number;
+            hideDelay: number;
+            closeOnEscape: boolean;
+            strategy: import('../..').PopoverStrategy;
+            closeOnClickOutside: boolean;
+        }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import('vue').nextTick;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+    } & Readonly<{
+        disabled: boolean;
+        placement: import('../../..').Placement;
+        trigger: import('../..').PopoverTrigger | import('../..').PopoverTrigger[];
+        showDelay: number;
+        hideDelay: number;
+        closeOnEscape: boolean;
+        strategy: import('../..').PopoverStrategy;
+        closeOnClickOutside: boolean;
+    }> & Omit<Readonly<import('../..').PopoverProps> & Readonly<{
+        onClose?: (() => any) | undefined;
+        "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+        onOpen?: (() => any) | undefined;
+    }>, "close" | "isOpen" | "open" | "toggle" | "dialogRef" | "triggerRef" | "contentRef" | ("disabled" | "placement" | "trigger" | "showDelay" | "hideDelay" | "closeOnEscape" | "strategy" | "closeOnClickOutside")> & import('vue').ShallowUnwrapRef<{
+        open: () => void;
+        close: () => void;
+        toggle: () => void;
+        isOpen: import('vue').Ref<boolean, boolean>;
+        triggerRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+        contentRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+        dialogRef: import('vue').Ref<HTMLDialogElement | null, HTMLDialogElement | null>;
+    }> & {} & import('vue').ComponentCustomProperties & {} & {
+        $slots: {
+            default?(_: {}): any;
+            content?(_: {
+                close: () => void;
+                isOpen: boolean;
+            }): any;
+            content?(_: {
+                close: () => void;
+                isOpen: boolean;
+            }): any;
+        };
+    }) | null;
+}, any>;
+export default _default;

package/dist/components/RichTextEditor/toolbar/TextColorSelect.vue.d.ts ADDED Viewed

@@ -0,0 +1,115 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+    popoverRef: ({
+        $: import('vue').ComponentInternalInstance;
+        $data: {};
+        $props: {
+            readonly modelValue?: boolean | undefined;
+            readonly trigger?: (import('../..').PopoverTrigger | import('../..').PopoverTrigger[]) | undefined;
+            readonly placement?: import('../../..').Placement | undefined;
+            readonly showDelay?: number | undefined;
+            readonly hideDelay?: number | undefined;
+            readonly strategy?: import('../..').PopoverStrategy | undefined;
+            readonly disabled?: boolean | undefined;
+            readonly closeOnClickOutside?: boolean | undefined;
+            readonly closeOnEscape?: boolean | undefined;
+            readonly onClose?: (() => any) | undefined;
+            readonly "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+            readonly onOpen?: (() => any) | undefined;
+        } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        } & {
+            dialogRef: HTMLDialogElement;
+        };
+        $slots: Readonly<{
+            [name: string]: import('vue').Slot<any> | undefined;
+        }>;
+        $root: import('vue').ComponentPublicInstance | null;
+        $parent: import('vue').ComponentPublicInstance | null;
+        $host: Element | null;
+        $emit: ((event: "close") => void) & ((event: "update:modelValue", value: boolean) => void) & ((event: "open") => void);
+        $el: any;
+        $options: import('vue').ComponentOptionsBase<Readonly<import('../..').PopoverProps> & Readonly<{
+            onClose?: (() => any) | undefined;
+            "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+            onOpen?: (() => any) | undefined;
+        }>, {
+            open: () => void;
+            close: () => void;
+            toggle: () => void;
+            isOpen: import('vue').Ref<boolean, boolean>;
+            triggerRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+            contentRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+            dialogRef: import('vue').Ref<HTMLDialogElement | null, HTMLDialogElement | null>;
+        }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            close: () => any;
+            "update:modelValue": (value: boolean) => any;
+            open: () => any;
+        }, string, {
+            disabled: boolean;
+            placement: import('../../..').Placement;
+            trigger: import('../..').PopoverTrigger | import('../..').PopoverTrigger[];
+            showDelay: number;
+            hideDelay: number;
+            closeOnEscape: boolean;
+            strategy: import('../..').PopoverStrategy;
+            closeOnClickOutside: boolean;
+        }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import('vue').nextTick;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+    } & Readonly<{
+        disabled: boolean;
+        placement: import('../../..').Placement;
+        trigger: import('../..').PopoverTrigger | import('../..').PopoverTrigger[];
+        showDelay: number;
+        hideDelay: number;
+        closeOnEscape: boolean;
+        strategy: import('../..').PopoverStrategy;
+        closeOnClickOutside: boolean;
+    }> & Omit<Readonly<import('../..').PopoverProps> & Readonly<{
+        onClose?: (() => any) | undefined;
+        "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+        onOpen?: (() => any) | undefined;
+    }>, "close" | "isOpen" | "open" | "toggle" | "dialogRef" | "triggerRef" | "contentRef" | ("disabled" | "placement" | "trigger" | "showDelay" | "hideDelay" | "closeOnEscape" | "strategy" | "closeOnClickOutside")> & import('vue').ShallowUnwrapRef<{
+        open: () => void;
+        close: () => void;
+        toggle: () => void;
+        isOpen: import('vue').Ref<boolean, boolean>;
+        triggerRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+        contentRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+        dialogRef: import('vue').Ref<HTMLDialogElement | null, HTMLDialogElement | null>;
+    }> & {} & import('vue').ComponentCustomProperties & {} & {
+        $slots: {
+            default?(_: {}): any;
+            content?(_: {
+                close: () => void;
+                isOpen: boolean;
+            }): any;
+            content?(_: {
+                close: () => void;
+                isOpen: boolean;
+            }): any;
+        };
+    }) | null;
+}, any>;
+export default _default;

package/dist/components/RichTextEditor/toolbar/index.d.ts CHANGED Viewed

@@ -20,3 +20,7 @@ export { default as TableButton } from './TableButton.vue';
 export { default as UndoButton } from './UndoButton.vue';
 export { default as RedoButton } from './RedoButton.vue';
 export { default as ClearFormattingButton } from './ClearFormattingButton.vue';
+export { default as FontFamilySelect } from './FontFamilySelect.vue';
+export { default as FontSizeSelect } from './FontSizeSelect.vue';
+export { default as TextColorSelect } from './TextColorSelect.vue';
+export { default as HighlightColorSelect } from './HighlightColorSelect.vue';

package/dist/components/RichTextEditor/types.d.ts CHANGED Viewed

@@ -3,6 +3,16 @@ import { Editor, AnyExtension } from '@tiptap/vue-3';
 export type RichTextEditorSize = 'sm' | 'md' | 'lg';
 export type RichTextEditorVariant = 'outline' | 'filled';
 export type ToolbarPreset = 'minimal' | 'standard' | 'full';
+/**
+ * Toolbar item identifiers for custom toolbar configuration.
+ * Each string corresponds to a toolbar component.
+ */
+export type ToolbarItemId = 'bold' | 'italic' | 'underline' | 'strike' | 'code' | 'heading' | 'textAlign' | 'bulletList' | 'orderedList' | 'taskList' | 'blockquote' | 'codeBlock' | 'horizontalRule' | 'link' | 'image' | 'table' | 'undo' | 'redo' | 'clearFormatting' | 'fontFamily' | 'fontSize' | 'textColor' | 'highlightColor';
+/**
+ * Custom toolbar configuration.
+ * Each inner array represents a group of buttons separated by dividers.
+ */
+export type CustomToolbar = ToolbarItemId[][];
 /**
  * Image upload handler function type.
  * Receives a File object and should return a Promise resolving to the uploaded image URL.
@@ -45,8 +55,14 @@ export interface RichTextEditorProps {
     minHeight?: string;
     /** Maximum height (enables scrolling when exceeded) */
     maxHeight?: string;
-    /** Toolbar preset configuration */
+    /** Toolbar preset configuration (ignored if toolbar prop is provided) */
     preset?: ToolbarPreset;
+    /**
+     * Custom toolbar items array. Overrides preset when provided.
+     * Each inner array creates a button group separated by dividers.
+     * @example [['bold', 'italic'], ['fontFamily', 'fontSize'], ['link']]
+     */
+    toolbar?: CustomToolbar;
     /** Hide the toolbar entirely */
     hideToolbar?: boolean;
     /** Enable selection-based bubble menu */

package/dist/composables/useLabels/index.d.ts CHANGED Viewed

@@ -173,6 +173,10 @@ export interface SpireLabels {
         tableOptions: string;
         headingLevel: string;
         textAlignment: string;
+        fontFamily: string;
+        fontSize: string;
+        textColor: string;
+        highlightColor: string;
     };
     /** SearchInput component labels */
     searchInput: {