@prolibu-suite/cobalt-core 0.1.2 → 0.3.0

package/dist/types/components/co-modal/co-modal.d.ts

@@ -14,10 +14,20 @@ export declare class CoModal {
     closable: boolean;
     /** Close when clicking the overlay backdrop */
     closeOnOverlay: boolean;
+    /** Modal width: sm (400px), md (540px), lg (680px) */
+    size: 'sm' | 'md' | 'lg';
+    /** Hide body section and all border dividers (compact confirm dialogs) */
+    noDividers: boolean;
     /** Emitted when the modal requests to close */
     coClose: EventEmitter<void>;
+    /** Close animation finished. */
+    coAfterClose: EventEmitter<void>;
+    /** Open animation finished. */
+    coAfterOpen: EventEmitter<void>;
+    private modalEl?;
     private handleOverlayClick;
     private handleCloseClick;
     private stopPropagation;
+    private handleTransitionEnd;
     render(): any;
 }

package/dist/types/components/co-number-field/co-number-field.d.ts

@@ -1,27 +1,54 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 export declare class CoNumberField {
     label?: string;
+    /** Whether the field is required (renders a required marker on the label). */
+    required: boolean;
     secondaryLabel?: string;
     helperText?: string;
+    /** Label layout: vertical (label above) or horizontal (label beside) */
+    layout: 'vertical' | 'horizontal';
     status: 'default' | 'error' | 'success' | 'warning' | 'info';
-    value: number;
+    value: number | null;
     min?: number;
     max?: number;
     step: number;
     disabled: boolean;
     placeholder: string;
+    size: 's' | 'sm' | 'md' | 'lg';
+    /** Show clear button when the field has a value */
+    clearable: boolean;
+    /**
+     * Display format. With 'rate' | 'percent' the `value` stays a DECIMAL
+     * (e.g. 0.15) but the field shows/edits the PERCENT (15) with a "%" suffix.
+     * value/min/max/step are always in the underlying (decimal) unit.
+     * Reflected so it survives lazy hydration when set via the Vue wrapper.
+     */
+    format?: 'rate' | 'percent';
     focused: boolean;
     el: HTMLElement;
-    coChange: EventEmitter<number>;
+    coChange: EventEmitter<number | null>;
+    /** Emitted when the clear button is clicked */
+    coClear: EventEmitter<void>;
     private inputEl?;
+    /** True when there is no numeric value (cleared / empty). */
+    private get isEmpty();
+    /** Numeric value to step from, treating an empty field as min (or 0). */
+    private get current();
     private get statusIcon();
     private get canDecrement();
     private get canIncrement();
     private clamp;
+    /** Whether the value↔display conversion (×100) is active. */
+    private get scaled();
+    /** Stored decimal → shown number (0.15 → 15). toFixed avoids FP artifacts. */
+    private toDisplay;
+    /** Typed number → stored decimal (15 → 0.15). */
+    private fromDisplay;
     private emitValue;
     private handleDecrement;
     private handleIncrement;
     private handleInput;
+    private handleClear;
     private handleBlur;
     private handleFocus;
     private handleKeyDown;

package/dist/types/components/co-overlay/co-overlay.d.ts

@@ -1,9 +1,54 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 export declare class CoOverlay {
+    el: HTMLElement;
     /** Whether the overlay is visible */
     open: boolean;
+    /**
+     * Opt-in accessible focus trap. When true, opening the overlay records the
+     * previously-focused element, moves focus into the overlay, cycles Tab /
+     * Shift+Tab within the slotted content, and restores focus on close.
+     * Default false → existing consumers are unchanged.
+     */
+    trapFocus: boolean;
+    /**
+     * Opt-in: emit `coClose` when Escape is pressed while open.
+     * Default false → existing consumers are unchanged.
+     */
+    closeOnEscape: boolean;
     /** Emitted when the overlay backdrop is clicked */
     coClose: EventEmitter<void>;
+    /** Slide/fade-out animation finished (overlay fully closed). */
+    coAfterClose: EventEmitter<void>;
+    /** Slide/fade-in animation finished (overlay fully open). */
+    coAfterOpen: EventEmitter<void>;
+    /** Whether THIS instance currently holds a scroll lock (prevents double-count). */
+    private hasLock;
+    /** The scrim element, promoted to the top layer via the Popover API. */
+    private overlayEl?;
+    /** Element focused before the trap engaged, restored on close. */
+    private returnFocusEl?;
+    onOpenChange(isOpen: boolean): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    private acquireLock;
+    private releaseLock;
+    /**
+     * Promote the scrim to the browser top layer so it covers the whole viewport
+     * regardless of ancestor `filter`/`mask`/`transform` (which would otherwise
+     * make `position: fixed` resolve against that ancestor, confining the scrim).
+     * The Popover API promotes WITHOUT moving the DOM node, so slots and Stencil
+     * reconciliation are untouched. No-ops gracefully where unsupported.
+     */
+    private syncPopover;
+    /** Record the current focus and move it into the overlay (guarded by trapFocus). */
+    private captureAndFocus;
+    /** Restore focus to the element that had it before the trap engaged. */
+    private restoreFocus;
+    /** Deepest active element, descending through nested shadow roots. */
+    private deepActiveElement;
+    handleKeydown(e: KeyboardEvent): void;
+    private trapTab;
     private handleClick;
+    private handleTransitionEnd;
     render(): any;
 }

package/dist/types/components/co-overlay/focusTrap.d.ts

@@ -0,0 +1,20 @@
+/** CSS selector matching natively tabbable elements. */
+export declare const FOCUSABLE_SELECTOR: string;
+/**
+ * Decide which focusable index a Tab / Shift+Tab keystroke should move to.
+ *
+ * @param count       number of focusable elements inside the trap
+ * @param activeIndex index of the currently focused element, or -1 when focus
+ *                    is outside the trap (e.g. it escaped to the body)
+ * @param shiftKey    whether Shift is held (backward tabbing)
+ * @returns the index to focus, or -1 when there is nothing to trap
+ *
+ * Pure — no DOM — so the wrap-around edge cases stay unit-testable.
+ */
+export declare function resolveTabIndex(count: number, activeIndex: number, shiftKey: boolean): number;
+/**
+ * Collect the tabbable elements slotted into the overlay's light DOM, skipping
+ * hidden / aria-hidden ones. (Focusables nested inside further shadow roots are
+ * out of scope — the common dialog/modal content lives in the slotted subtree.)
+ */
+export declare function getFocusableElements(root: ParentNode): HTMLElement[];

package/dist/types/components/co-overlay/overlayAfterClose.d.ts

@@ -0,0 +1,5 @@
+export type AfterEvent = 'after-open' | 'after-close' | null;
+/** Decide which after-animation event a `transitionend` should emit.
+ *  `watched` is the authoritative CSS property (so multi-prop transitions
+ *  — e.g. transform + opacity — fire the after-event exactly once). */
+export declare function afterEventFor(propertyName: string, isOpen: boolean, watched: string): AfterEvent;

package/dist/types/components/co-phone-field/co-phone-field.d.ts

@@ -0,0 +1,58 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * Phone input with country code indicator. Composes a country selector
+ * (flag + dial code) alongside a free-form phone number input.
+ *
+ * Value format: free string — the component stores `"{dialCode}{number}"`
+ * concatenated. The host may parse/normalize as needed.
+ *
+ * @event coChange - Emits the full phone string on every change.
+ */
+export declare class CoPhoneField {
+    host: HTMLElement;
+    /** Field label. */
+    label?: string;
+    /** Placeholder for the number input. */
+    placeholder: string;
+    /** Current full value (dialCode + number). */
+    value: string;
+    /** Disable the entire field. */
+    disabled: boolean;
+    /** Required indicator. */
+    required: boolean;
+    /** Validation status. */
+    status: 'default' | 'error' | 'success' | 'warning' | 'info';
+    /** Helper/error text below the field. */
+    helperText?: string;
+    /** Label layout: vertical (label above) or horizontal (label beside) */
+    layout: 'vertical' | 'horizontal';
+    /** Field size (mirrors co-input): s 28 / sm 32 / md 40 / lg 48. */
+    size: 's' | 'sm' | 'md' | 'lg';
+    /** Default country ISO2 code (e.g. "CO", "US"). Optional — if not set, starts empty. */
+    defaultCountry: string;
+    /** Emits the full phone string on change. */
+    coChange: EventEmitter<string>;
+    private selectedIso2;
+    private numberPart;
+    private isOpen;
+    private searchQuery;
+    private get selectedEntry();
+    private get filteredCountries();
+    /** Country name with the matched substring wrapped for highlighting. */
+    private renderName;
+    onValueChange(newVal: string): void;
+    onDefaultCountryChange(iso2: string): void;
+    componentWillLoad(): void;
+    private get hasCountry();
+    private get statusIcon();
+    private findDialCodeInValue;
+    private emitValue;
+    private handleCountrySelect;
+    private handleNumberInput;
+    private handleToggleDropdown;
+    private handleSearchInput;
+    private handleOutsideClick;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): any;
+}

package/dist/types/components/co-phone-field/dial-codes.d.ts

@@ -0,0 +1,14 @@
+export interface DialCode {
+    iso2: string;
+    dialCode: string;
+    name: string;
+}
+/**
+ * Dial codes sorted by name. Covers the full ITU-T E.164 assignment.
+ * The iso2 key matches country-flag-icons' 3x2/{ISO2} naming.
+ */
+export declare const DIAL_CODES: DialCode[];
+/** ISO2 code → DialCode entry lookup. */
+export declare const DIAL_CODE_MAP: Record<string, DialCode>;
+/** Convert ISO2 country code to Unicode flag emoji. */
+export declare function iso2ToEmoji(iso2: string): string;

package/dist/types/components/co-popover/co-popover.d.ts

@@ -36,6 +36,15 @@ export declare class CoPopover {
     private handleDocumentClickManual;
     private handleDocumentKeydownManual;
     private updatePosition;
+    /**
+     * Promote the panel to the browser top layer (Popover API) so an ancestor's
+     * filter / mask / overflow / transform can't clip it. Mirrors co-overlay.
+     * The API promotes WITHOUT moving the DOM node — slots, inherited custom
+     * properties, composedPath() outside-click and nested popovers all keep
+     * working. No-ops where unsupported (graceful fallback to in-place fixed
+     * positioning + offset-ancestor compensation, see updatePosition).
+     */
+    private promotePanel;
     private scheduleUpdate;
     private addScrollListeners;
     private cleanupListeners;

package/dist/types/components/co-progress-bar/co-progress-bar.d.ts

@@ -10,5 +10,7 @@ export declare class CoProgressBar {
     variant: 'solid' | 'dashed';
     /** Height of the bar in px */
     thickness: number;
+    /** Indeterminate mode: ignore `value` and run a looping sweep animation. */
+    indeterminate: boolean;
     render(): any;
 }

package/dist/types/components/co-progress-circle/co-progress-circle.d.ts

@@ -0,0 +1,16 @@
+/**
+ * A circular progress indicator with status colors and optional label.
+ */
+export declare class CoProgressCircle {
+    /** Progress value 0-100 */
+    value: number;
+    /** Status / color variant */
+    status: 'default' | 'success' | 'warning' | 'error';
+    /** Diameter of the circle in px */
+    size: number;
+    /** Stroke width in px */
+    strokeWidth: number;
+    /** Show percentage label inside */
+    showLabel: boolean;
+    render(): any;
+}

package/dist/types/components/co-radio-group/co-radio-group.d.ts

@@ -14,6 +14,8 @@ export declare class CoRadioGroup {
     secondaryLabel?: string;
     /** Helper text displayed below the options */
     helperText?: string;
+    /** Label layout: vertical (label above) or horizontal (label beside) */
+    layout: 'vertical' | 'horizontal';
     /** Validation status */
     status: 'default' | 'error' | 'success' | 'warning' | 'info';
     /** Currently selected value */

package/dist/types/components/co-ref-field/co-ref-field.d.ts

@@ -5,7 +5,11 @@ export interface RefFieldOption {
     description?: string;
     icon?: string;
     color?: string;
+    /** Initials/short text for the avatar bubble (fallback when no image). */
     avatar?: string;
+    /** Image URL for the avatar (e.g. a user's profile picture). Falls back to
+     *  `avatar` initials + `color` if absent or it fails to load. */
+    image?: string;
 }
 export interface RefFieldDisplayItem {
     _id: string;
@@ -13,10 +17,15 @@ export interface RefFieldDisplayItem {
     description?: string;
     color?: string;
     avatar?: string;
+    image?: string;
 }
 export declare class CoRefField {
     label?: string;
+    /** Whether the field is required (renders a required marker on the label). */
+    required: boolean;
     secondaryLabel?: string;
+    /** Phosphor icon name rendered before the label text. */
+    labelIcon?: string;
     placeholder: string;
     disabled: boolean;
     clearable: boolean;
@@ -24,6 +33,17 @@ export declare class CoRefField {
     status: 'default' | 'error' | 'success' | 'warning';
     helperText?: string;
     iconLeft?: string;
+    /** Label layout: vertical (label above) or horizontal (label beside) */
+    layout: 'vertical' | 'horizontal';
+    /**
+     * Size of the trigger (mirrors co-input): s 28 / sm 32 / md 40 / lg 48.
+     *
+     * `'default'` is a deprecated alias of `'md'`, kept for backwards
+     * compatibility with the old `'default' | 'sm'` scale — use `'md'` instead.
+     */
+    size: 's' | 'sm' | 'md' | 'lg' | 'default';
+    /** Common-scale size with the legacy `'default'` alias normalized to `'md'`. */
+    private get normalizedSize();
     /** Selected value: single ID string or JSON array of IDs. */
     value: string;
     /** JSON array of options to display: RefFieldOption[] */
@@ -46,8 +66,21 @@ export declare class CoRefField {
     footerPrimaryLabel: string;
     /** Label for the secondary footer button. */
     footerSecondaryLabel: string;
-    /** Max chips visible in multiple mode before "+N" badge. */
+    /**
+     * Max chips visible in multiple mode before the "+N" badge.
+     * `0` (default) = responsive: the trigger stays single-line and shows as
+     * many chips as actually fit its current width (ResizeObserver-driven);
+     * the badge counts the rest. Set `> 0` to force a fixed cap instead.
+     */
     maxChips: number;
+    /** Panel color theme. 'auto' follows trigger, 'dark' forces dark panel, 'light' forces light. */
+    panelTheme: 'auto' | 'dark' | 'light';
+    /**
+     * Shape of the leading avatar (selected value + option rows). Defaults to
+     * 'circle' (people refs); use 'square' for company/workspace refs — it renders
+     * a smooth squircle. The avatar border can be themed via --co-avatar-border-color.
+     */
+    avatarShape: 'circle' | 'square';
     coChange: EventEmitter<{
         value: string | string[];
         item: RefFieldOption;
@@ -64,9 +97,22 @@ export declare class CoRefField {
     el: HTMLElement;
     isOpen: boolean;
     searchText: string;
+    /** How many trailing chips don't fit the trigger width (responsive mode). */
+    overflowCount: number;
     private searchInputEl?;
     private optionsEl?;
+    private osInstance?;
     private debounceTimer?;
+    private chipsEl?;
+    private observedChipsEl?;
+    private lastChipsKey;
+    private resizeObserver?;
+    /** Selection captured when the panel opens — the dropdown partitions
+     *  selected-first against THIS set so options don't jump while toggling. */
+    private sortSnapshot;
+    /** Display items for the selection captured at open (value order), used to
+     *  prepend selected items the current options page doesn't contain. */
+    private openDisplaySnapshot;
     private get parsedOptions();
     private get parsedSelectedDisplay();
     /**
@@ -77,7 +123,16 @@ export declare class CoRefField {
     private get parsedValue();
     private get hasMore();
     private get remainingCount();
+    componentWillLoad(): void;
+    connectedCallback(): void;
+    componentDidRender(): void;
     disconnectedCallback(): void;
+    /**
+     * Counts how many trailing chips overflow the single-line chips wrapper
+     * (they're kept in the DOM, clipped + visibility:hidden) so the "+N" badge
+     * reflects the REAL available width. Skipped when `maxChips > 0` (fixed cap).
+     */
+    private calcOverflow;
     onOpenChange(isOpen: boolean): void;
     private handlePopoverOpen;
     private handlePopoverClose;
@@ -91,8 +146,21 @@ export declare class CoRefField {
     private handleFooterPrimary;
     private handleFooterSecondary;
     private renderTrigger;
+    /**
+     * Leading visual for a selected value / option. Prefers a real avatar
+     * (image with initials+color fallback, via <co-avatar>), then a color dot.
+     * `size`: 'xxs' (24px) for the selected value, 'xs' (32px) for option rows.
+     */
+    private renderItemAvatar;
     private renderSingleValue;
     private renderMultipleValue;
+    /**
+     * Options in display order: the selection captured at open comes FIRST
+     * (in chip/value order, including selected items the current page doesn't
+     * contain — synthesized from their display item), then the rest in server
+     * order. While searching, only real results render (still selected-first).
+     */
+    private get orderedOptions();
     private renderPanel;
     render(): any;
 }

package/dist/types/components/co-rich-text-editor/co-rich-text-editor.d.ts

@@ -0,0 +1,246 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import type { Editor, RichTextOutput, RichTextPreset, ToolbarVariant } from '@prolibu-suite/cobalt-rich-text';
+/**
+ * Rich text editor backed by Tiptap v3.
+ *
+ * Uses `shadow: false, scoped: false` (the co-data-table pattern) because
+ * ProseMirror builds its editable DOM imperatively — Stencil's scoped CSS would
+ * never reach it. All styles live in light DOM via BEM + `--co-*` tokens.
+ *
+ * @part wrapper - Outer container
+ * @part toolbar - Formatting toolbar
+ * @part content - Editable ProseMirror surface
+ * @part label - Field label
+ * @part helper - Helper text row
+ */
+export declare class CoRichTextEditor {
+    el: HTMLElement;
+    /** ProseMirror document as a JSON string. `null`/empty = empty editor. */
+    value: string | null;
+    /** Preset controlling allowed nodes/marks, toolbar and sanitization. */
+    preset: RichTextPreset;
+    placeholder: string;
+    label?: string;
+    secondaryLabel?: string;
+    helperText?: string;
+    status: 'default' | 'error' | 'success' | 'warning' | 'info';
+    disabled: boolean;
+    readonly: boolean;
+    required: boolean;
+    maxLength?: number;
+    showCharacterCount: boolean;
+    autofocus: boolean;
+    /** Toolbar layout. `auto` uses the preset default. */
+    toolbar: ToolbarVariant;
+    /** Feature overrides (JSON string for HTML attr, or object via JS property). */
+    features?: string | object;
+    /**
+     * Extra Tiptap extensions appended to the preset (JS property only).
+     * Registered at editor creation — required for new schema nodes (images,
+     * tables, embeds, …) that `getEditorInstance()` cannot add afterwards.
+     */
+    customExtensions?: object[];
+    /** Host image upload handler (JS property): `(file) => Promise<url>`. */
+    imageUpload?: (file: File) => Promise<string>;
+    /**
+     * Font families available in the bubble menu font selector.
+     * JS property: `Array<{ label: string; value: string }>`.
+     * HTML attribute: JSON string of the same array.
+     * If not provided, a default list of system fonts is used.
+     */
+    fontFamilies?: string | {
+        label: string;
+        value: string;
+    }[];
+    /**
+     * Account/imported fonts shown in a separate "Imported fonts" section.
+     * JS property: `Array<{ label: string; value: string }>`.
+     * HTML attribute: JSON string of the same array.
+     */
+    accountFonts?: string | {
+        label: string;
+        value: string;
+    }[];
+    /** Whether account fonts are currently loading. */
+    fontsLoading?: boolean;
+    /**
+     * Async callback that loads account/imported fonts.
+     * Called once when the font dropdown opens for the first time.
+     * Must return `Array<{ label: string; value: string; url?: string }>`.
+     * If `url` is provided, the font is registered via FontFace API.
+     * JS property only — cannot be set via HTML attribute.
+     */
+    fontLoader?: () => Promise<{
+        label: string;
+        value: string;
+        url?: string;
+    }[]>;
+    /** BCP-47 locale for UI strings (e.g. 'en', 'es-CO', 'pt-BR'). Default English. */
+    locale: string;
+    /** Emitted on every keystroke. */
+    coInput: EventEmitter<RichTextOutput>;
+    /** Emitted on blur (committed value). */
+    coChange: EventEmitter<RichTextOutput>;
+    coFocus: EventEmitter<void>;
+    coBlur: EventEmitter<void>;
+    coClear: EventEmitter<void>;
+    /** Emitted once the editor is mounted and ready. */
+    coReady: EventEmitter<void>;
+    /** Emitted when the font dropdown opens — host should load account fonts. */
+    coFontPopupShow: EventEmitter<void>;
+    /** Emitted when the font dropdown closes. */
+    coFontPopupHide: EventEmitter<void>;
+    ready: boolean;
+    hasFocus: boolean;
+    /** Character count — updated imperatively to avoid re-renders on every keystroke. */
+    private charCount;
+    private charCountEl?;
+    private editor?;
+    private contentEl?;
+    private toolbarEl?;
+    private bubbleEl?;
+    private bubbleLinkFormEl?;
+    private bubbleLinkInputEl?;
+    private bubbleLinkUnlinkEl?;
+    private bubbleDragged;
+    private bubbleDragOffset;
+    private bubbleDragPos;
+    private bubbleDragMoveHandler?;
+    private bubbleDragEndHandler?;
+    private bubbleOutsideClickHandler?;
+    /** Position lock — prevents floating-ui from repositioning the bubble during toolbar interactions. */
+    private bubblePositionLocked;
+    private bubbleLockPos;
+    private bubbleLockTimer?;
+    private bubbleStyleObserver?;
+    private applyingBubbleLock;
+    /** Cached render function for font dropdown (re-invoked when accountFonts changes). */
+    private _fontDropdownRenderFn?;
+    private _fontDropdownSearchInput?;
+    /** Account fonts loaded via fontLoader callback. */
+    private _loadedAccountFonts;
+    private _fontLoaderCalled;
+    private _fontLoaderLoading;
+    /** Last emitted JSON string — guards the value Watch against feedback loops. */
+    private lastEmittedJson;
+    /** Last emitted HTML string — parents often send HTML back via value prop. */
+    private lastEmittedHtml;
+    /** True while applying an external value (suppresses emit). */
+    private applyingExternal;
+    private rt;
+    private blurTimeout?;
+    /** Image layout floating toolbar. */
+    private imgLayoutEl?;
+    private imgLayoutVisible;
+    componentDidLoad(): Promise<void>;
+    disconnectedCallback(): void;
+    componentDidRender(): void;
+    onAccountFontsChange(): void;
+    onValueChange(next: string | null): void;
+    onEditableChange(): void;
+    getJSON(): Promise<object | null>;
+    getHtml(): Promise<string>;
+    getText(): Promise<string>;
+    clear(): Promise<void>;
+    focusEditor(): Promise<void>;
+    setContent(content: string | object): Promise<void>;
+    getEditorInstance(): Promise<Editor | null>;
+    /** Whether the image node is enabled (mirrors presets.ts `wantImage` logic). */
+    private get imagesEnabled();
+    private get parsedFeatures();
+    private parseValue;
+    private sanitizeHtml;
+    private buildOutput;
+    private handleUpdate;
+    private handleFocus;
+    private handleBlur;
+    /** Lock the bubble position so floating-ui doesn't reposition it. */
+    private lockBubblePosition;
+    /** Apply fixed position to the bubble, overriding floating-ui. */
+    private applyBubbleFixedPosition;
+    /** Watch for floating-ui style changes and override them when locked/dragged. */
+    private setupBubbleStyleObserver;
+    /**
+     * Hide/show the selection bubble while a toolbar dropdown is open. Uses a
+     * class with `!important` so it wins over the BubbleMenu plugin's inline
+     * display/visibility writes. When unsuppressed, the plugin's own state
+     * (selection still active) reveals it again on the next update.
+     */
+    private suppressBubble;
+    /** Close all open sub-dropdowns inside the bubble. */
+    private closeBubbleDropdowns;
+    private refreshCharCount;
+    private syncToolbar;
+    private get resolvedToolbar();
+    private static readonly DEFAULT_FONTS;
+    private get resolvedFontFamilies();
+    private get resolvedAccountFonts();
+    /** Register a font via FontFace API so it can be previewed. */
+    private static readonly _registeredFonts;
+    private registerFontFace;
+    /** Load account fonts via the fontLoader callback (called once). */
+    private loadFontsViaCallback;
+    private get helperIcon();
+    /**
+     * Create the bubble menu element imperatively. BubbleMenu v3 manages
+     * the element via remove()/appendChild(), which conflicts with Stencil's
+     * virtual DOM reconciliation. By creating it outside the VDOM, Stencil
+     * won't recreate or interfere with the element.
+     */
+    private createBubbleElement;
+    /** Helper: create a separator span */
+    private createSep;
+    /**
+     * Position a dropdown above or below the trigger depending on available
+     * viewport space. Sets `data-position="above"|"below"` so CSS can flip.
+     */
+    private positionDropdown;
+    private positionPanelNearBubble;
+    /** Helper: create a toggle button for the bubble */
+    private createBubbleBtn;
+    /** Creates the font family dropdown with search for the bubble menu. */
+    private createBubbleFontFamilySelect;
+    /** Creates a compact dropdown-select for the bubble menu. */
+    private createBubbleSelect;
+    /** Creates a compact color picker button for the bubble menu. */
+    private createBubbleColorPicker;
+    /** Close all bubble popups EXCEPT the given element. */
+    private closeAllBubblePopups;
+    private addDragHeader;
+    /** Generic draggable panel factory. */
+    private createBubblePanel;
+    /** Font size panel with visual preview and custom input. */
+    private createBubbleFontSizePanel;
+    /** Font weight panel with two-column layout and visual preview. */
+    private createBubbleFontWeightPanel;
+    /** Line height panel with custom input. */
+    private createBubbleLineHeightPanel;
+    /** Letter spacing panel with custom input. */
+    private createBubbleLetterSpacingPanel;
+    /** Background color panel for overflow menu. */
+    private createBubbleBgColorPanel;
+    /** Overflow menu (three-dots ⋮) with dynamic table context section. */
+    private createBubbleOverflowMenu;
+    private toggleBubbleLinkForm;
+    private submitBubbleLinkImperative;
+    private updateBubbleActiveStates;
+    private static readonly IMG_LAYOUT_ICONS;
+    private createImageLayoutBar;
+    private setImageLayout;
+    private getSelectedImageInfo;
+    /**
+     * Tag every image container with its layout mode (`data-image-layout`) so the
+     * stylesheet's responsive rules apply, and clear any stray inline positioning
+     * left over from legacy absolute-positioned content. Layout is CSS-only now
+     * (it reflows and collapses on mobile); we only set the attribute here.
+     *
+     * Runs on every transaction. The resize NodeView's `onUpdate` returns `true`,
+     * so ProseMirror never reflects attribute changes to the DOM — we must read
+     * from state and write the attribute imperatively to the container.
+     */
+    private syncImageLayouts;
+    /** Reposition only the layout bar (used during drag for performance). */
+    private updateImageLayoutBarPosition;
+    private updateImageLayoutBar;
+    render(): any;
+}