@gravity-ui/markdown-editor 14.12.0 → 14.12.1

package/build/esm/modules/toolbars/types.d.ts

@@ -1,11 +1,10 @@
-import type { RefObject } from 'react';
 import type { HotkeyProps } from '@gravity-ui/uikit';
 import type { EditorState } from 'prosemirror-state';
-import type { ActionStorage } from '../../core';
-import type { CodeEditor } from '../../markup';
-import type { ToolbarBaseProps, ToolbarDataType, ToolbarIconData } from '../../toolbar';
-export declare type ToolbarItemId = string & {};
-export declare type ToolbarListId = string & {};
+import type { ActionStorage } from "../../core/index.js";
+import type { CodeEditor } from "../../markup/index.js";
+import type { ToolbarBaseProps, ToolbarDataType, ToolbarIconData } from "../../toolbar/index.js";
+export type ToolbarItemId = string & {};
+export type ToolbarListId = string & {};
 export interface ToolbarList {
     id: ToolbarListId;
     items: ToolbarItemId[];
@@ -13,7 +12,7 @@ export interface ToolbarList {
 /**
  * The default value for the `type` property is `ToolbarDataType.SingleButton`.
  */
-export declare type ToolbarItemView<T extends ToolbarDataType = ToolbarDataType.SingleButton> = {
+export type ToolbarItemView<T extends ToolbarDataType = ToolbarDataType.SingleButton> = {
     className?: string;
     hint?: string | (() => string);
     hotkey?: HotkeyProps['value'];
@@ -33,29 +32,29 @@ export interface EditorActions<E> {
     isActive(editor: E): boolean;
     isEnable(editor: E): boolean;
 }
-declare type ToolbarItemEditor<T, E> = Partial<EditorActions<E>> & {
+type ToolbarItemEditor<T, E> = Partial<EditorActions<E>> & {
     hintWhenDisabled?: boolean | string | (() => string);
     condition?: ((state: EditorState) => void) | 'enabled';
 } & (T extends ToolbarDataType.ButtonPopup ? {
     renderPopup: (props: ToolbarBaseProps<E> & {
         hide: () => void;
-        anchorRef: RefObject<HTMLElement>;
+        anchorElement: HTMLElement | null;
     }) => React.ReactNode;
 } : T extends ToolbarDataType.ReactComponent ? {
     width: number;
     component: React.ComponentType<ToolbarBaseProps<E>>;
 } : {});
-export declare type ToolbarItemWysiwyg<T extends ToolbarDataType = ToolbarDataType.SingleButton> = ToolbarItemEditor<T, ActionStorage>;
-export declare type ToolbarItemMarkup<T extends ToolbarDataType = ToolbarDataType.SingleButton> = ToolbarItemEditor<T, CodeEditor>;
-export declare type ToolbarItem<T extends ToolbarDataType> = {
+export type ToolbarItemWysiwyg<T extends ToolbarDataType = ToolbarDataType.SingleButton> = ToolbarItemEditor<T, ActionStorage>;
+export type ToolbarItemMarkup<T extends ToolbarDataType = ToolbarDataType.SingleButton> = ToolbarItemEditor<T, CodeEditor>;
+export type ToolbarItem<T extends ToolbarDataType> = {
     view: ToolbarItemView<T>;
     wysiwyg?: ToolbarItemWysiwyg<T>;
     markup?: ToolbarItemMarkup<T>;
 };
-export declare type ToolbarsItems = Record<ToolbarItemId, ToolbarItem<ToolbarDataType>>;
-export declare type ToolbarId = string;
-export declare type ToolbarOrders = (ToolbarList | ToolbarItemId)[][];
-export declare type ToolbarsOrders = Record<ToolbarId, ToolbarOrders>;
+export type ToolbarsItems = Record<ToolbarItemId, ToolbarItem<ToolbarDataType>>;
+export type ToolbarId = string;
+export type ToolbarOrders = (ToolbarList | ToolbarItemId)[][];
+export type ToolbarsOrders = Record<ToolbarId, ToolbarOrders>;
 export interface ToolbarsPreset {
     items: ToolbarsItems;
     orders: ToolbarsOrders;

package/build/esm/modules/toolbars/types.js

@@ -1 +1,2 @@
 export {};
+//# sourceMappingURL=types.js.map

package/build/esm/modules/toolbars/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"../../../../src","sources":["modules/toolbars/types.ts"],"names":[],"mappings":"","sourcesContent":["import type {HotkeyProps} from '@gravity-ui/uikit';\nimport type {EditorState} from 'prosemirror-state';\n\nimport type {ActionStorage} from '../../core';\nimport type {CodeEditor} from '../../markup';\nimport type {ToolbarBaseProps, ToolbarDataType, ToolbarIconData} from '../../toolbar';\n\n// Items\nexport type ToolbarItemId = string & {};\nexport type ToolbarListId = string & {};\n\nexport interface ToolbarList {\n    id: ToolbarListId;\n    items: ToolbarItemId[];\n}\n\n/**\n * The default value for the `type` property is `ToolbarDataType.SingleButton`.\n */\nexport type ToolbarItemView<T extends ToolbarDataType = ToolbarDataType.SingleButton> = {\n    className?: string;\n    hint?: string | (() => string);\n    hotkey?: HotkeyProps['value'];\n    type?: ToolbarDataType;\n    doNotActivateList?: boolean;\n} & (T extends ToolbarDataType.SingleButton\n    ? {\n          icon: ToolbarIconData;\n          title: string | (() => string);\n          preview?: React.ReactNode;\n      }\n    : T extends ToolbarDataType.ListButton\n      ? {\n            withArrow?: boolean;\n            icon: ToolbarIconData;\n            title: string | (() => string);\n        }\n      : {});\n\nexport interface EditorActions<E> {\n    exec(editor: E): void;\n    isActive(editor: E): boolean;\n    isEnable(editor: E): boolean;\n}\n\ntype ToolbarItemEditor<T, E> = Partial<EditorActions<E>> & {\n    hintWhenDisabled?: boolean | string | (() => string);\n    condition?: ((state: EditorState) => void) | 'enabled';\n} & (T extends ToolbarDataType.ButtonPopup\n        ? {\n              renderPopup: (\n                  props: ToolbarBaseProps<E> & {\n                      hide: () => void;\n                      anchorElement: HTMLElement | null;\n                  },\n              ) => React.ReactNode;\n          }\n        : T extends ToolbarDataType.ReactComponent\n          ? {\n                width: number;\n                component: React.ComponentType<ToolbarBaseProps<E>>;\n            }\n          : {});\n\nexport type ToolbarItemWysiwyg<T extends ToolbarDataType = ToolbarDataType.SingleButton> =\n    ToolbarItemEditor<T, ActionStorage>;\nexport type ToolbarItemMarkup<T extends ToolbarDataType = ToolbarDataType.SingleButton> =\n    ToolbarItemEditor<T, CodeEditor>;\n\nexport type ToolbarItem<T extends ToolbarDataType> = {\n    view: ToolbarItemView<T>;\n    wysiwyg?: ToolbarItemWysiwyg<T>;\n    markup?: ToolbarItemMarkup<T>;\n};\nexport type ToolbarsItems = Record<ToolbarItemId, ToolbarItem<ToolbarDataType>>;\n\n// Orders\nexport type ToolbarId = string;\nexport type ToolbarOrders = (ToolbarList | ToolbarItemId)[][];\nexport type ToolbarsOrders = Record<ToolbarId, ToolbarOrders>;\n\nexport interface ToolbarsPreset {\n    items: ToolbarsItems;\n    orders: ToolbarsOrders;\n}\n"]}

package/build/esm/package.json

@@ -0,0 +1 @@
+{"type":"module"}

package/build/esm/plugins/BaseTooltip/index.d.ts

@@ -1,16 +1,15 @@
-import React, { ReactNode } from 'react';
 import { PopupPlacement, PopupProps } from '@gravity-ui/uikit';
 import { Mark, MarkType, Node, NodeType } from 'prosemirror-model';
 import { PluginView } from 'prosemirror-state';
 import { EditorView } from 'prosemirror-view';
-import { RendererItem } from '../../extensions';
-import './index.css';
-export declare type BaseTooltipNode = {
+import { RendererItem } from "../../extensions/index.js";
+import "./index.css";
+export type BaseTooltipNode = {
     pos: number;
     node: Node;
     dom: HTMLElement | null;
 };
-export declare type TooltipContentCb = (view: EditorView, node: BaseTooltipNode, onChange?: (attrs: Record<string, string>) => void, forceEdit?: boolean, onOutsideClick?: () => void) => React.ReactElement | null;
+export type TooltipContentCb = (view: EditorView, node: BaseTooltipNode, onChange?: (attrs: Record<string, string>) => void, forceEdit?: boolean, onOutsideClick?: () => void) => React.ReactElement | null;
 export interface BaseTooltipPluginOptions {
     idPrefix: string;
     content?: TooltipContentCb;
@@ -21,13 +20,13 @@ export interface BaseTooltipPluginOptions {
 export declare const BaseTooltipCn: import("@bem-react/classname").ClassNameFormatter;
 export declare const defaultPlacement: PopupPlacement;
 export declare const baseTooltipContentCn: import("@bem-react/classname").ClassNameFormatter;
-export declare type TooltipOnChangeCallback = (attrs: Record<string, string>, options?: {
+export type TooltipOnChangeCallback = (attrs: Record<string, string>, options?: {
     setFocus?: boolean;
     setSelection?: boolean;
     hideTooltip?: boolean;
     marks?: Mark[];
 }) => void;
-export declare type TooltipContentProps = {
+export type TooltipContentProps = {
     node: BaseTooltipNode;
     view: EditorView;
     onChange?: TooltipOnChangeCallback;
@@ -54,10 +53,10 @@ export declare class BaseTooltipPluginView implements PluginView {
     protected updateTooltipView(): void;
     protected render(): void;
     protected onOutsideClick: PopupProps['onOutsideClick'];
-    protected popupCloseHandler: PopupProps['onClose'];
+    protected popupOpenChangeHandler: PopupProps['onOpenChange'];
     protected startTrackingViewFocus(): void;
     protected stopTrackingViewFocus(): void;
     protected hidePopupManual(): void;
-    protected renderContent(currentNode: BaseTooltipNode): ReactNode;
+    protected renderContent(currentNode: BaseTooltipNode): React.ReactNode;
     protected createRenderItem(): RendererItem;
 }

package/build/esm/plugins/BaseTooltip/index.js

@@ -1,11 +1,12 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Popup } from '@gravity-ui/uikit';
 import { NodeSelection } from 'prosemirror-state';
+// @ts-ignore // TODO: fix cjs build
 import { findDomRefAtPos, findParentNodeOfType, findSelectedNodeOfType } from 'prosemirror-utils';
-import { cn } from '../../classname';
-import { getReactRendererFromState } from '../../extensions';
-import { ErrorLoggerBoundary } from '../../react-utils/ErrorBoundary';
-import './index.css';
+import { cn } from "../../classname.js";
+import { getReactRendererFromState } from "../../extensions/index.js";
+import { ErrorLoggerBoundary } from "../../react-utils/ErrorBoundary.js";
+import "./index.css";
 export const BaseTooltipCn = cn('base-tooltip');
 export const defaultPlacement = [
     'bottom-start',
@@ -16,46 +17,18 @@ export const defaultPlacement = [
 const b = BaseTooltipCn;
 export const baseTooltipContentCn = cn('base-tooltip-content');
 export class BaseTooltipPluginView {
+    view;
+    currentNode = null;
+    content;
+    nodeType;
+    popupPlacement;
+    manualHidden = false;
+    destroyed = false;
+    disableHideOnEscapeKeyDown;
+    focusTrackingRafId = null;
+    idPrefix;
+    renderItem;
     constructor(view, options) {
-        this.currentNode = null;
-        this.manualHidden = false;
-        this.destroyed = false;
-        this.focusTrackingRafId = null;
-        this.onEscapeDown = () => {
-            if (this.disableHideOnEscapeKeyDown)
-                return false;
-            if (this.currentNode && !this.manualHidden) {
-                this.hidePopupManual();
-                return true;
-            }
-            return false;
-        };
-        this.changeAttrsCb = (attrs, options) => {
-            if (this.currentNode) {
-                let tr = this.view.state.tr.setNodeMarkup(this.currentNode.pos, undefined, Object.assign(Object.assign({}, this.currentNode.node.attrs), attrs), (options === null || options === void 0 ? void 0 : options.marks) || []);
-                if (options === null || options === void 0 ? void 0 : options.setSelection) {
-                    tr = tr.setSelection(NodeSelection.create(tr.doc, this.currentNode.pos));
-                }
-                this.view.dispatch(tr);
-                if (options === null || options === void 0 ? void 0 : options.setFocus) {
-                    this.view.focus();
-                }
-                if (options === null || options === void 0 ? void 0 : options.hideTooltip) {
-                    this.hidePopupManual();
-                }
-            }
-        };
-        this.onOutsideClick = () => {
-            this.hidePopupManual();
-        };
-        this.popupCloseHandler = (_e, reason) => {
-            if (this.disableHideOnEscapeKeyDown && reason === 'escapeKeyDown')
-                return;
-            this.hidePopupManual();
-            if (reason === 'outsideClick' && !this.view.hasFocus()) {
-                this.startTrackingViewFocus();
-            }
-        };
         this.view = view;
         this.idPrefix = options.idPrefix;
         this.content = options.content;
@@ -68,11 +41,19 @@ export class BaseTooltipPluginView {
         this.updateTooltipView();
     }
     destroy() {
-        var _a;
         this.destroyed = true;
-        (_a = this.renderItem) === null || _a === void 0 ? void 0 : _a.remove();
+        this.renderItem?.remove();
         this.renderItem = undefined;
     }
+    onEscapeDown = () => {
+        if (this.disableHideOnEscapeKeyDown)
+            return false;
+        if (this.currentNode && !this.manualHidden) {
+            this.hidePopupManual();
+            return true;
+        }
+        return false;
+    };
     setCurrentNode(node) {
         const view = this.view;
         const domAtPos = view.domAtPos.bind(view);
@@ -99,27 +80,62 @@ export class BaseTooltipPluginView {
             dom,
         };
     }
+    changeAttrsCb = (attrs, options) => {
+        if (this.currentNode) {
+            let tr = this.view.state.tr.setNodeMarkup(this.currentNode.pos, undefined, {
+                ...this.currentNode.node.attrs,
+                ...attrs,
+            }, options?.marks || []);
+            if (options?.setSelection) {
+                tr = tr.setSelection(NodeSelection.create(tr.doc, this.currentNode.pos));
+            }
+            this.view.dispatch(tr);
+            if (options?.setFocus) {
+                this.view.focus();
+            }
+            if (options?.hideTooltip) {
+                this.hidePopupManual();
+            }
+        }
+    };
     updateTooltipView() {
-        var _a;
         const oldNode = this.currentNode;
         this.setCurrentNode(this.view.state.schema.nodes[this.nodeType.name]);
         // Do not rerender if we have the same node in selection
         if (oldNode &&
-            ((_a = this.currentNode) === null || _a === void 0 ? void 0 : _a.node.eq(oldNode.node)) &&
+            this.currentNode?.node.eq(oldNode.node) &&
             this.currentNode.pos === oldNode.pos &&
             this.currentNode.dom === oldNode.dom)
             return;
         this.render();
     }
     render() {
-        var _a;
         if (this.destroyed)
             return;
-        this.renderItem = (_a = this.renderItem) !== null && _a !== void 0 ? _a : this.createRenderItem();
+        this.renderItem = this.renderItem ?? this.createRenderItem();
         this.renderItem.rerender();
     }
+    onOutsideClick = () => {
+        this.hidePopupManual();
+    };
+    popupOpenChangeHandler = (open, event, reason) => {
+        if (open)
+            return;
+        if (reason === 'focus-out' && event.relatedTarget === this.view.dom)
+            return;
+        if (this.disableHideOnEscapeKeyDown && reason === 'escape-key')
+            return;
+        this.hidePopupManual();
+        requestAnimationFrame(() => {
+            if (this.destroyed || this.view.hasFocus())
+                return;
+            this.startTrackingViewFocus();
+        });
+    };
     startTrackingViewFocus() {
         this.focusTrackingRafId = requestAnimationFrame(() => {
+            if (this.destroyed)
+                return;
             if (this.view.hasFocus()) {
                 this.focusTrackingRafId = null;
                 this.manualHidden = false;
@@ -144,10 +160,10 @@ export class BaseTooltipPluginView {
             return null;
         // hack for popup rerender
         window.dispatchEvent(new CustomEvent('scroll'));
-        return (React.createElement(Popup, { open: true, hasArrow: false, contentClassName: b(), anchorRef: { current: currentNode.dom }, placement: this.popupPlacement || defaultPlacement, onClose: this.popupCloseHandler },
-            React.createElement("div", null, this.content(this.view, currentNode, this.changeAttrsCb))));
+        return (_jsx(Popup, { open: true, hasArrow: false, anchorElement: currentNode.dom, placement: this.popupPlacement || defaultPlacement, onOpenChange: this.popupOpenChangeHandler, children: _jsx("div", { className: b(), children: this.content(this.view, currentNode, this.changeAttrsCb) }) }));
     }
     createRenderItem() {
-        return getReactRendererFromState(this.view.state).createItem(this.idPrefix, () => this.currentNode && !this.manualHidden ? (React.createElement(ErrorLoggerBoundary, null, this.renderContent(this.currentNode))) : null);
+        return getReactRendererFromState(this.view.state).createItem(this.idPrefix, () => this.currentNode && !this.manualHidden ? (_jsx(ErrorLoggerBoundary, { children: this.renderContent(this.currentNode) })) : null);
     }
 }
+//# sourceMappingURL=index.js.map

package/build/esm/plugins/BaseTooltip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../src","sources":["plugins/BaseTooltip/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Popup, PopupPlacement, PopupProps} from '@gravity-ui/uikit';\nimport {Mark, MarkType, Node, NodeType} from 'prosemirror-model';\nimport {NodeSelection, PluginView} from 'prosemirror-state';\n// @ts-ignore // TODO: fix cjs build\nimport {findDomRefAtPos, findParentNodeOfType, findSelectedNodeOfType} from 'prosemirror-utils';\nimport {EditorView} from 'prosemirror-view';\n\nimport {cn} from '../../classname';\nimport {RendererItem, getReactRendererFromState} from '../../extensions';\nimport {ErrorLoggerBoundary} from '../../react-utils/ErrorBoundary';\n\nimport './index.scss';\n\nexport type BaseTooltipNode = {\n    pos: number;\n    node: Node;\n    dom: HTMLElement | null;\n};\n\nexport type TooltipContentCb = (\n    view: EditorView,\n    node: BaseTooltipNode,\n    onChange?: (attrs: Record<string, string>) => void,\n    forceEdit?: boolean,\n    onOutsideClick?: () => void,\n) => React.ReactElement | null;\n\nexport interface BaseTooltipPluginOptions {\n    idPrefix: string;\n    content?: TooltipContentCb;\n    nodeType: NodeType | MarkType;\n    popupPlacement?: PopupPlacement;\n    disableHideOnEscapeKeyDown?: boolean;\n}\n\nexport const BaseTooltipCn = cn('base-tooltip');\nexport const defaultPlacement: PopupPlacement = [\n    'bottom-start',\n    'top-start',\n    'bottom-end',\n    'top-end',\n];\nconst b = BaseTooltipCn;\nexport const baseTooltipContentCn = cn('base-tooltip-content');\n\nexport type TooltipOnChangeCallback = (\n    attrs: Record<string, string>,\n    options?: {setFocus?: boolean; setSelection?: boolean; hideTooltip?: boolean; marks?: Mark[]},\n) => void;\n\nexport type TooltipContentProps = {\n    node: BaseTooltipNode;\n    view: EditorView;\n    onChange?: TooltipOnChangeCallback;\n    toggleEdit?: () => void;\n};\n\nexport class BaseTooltipPluginView implements PluginView {\n    protected view: EditorView;\n    protected currentNode: BaseTooltipNode | null = null;\n    protected readonly content?: TooltipContentCb;\n    protected readonly nodeType: NodeType | MarkType;\n    protected readonly popupPlacement?: PopupPlacement;\n    protected manualHidden = false;\n    protected destroyed = false;\n\n    protected readonly disableHideOnEscapeKeyDown?: boolean;\n\n    protected focusTrackingRafId: number | null = null;\n\n    private readonly idPrefix: string;\n    private renderItem?: RendererItem;\n\n    constructor(view: EditorView, options: BaseTooltipPluginOptions) {\n        this.view = view;\n        this.idPrefix = options.idPrefix;\n        this.content = options.content;\n        this.nodeType = options.nodeType;\n        this.popupPlacement = options.popupPlacement;\n        this.disableHideOnEscapeKeyDown = options.disableHideOnEscapeKeyDown;\n    }\n\n    update(view: EditorView) {\n        this.view = view;\n\n        this.updateTooltipView();\n    }\n\n    destroy() {\n        this.destroyed = true;\n        this.renderItem?.remove();\n        this.renderItem = undefined;\n    }\n\n    onEscapeDown = (): boolean => {\n        if (this.disableHideOnEscapeKeyDown) return false;\n        if (this.currentNode && !this.manualHidden) {\n            this.hidePopupManual();\n            return true;\n        }\n        return false;\n    };\n\n    protected setCurrentNode(node: NodeType) {\n        const view = this.view;\n        const domAtPos = view.domAtPos.bind(view);\n\n        const {selection} = view.state;\n        const {$from, $to} = selection;\n\n        const parent =\n            findSelectedNodeOfType(node)(selection) || findParentNodeOfType(node)(selection);\n\n        if (!parent || !$from.node(parent.depth).eq($to.node(parent.depth))) {\n            this.currentNode = null;\n            this.manualHidden = false;\n            this.stopTrackingViewFocus();\n            return;\n        }\n\n        if (\n            !this.currentNode ||\n            !this.currentNode.node.eq(parent.node) ||\n            this.currentNode.pos !== parent.pos\n        ) {\n            this.manualHidden = false;\n            this.stopTrackingViewFocus();\n        }\n\n        const {pos, node: parentNode} = parent;\n        const dom = findDomRefAtPos(pos, domAtPos) as HTMLElement;\n\n        this.currentNode = {\n            pos,\n            node: parentNode,\n            dom,\n        };\n    }\n\n    protected changeAttrsCb: TooltipOnChangeCallback = (attrs, options) => {\n        if (this.currentNode) {\n            let tr = this.view.state.tr.setNodeMarkup(\n                this.currentNode.pos,\n                undefined,\n                {\n                    ...this.currentNode.node.attrs,\n                    ...attrs,\n                },\n                options?.marks || [],\n            );\n\n            if (options?.setSelection) {\n                tr = tr.setSelection(NodeSelection.create(tr.doc, this.currentNode.pos));\n            }\n\n            this.view.dispatch(tr);\n\n            if (options?.setFocus) {\n                this.view.focus();\n            }\n\n            if (options?.hideTooltip) {\n                this.hidePopupManual();\n            }\n        }\n    };\n\n    protected updateTooltipView() {\n        const oldNode = this.currentNode;\n        this.setCurrentNode(this.view.state.schema.nodes[this.nodeType.name]);\n\n        // Do not rerender if we have the same node in selection\n        if (\n            oldNode &&\n            this.currentNode?.node.eq(oldNode.node) &&\n            this.currentNode.pos === oldNode.pos &&\n            this.currentNode.dom === oldNode.dom\n        )\n            return;\n\n        this.render();\n    }\n\n    protected render() {\n        if (this.destroyed) return;\n        this.renderItem = this.renderItem ?? this.createRenderItem();\n        this.renderItem.rerender();\n    }\n\n    protected onOutsideClick: PopupProps['onOutsideClick'] = () => {\n        this.hidePopupManual();\n    };\n\n    protected popupOpenChangeHandler: PopupProps['onOpenChange'] = (open, event, reason) => {\n        if (open) return;\n        if (reason === 'focus-out' && (event as FocusEvent).relatedTarget === this.view.dom) return;\n        if (this.disableHideOnEscapeKeyDown && reason === 'escape-key') return;\n\n        this.hidePopupManual();\n\n        requestAnimationFrame(() => {\n            if (this.destroyed || this.view.hasFocus()) return;\n            this.startTrackingViewFocus();\n        });\n    };\n\n    protected startTrackingViewFocus() {\n        this.focusTrackingRafId = requestAnimationFrame(() => {\n            if (this.destroyed) return;\n            if (this.view.hasFocus()) {\n                this.focusTrackingRafId = null;\n                this.manualHidden = false;\n                this.render();\n                return;\n            }\n            this.startTrackingViewFocus();\n        });\n    }\n\n    protected stopTrackingViewFocus() {\n        if (this.focusTrackingRafId !== null) {\n            cancelAnimationFrame(this.focusTrackingRafId);\n            this.focusTrackingRafId = null;\n        }\n    }\n\n    protected hidePopupManual() {\n        this.manualHidden = true;\n        this.render();\n    }\n\n    protected renderContent(currentNode: BaseTooltipNode): React.ReactNode {\n        if (!this.content) return null;\n        // hack for popup rerender\n        window.dispatchEvent(new CustomEvent('scroll'));\n        return (\n            <Popup\n                open\n                hasArrow={false}\n                anchorElement={currentNode.dom}\n                placement={this.popupPlacement || defaultPlacement}\n                onOpenChange={this.popupOpenChangeHandler}\n            >\n                <div className={b()}>\n                    {this.content(this.view, currentNode, this.changeAttrsCb)}\n                </div>\n            </Popup>\n        );\n    }\n\n    protected createRenderItem() {\n        return getReactRendererFromState(this.view.state)!.createItem(this.idPrefix, () =>\n            this.currentNode && !this.manualHidden ? (\n                <ErrorLoggerBoundary>{this.renderContent(this.currentNode)}</ErrorLoggerBoundary>\n            ) : null,\n        );\n    }\n}\n"]}

package/build/esm/plugins/TooltipButton/TooltipButton.d.ts

@@ -1,7 +1,6 @@
-import React from 'react';
 import { PopupProps } from '@gravity-ui/uikit';
-declare type TooltipButtonProps = Pick<PopupProps, 'onOutsideClick'> & {
-    domRef: HTMLElement | null;
+type TooltipButtonProps = Pick<PopupProps, 'onOutsideClick'> & {
+    domElem: HTMLElement | null;
     children?: React.ReactNode;
 };
 export declare const TooltipButton: React.FC<TooltipButtonProps>;

package/build/esm/plugins/TooltipButton/TooltipButton.js

@@ -1,27 +1,18 @@
-import React, { useLayoutEffect, useRef, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLayoutEffect, useState } from 'react';
 import { Ellipsis } from '@gravity-ui/icons';
 import { Button, Icon, Popup } from '@gravity-ui/uikit';
-import { useBooleanState } from '../../react-utils';
-export const TooltipButton = ({ domRef, onOutsideClick, children }) => {
-    var _a;
+import { useBooleanState, useElementState } from "../../react-utils/index.js";
+export const TooltipButton = ({ domElem, children, onOutsideClick, }) => {
     const [width, setWidth] = useState(0);
     const [open, , hide, toggleOpen] = useBooleanState(false);
     const placement = ['bottom-end', 'bottom-start'];
-    const ref = useRef(null);
-    const childrenRef = useRef(children);
+    const [anchor, setAnchor] = useElementState();
     useLayoutEffect(() => {
-        var _a, _b;
-        if ((_a = ref.current) === null || _a === void 0 ? void 0 : _a.clientWidth) {
-            setWidth((_b = ref.current) === null || _b === void 0 ? void 0 : _b.clientWidth);
+        if (anchor?.clientWidth) {
+            setWidth(anchor.clientWidth);
         }
-    }, [(_a = ref.current) === null || _a === void 0 ? void 0 : _a.clientWidth]);
-    return (React.createElement(Popup, { open: true, keepMounted: false, hasArrow: false, anchorRef: { current: domRef }, placement: 'right-start', offset: [3, -(width + 3)], onOutsideClick: onOutsideClick, modifiers: [
-            {
-                name: 'preventOverflow',
-                enabled: false,
-            },
-        ] },
-        React.createElement(Button, { onClick: toggleOpen, ref: ref, size: "s", view: open ? 'normal' : 'raised' },
-            React.createElement(Icon, { data: Ellipsis })),
-        React.createElement(Popup, { open: open, anchorRef: ref, onClose: hide, placement: placement }, childrenRef.current)));
+    }, [anchor?.clientWidth]);
+    return (_jsxs(Popup, { open: true, keepMounted: false, hasArrow: false, anchorElement: domElem, placement: 'right-start', offset: { crossAxis: 3, mainAxis: -(width + 3) }, onOutsideClick: onOutsideClick, children: [_jsx(Button, { onClick: toggleOpen, ref: setAnchor, size: "s", view: open ? 'normal' : 'raised', children: _jsx(Icon, { data: Ellipsis }) }), _jsx(Popup, { open: open, anchorElement: anchor, onClose: hide, placement: placement, children: children })] }));
 };
+//# sourceMappingURL=TooltipButton.js.map

package/build/esm/plugins/TooltipButton/TooltipButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipButton.js","sourceRoot":"../../../../src","sources":["plugins/TooltipButton/TooltipButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,eAAe,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAC,MAAM,EAAE,IAAI,EAAE,KAAK,EAA6B,MAAM,mBAAmB,CAAC;AAElF,OAAO,EAAC,eAAe,EAAE,eAAe,EAAC,mCAA0B;AAOnE,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EACxD,OAAO,EACP,QAAQ,EACR,cAAc,GACjB,EAAE,EAAE;IACD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IACtC,MAAM,CAAC,IAAI,EAAE,AAAD,EAAG,IAAI,EAAE,UAAU,CAAC,GAAG,eAAe,CAAC,KAAK,CAAC,CAAC;IAC1D,MAAM,SAAS,GAAmB,CAAC,YAAY,EAAE,cAAc,CAAC,CAAC;IACjE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,eAAe,EAAE,CAAC;IAE9C,eAAe,CAAC,GAAG,EAAE;QACjB,IAAI,MAAM,EAAE,WAAW,EAAE,CAAC;YACtB,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;QACjC,CAAC;IACL,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC;IAE1B,OAAO,CACH,MAAC,KAAK,IACF,IAAI,QACJ,WAAW,EAAE,KAAK,EAClB,QAAQ,EAAE,KAAK,EACf,aAAa,EAAE,OAAO,EACtB,SAAS,EAAE,aAAa,EACxB,MAAM,EAAE,EAAC,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,EAAC,EAC9C,cAAc,EAAE,cAAc,aAE9B,KAAC,MAAM,IAAC,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,YAClF,KAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,GAAI,GACnB,EACT,KAAC,KAAK,IAAC,IAAI,EAAE,IAAI,EAAE,aAAa,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,YACxE,QAAQ,GACL,IACJ,CACX,CAAC;AACN,CAAC,CAAC","sourcesContent":["import {useLayoutEffect, useState} from 'react';\n\nimport {Ellipsis} from '@gravity-ui/icons';\nimport {Button, Icon, Popup, PopupPlacement, PopupProps} from '@gravity-ui/uikit';\n\nimport {useBooleanState, useElementState} from '../../react-utils';\n\ntype TooltipButtonProps = Pick<PopupProps, 'onOutsideClick'> & {\n    domElem: HTMLElement | null;\n    children?: React.ReactNode;\n};\n\nexport const TooltipButton: React.FC<TooltipButtonProps> = ({\n    domElem,\n    children,\n    onOutsideClick,\n}) => {\n    const [width, setWidth] = useState(0);\n    const [open, , hide, toggleOpen] = useBooleanState(false);\n    const placement: PopupPlacement = ['bottom-end', 'bottom-start'];\n    const [anchor, setAnchor] = useElementState();\n\n    useLayoutEffect(() => {\n        if (anchor?.clientWidth) {\n            setWidth(anchor.clientWidth);\n        }\n    }, [anchor?.clientWidth]);\n\n    return (\n        <Popup\n            open\n            keepMounted={false}\n            hasArrow={false}\n            anchorElement={domElem}\n            placement={'right-start'}\n            offset={{crossAxis: 3, mainAxis: -(width + 3)}}\n            onOutsideClick={onOutsideClick}\n        >\n            <Button onClick={toggleOpen} ref={setAnchor} size=\"s\" view={open ? 'normal' : 'raised'}>\n                <Icon data={Ellipsis} />\n            </Button>\n            <Popup open={open} anchorElement={anchor} onClose={hide} placement={placement}>\n                {children}\n            </Popup>\n        </Popup>\n    );\n};\n"]}

package/build/esm/plugins/TooltipButton/index.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
 import { NodeType } from 'prosemirror-model';
 import { EditorView } from 'prosemirror-view';
-import { BaseTooltipNode, BaseTooltipPluginOptions, BaseTooltipPluginView, TooltipOnChangeCallback } from '../BaseTooltip';
-declare type ButtonContent = (view: EditorView, node: BaseTooltipNode, toggleEdit: () => void) => React.ReactElement;
-declare type FormContent = (view: EditorView, node: BaseTooltipNode, onChange?: TooltipOnChangeCallback) => React.ReactElement;
+import { BaseTooltipNode, BaseTooltipPluginOptions, BaseTooltipPluginView, TooltipOnChangeCallback } from "../BaseTooltip/index.js";
+type ButtonContent = (view: EditorView, node: BaseTooltipNode, toggleEdit: () => void) => React.ReactElement;
+type FormContent = (view: EditorView, node: BaseTooltipNode, onChange?: TooltipOnChangeCallback) => React.ReactElement;
 interface TooltipMenuOptions extends BaseTooltipPluginOptions {
     disableHideOnBlur?: boolean;
     buttonContent: ButtonContent;

package/build/esm/plugins/TooltipButton/index.js

@@ -1,19 +1,13 @@
-import React from 'react';
-import { BaseTooltipPluginView, } from '../BaseTooltip';
-import { TooltipButton } from './TooltipButton';
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { BaseTooltipPluginView, } from "../BaseTooltip/index.js";
+import { TooltipButton } from "./TooltipButton.js";
 export class TooltipButtonPluginView extends BaseTooltipPluginView {
+    enableHideOnBlur;
+    forceEdit = false;
+    buttonContent;
+    formContent;
     constructor(view, options) {
         super(view, options);
-        this.forceEdit = false;
-        this.toggleEdit = () => {
-            this.forceEdit = !this.forceEdit;
-            this.render();
-        };
-        this.onViewFocus = () => {
-            this.forceEdit = false;
-            this.manualHidden = false;
-            this.render();
-        };
         this.enableHideOnBlur = options.disableHideOnBlur !== true;
         this.buttonContent = options.buttonContent;
         this.formContent = options.formContent;
@@ -21,21 +15,29 @@ export class TooltipButtonPluginView extends BaseTooltipPluginView {
             this.view.dom.addEventListener('focus', this.onViewFocus);
         }
     }
+    toggleEdit = () => {
+        this.forceEdit = !this.forceEdit;
+        this.render();
+    };
     destroy() {
         super.destroy();
         this.view.dom.removeEventListener('focus', this.onViewFocus);
     }
     renderContent(currentNode) {
-        return (React.createElement(React.Fragment, null, this.forceEdit && this.formContent ? (React.createElement("div", null, this.formContent(this.view, currentNode, this.changeAttrsCb))) : (React.createElement(TooltipButton, { domRef: currentNode.dom, onOutsideClick: this.onOutsideClick }, this.buttonContent(this.view, currentNode, this.toggleEdit)))));
+        return (_jsx(_Fragment, { children: this.forceEdit && this.formContent ? (_jsx("div", { children: this.formContent(this.view, currentNode, this.changeAttrsCb) })) : (_jsx(TooltipButton, { domElem: currentNode.dom, onOutsideClick: this.onOutsideClick, children: this.buttonContent(this.view, currentNode, this.toggleEdit) })) }));
     }
     setCurrentNode(node) {
-        var _a, _b;
         super.setCurrentNode(node);
-        (_b = (_a = this.currentNode) === null || _a === void 0 ? void 0 : _a.dom) === null || _b === void 0 ? void 0 : _b.addEventListener('dblclick', this.toggleEdit);
+        this.currentNode?.dom?.addEventListener('dblclick', this.toggleEdit);
     }
     updateTooltipView() {
-        var _a, _b;
-        (_b = (_a = this.currentNode) === null || _a === void 0 ? void 0 : _a.dom) === null || _b === void 0 ? void 0 : _b.removeEventListener('dblclick', this.toggleEdit);
+        this.currentNode?.dom?.removeEventListener('dblclick', this.toggleEdit);
         super.updateTooltipView();
     }
+    onViewFocus = () => {
+        this.forceEdit = false;
+        this.manualHidden = false;
+        this.render();
+    };
 }
+//# sourceMappingURL=index.js.map

package/build/esm/plugins/TooltipButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../src","sources":["plugins/TooltipButton/index.tsx"],"names":[],"mappings":";AAGA,OAAO,EAGH,qBAAqB,GAExB,gCAAuB;AAExB,OAAO,EAAC,aAAa,EAAC,2BAAwB;AAoB9C,MAAM,OAAO,uBAAwB,SAAQ,qBAAqB;IACtD,gBAAgB,CAAW;IAC3B,SAAS,GAAG,KAAK,CAAC;IAClB,aAAa,CAAgB;IAC7B,WAAW,CAAc;IAEjC,YAAY,IAAgB,EAAE,OAA2B;QACrD,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAErB,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC,iBAAiB,KAAK,IAAI,CAAC;QAC3D,IAAI,CAAC,aAAa,GAAG,OAAO,CAAC,aAAa,CAAC;QAC3C,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC;QACvC,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACvB,IAAI,CAAC,IAAI,CAAC,GAAmB,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;QAC/E,CAAC;IACL,CAAC;IAED,UAAU,GAAG,GAAG,EAAE;QACd,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;QACjC,IAAI,CAAC,MAAM,EAAE,CAAC;IAClB,CAAC,CAAC;IAEF,OAAO;QACH,KAAK,CAAC,OAAO,EAAE,CAAC;QACf,IAAI,CAAC,IAAI,CAAC,GAAmB,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;IAClF,CAAC;IAES,aAAa,CAAC,WAA4B;QAChD,OAAO,CACH,4BACK,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAClC,wBAAM,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,EAAE,IAAI,CAAC,aAAa,CAAC,GAAO,CAC5E,CAAC,CAAC,CAAC,CACA,KAAC,aAAa,IAAC,OAAO,EAAE,WAAW,CAAC,GAAG,EAAE,cAAc,EAAE,IAAI,CAAC,cAAc,YACvE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,EAAE,IAAI,CAAC,UAAU,CAAC,GAChD,CACnB,GACF,CACN,CAAC;IACN,CAAC;IAES,cAAc,CAAC,IAAc;QACnC,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;QAC3B,IAAI,CAAC,WAAW,EAAE,GAAG,EAAE,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;IACzE,CAAC;IAES,iBAAiB;QACvB,IAAI,CAAC,WAAW,EAAE,GAAG,EAAE,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;QACxE,KAAK,CAAC,iBAAiB,EAAE,CAAC;IAC9B,CAAC;IAEO,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QACvB,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;QAC1B,IAAI,CAAC,MAAM,EAAE,CAAC;IAClB,CAAC,CAAC;CACL","sourcesContent":["import {NodeType} from 'prosemirror-model';\nimport {EditorView} from 'prosemirror-view';\n\nimport {\n    BaseTooltipNode,\n    BaseTooltipPluginOptions,\n    BaseTooltipPluginView,\n    TooltipOnChangeCallback,\n} from '../BaseTooltip';\n\nimport {TooltipButton} from './TooltipButton';\n\ntype ButtonContent = (\n    view: EditorView,\n    node: BaseTooltipNode,\n    toggleEdit: () => void,\n) => React.ReactElement;\n\ntype FormContent = (\n    view: EditorView,\n    node: BaseTooltipNode,\n    onChange?: TooltipOnChangeCallback,\n) => React.ReactElement;\n\ninterface TooltipMenuOptions extends BaseTooltipPluginOptions {\n    disableHideOnBlur?: boolean;\n    buttonContent: ButtonContent;\n    formContent: FormContent;\n}\n\nexport class TooltipButtonPluginView extends BaseTooltipPluginView {\n    private enableHideOnBlur?: boolean;\n    private forceEdit = false;\n    private buttonContent: ButtonContent;\n    private formContent: FormContent;\n\n    constructor(view: EditorView, options: TooltipMenuOptions) {\n        super(view, options);\n\n        this.enableHideOnBlur = options.disableHideOnBlur !== true;\n        this.buttonContent = options.buttonContent;\n        this.formContent = options.formContent;\n        if (this.enableHideOnBlur) {\n            (this.view.dom as HTMLElement).addEventListener('focus', this.onViewFocus);\n        }\n    }\n\n    toggleEdit = () => {\n        this.forceEdit = !this.forceEdit;\n        this.render();\n    };\n\n    destroy(): void {\n        super.destroy();\n        (this.view.dom as HTMLElement).removeEventListener('focus', this.onViewFocus);\n    }\n\n    protected renderContent(currentNode: BaseTooltipNode): React.ReactNode {\n        return (\n            <>\n                {this.forceEdit && this.formContent ? (\n                    <div>{this.formContent(this.view, currentNode, this.changeAttrsCb)}</div>\n                ) : (\n                    <TooltipButton domElem={currentNode.dom} onOutsideClick={this.onOutsideClick}>\n                        {this.buttonContent(this.view, currentNode, this.toggleEdit)}\n                    </TooltipButton>\n                )}\n            </>\n        );\n    }\n\n    protected setCurrentNode(node: NodeType) {\n        super.setCurrentNode(node);\n        this.currentNode?.dom?.addEventListener('dblclick', this.toggleEdit);\n    }\n\n    protected updateTooltipView() {\n        this.currentNode?.dom?.removeEventListener('dblclick', this.toggleEdit);\n        super.updateTooltipView();\n    }\n\n    private onViewFocus = () => {\n        this.forceEdit = false;\n        this.manualHidden = false;\n        this.render();\n    };\n}\n"]}

package/build/esm/plugins/TooltipSelect/TooltipSelect.d.ts

@@ -1,6 +1,5 @@
-import React from 'react';
 import { PopupProps, SelectOption, SelectOptionGroup } from '@gravity-ui/uikit';
-declare type TooltipButtonProps = Pick<PopupProps, 'onOutsideClick'> & {
+type TooltipButtonProps = Pick<PopupProps, 'onOutsideClick'> & {
     domRef: HTMLElement | null;
     buttonTitle?: string;
     items?: SelectOption[] | SelectOptionGroup[];

package/build/esm/plugins/TooltipSelect/TooltipSelect.js

@@ -1,24 +1,16 @@
-import React, { useLayoutEffect, useRef, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLayoutEffect, useRef, useState } from 'react';
 import { ArrowToggle, Button, Popup, Select, } from '@gravity-ui/uikit';
-import { useBooleanState } from '../../react-utils';
+import { useBooleanState } from "../../react-utils/index.js";
 export const TooltipButton = ({ domRef, buttonTitle = 'Settings', items, onUpdate, withSearch, onOutsideClick, }) => {
-    var _a;
     const [width, setWidth] = useState(0);
     const [open, , , toggleOpen] = useBooleanState(false);
     const ref = useRef(null);
     useLayoutEffect(() => {
-        var _a, _b;
-        if ((_a = ref.current) === null || _a === void 0 ? void 0 : _a.clientWidth) {
-            setWidth((_b = ref.current) === null || _b === void 0 ? void 0 : _b.clientWidth);
+        if (ref.current?.clientWidth) {
+            setWidth(ref.current?.clientWidth);
         }
-    }, [(_a = ref.current) === null || _a === void 0 ? void 0 : _a.clientWidth, buttonTitle]);
-    return (React.createElement(Popup, { open: true, keepMounted: false, hasArrow: false, anchorRef: { current: domRef }, placement: 'right-start', offset: [10, -(width + 10)], onOutsideClick: onOutsideClick, modifiers: [
-            {
-                name: 'preventOverflow',
-                enabled: false,
-            },
-        ] },
-        React.createElement(Select, { onOpenChange: toggleOpen, renderControl: () => (React.createElement(Button, { ref: ref, view: 'flat' },
-                buttonTitle,
-                React.createElement(ArrowToggle, { direction: open ? 'top' : 'bottom' }))), options: items, onUpdate: (v) => onUpdate(v[0]), filterable: withSearch })));
+    }, [ref.current?.clientWidth, buttonTitle]);
+    return (_jsx(Popup, { open: true, keepMounted: false, hasArrow: false, anchorElement: domRef, placement: 'right-start', offset: { crossAxis: 10, mainAxis: -(width + 10) }, onOutsideClick: onOutsideClick, children: _jsx(Select, { onOpenChange: toggleOpen, renderControl: () => (_jsxs(Button, { ref: ref, view: 'flat', children: [buttonTitle, _jsx(ArrowToggle, { direction: open ? 'top' : 'bottom' })] })), options: items, onUpdate: (v) => onUpdate(v[0]), filterable: withSearch }) }));
 };
+//# sourceMappingURL=TooltipSelect.js.map

package/build/esm/plugins/TooltipSelect/TooltipSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipSelect.js","sourceRoot":"../../../../src","sources":["plugins/TooltipSelect/TooltipSelect.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAC;AAExD,OAAO,EACH,WAAW,EACX,MAAM,EACN,KAAK,EAEL,MAAM,GAGT,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAC,eAAe,EAAC,mCAA0B;AAUlD,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EACxD,MAAM,EACN,WAAW,GAAG,UAAU,EACxB,KAAK,EACL,QAAQ,EACR,UAAU,EACV,cAAc,GACjB,EAAE,EAAE;IACD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IACtC,MAAM,CAAC,IAAI,EAAE,AAAD,EAAG,AAAD,EAAG,UAAU,CAAC,GAAG,eAAe,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,GAAG,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAE5C,eAAe,CAAC,GAAG,EAAE;QACjB,IAAI,GAAG,CAAC,OAAO,EAAE,WAAW,EAAE,CAAC;YAC3B,QAAQ,CAAC,GAAG,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QACvC,CAAC;IACL,CAAC,EAAE,CAAC,GAAG,CAAC,OAAO,EAAE,WAAW,EAAE,WAAW,CAAC,CAAC,CAAC;IAE5C,OAAO,CACH,KAAC,KAAK,IACF,IAAI,QACJ,WAAW,EAAE,KAAK,EAClB,QAAQ,EAAE,KAAK,EACf,aAAa,EAAE,MAAM,EACrB,SAAS,EAAE,aAAa,EACxB,MAAM,EAAE,EAAC,SAAS,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,CAAC,KAAK,GAAG,EAAE,CAAC,EAAC,EAChD,cAAc,EAAE,cAAc,YAE9B,KAAC,MAAM,IACH,YAAY,EAAE,UAAU,EACxB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,MAAC,MAAM,IAAC,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,aACzB,WAAW,EACZ,KAAC,WAAW,IAAC,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,GAAI,IAC9C,CACZ,EACD,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC/B,UAAU,EAAE,UAAU,GACxB,GACE,CACX,CAAC;AACN,CAAC,CAAC","sourcesContent":["import {useLayoutEffect, useRef, useState} from 'react';\n\nimport {\n    ArrowToggle,\n    Button,\n    Popup,\n    PopupProps,\n    Select,\n    SelectOption,\n    SelectOptionGroup,\n} from '@gravity-ui/uikit';\n\nimport {useBooleanState} from '../../react-utils';\n\ntype TooltipButtonProps = Pick<PopupProps, 'onOutsideClick'> & {\n    domRef: HTMLElement | null;\n    buttonTitle?: string;\n    items?: SelectOption[] | SelectOptionGroup[];\n    onUpdate: (s: string) => void;\n    withSearch?: boolean;\n};\n\nexport const TooltipButton: React.FC<TooltipButtonProps> = ({\n    domRef,\n    buttonTitle = 'Settings',\n    items,\n    onUpdate,\n    withSearch,\n    onOutsideClick,\n}) => {\n    const [width, setWidth] = useState(0);\n    const [open, , , toggleOpen] = useBooleanState(false);\n    const ref = useRef<HTMLButtonElement>(null);\n\n    useLayoutEffect(() => {\n        if (ref.current?.clientWidth) {\n            setWidth(ref.current?.clientWidth);\n        }\n    }, [ref.current?.clientWidth, buttonTitle]);\n\n    return (\n        <Popup\n            open\n            keepMounted={false}\n            hasArrow={false}\n            anchorElement={domRef}\n            placement={'right-start'}\n            offset={{crossAxis: 10, mainAxis: -(width + 10)}}\n            onOutsideClick={onOutsideClick}\n        >\n            <Select\n                onOpenChange={toggleOpen}\n                renderControl={() => (\n                    <Button ref={ref} view={'flat'}>\n                        {buttonTitle}\n                        <ArrowToggle direction={open ? 'top' : 'bottom'} />\n                    </Button>\n                )}\n                options={items}\n                onUpdate={(v) => onUpdate(v[0])}\n                filterable={withSearch}\n            />\n        </Popup>\n    );\n};\n"]}

package/build/esm/plugins/TooltipSelect/index.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
 import { SelectOption, SelectOptionGroup } from '@gravity-ui/uikit';
 import { Node } from 'prosemirror-model';
 import { EditorView } from 'prosemirror-view';
-import { BaseTooltipNode, BaseTooltipPluginOptions, BaseTooltipPluginView } from '../BaseTooltip';
+import { BaseTooltipNode, BaseTooltipPluginOptions, BaseTooltipPluginView } from "../BaseTooltip/index.js";
 interface TooltipSelectOptions extends BaseTooltipPluginOptions {
     buttonText?: (node: Node) => string;
     items?: SelectOption[] | SelectOptionGroup[];

package/build/esm/plugins/TooltipSelect/index.js

@@ -1,24 +1,18 @@
-import React from 'react';
-import { BaseTooltipPluginView } from '../BaseTooltip';
-import { TooltipButton } from './TooltipSelect';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { BaseTooltipPluginView } from "../BaseTooltip/index.js";
+import { TooltipButton } from "./TooltipSelect.js";
 export class TooltipSelectPluginView extends BaseTooltipPluginView {
+    buttonText;
+    items;
+    buildAttrs;
+    withSearch;
+    enableHideOnBlur;
     constructor(view, options) {
-        var _a;
         super(view, options);
-        this.onOutsideClick = () => {
-            if (this.enableHideOnBlur && !this.view.hasFocus()) {
-                this.manualHidden = true;
-                this.render();
-            }
-        };
-        this.onViewFocus = () => {
-            this.manualHidden = false;
-            this.render();
-        };
         this.buttonText = options.buttonText;
         this.items = options.items;
         this.buildAttrs = options.buildAttrs;
-        this.withSearch = (_a = options.withSearch) !== null && _a !== void 0 ? _a : true;
+        this.withSearch = options.withSearch ?? true;
         this.enableHideOnBlur = options.disableHideOnBlur !== true;
         if (this.enableHideOnBlur) {
             this.view.dom.addEventListener('focus', this.onViewFocus);
@@ -29,7 +23,17 @@ export class TooltipSelectPluginView extends BaseTooltipPluginView {
         this.view.dom.removeEventListener('focus', this.onViewFocus);
     }
     renderContent(currentNode) {
-        var _a;
-        return (React.createElement(TooltipButton, { domRef: currentNode.dom, buttonTitle: (_a = this.buttonText) === null || _a === void 0 ? void 0 : _a.call(this, currentNode.node), items: this.items, onUpdate: (v) => this.changeAttrsCb(this.buildAttrs(v), { setFocus: true }), withSearch: this.withSearch, onOutsideClick: this.onOutsideClick }));
+        return (_jsx(TooltipButton, { domRef: currentNode.dom, buttonTitle: this.buttonText?.(currentNode.node), items: this.items, onUpdate: (v) => this.changeAttrsCb(this.buildAttrs(v), { setFocus: true }), withSearch: this.withSearch, onOutsideClick: this.onOutsideClick }));
     }
+    onOutsideClick = () => {
+        if (this.enableHideOnBlur && !this.view.hasFocus()) {
+            this.manualHidden = true;
+            this.render();
+        }
+    };
+    onViewFocus = () => {
+        this.manualHidden = false;
+        this.render();
+    };
 }
+//# sourceMappingURL=index.js.map

package/build/esm/plugins/TooltipSelect/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../src","sources":["plugins/TooltipSelect/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAA4C,qBAAqB,EAAC,gCAAuB;AAEhG,OAAO,EAAC,aAAa,EAAC,2BAAwB;AAU9C,MAAM,OAAO,uBAAwB,SAAQ,qBAAqB;IACtD,UAAU,CAA0B;IACpC,KAAK,CAAwC;IAC7C,UAAU,CAAoD;IAC9D,UAAU,CAAU;IACpB,gBAAgB,CAAW;IAEnC,YAAY,IAAgB,EAAE,OAA6B;QACvD,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAErB,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;QACrC,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC;QAC3B,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;QACrC,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,UAAU,IAAI,IAAI,CAAC;QAC7C,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC,iBAAiB,KAAK,IAAI,CAAC;QAE3D,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACvB,IAAI,CAAC,IAAI,CAAC,GAAmB,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;QAC/E,CAAC;IACL,CAAC;IAED,OAAO;QACH,KAAK,CAAC,OAAO,EAAE,CAAC;QACf,IAAI,CAAC,IAAI,CAAC,GAAmB,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;IAClF,CAAC;IAES,aAAa,CAAC,WAA4B;QAChD,OAAO,CACH,KAAC,aAAa,IACV,MAAM,EAAE,WAAW,CAAC,GAAG,EACvB,WAAW,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,EAChD,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAC,QAAQ,EAAE,IAAI,EAAC,CAAC,EACzE,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,cAAc,EAAE,IAAI,CAAC,cAAc,GACrC,CACL,CAAC;IACN,CAAC;IAES,cAAc,GAAG,GAAG,EAAE;QAC5B,IAAI,IAAI,CAAC,gBAAgB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAE,CAAC;YACjD,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YACzB,IAAI,CAAC,MAAM,EAAE,CAAC;QAClB,CAAC;IACL,CAAC,CAAC;IAEM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;QAC1B,IAAI,CAAC,MAAM,EAAE,CAAC;IAClB,CAAC,CAAC;CACL","sourcesContent":["import {SelectOption, SelectOptionGroup} from '@gravity-ui/uikit';\nimport {Node} from 'prosemirror-model';\nimport {EditorView} from 'prosemirror-view';\n\nimport {BaseTooltipNode, BaseTooltipPluginOptions, BaseTooltipPluginView} from '../BaseTooltip';\n\nimport {TooltipButton} from './TooltipSelect';\n\ninterface TooltipSelectOptions extends BaseTooltipPluginOptions {\n    buttonText?: (node: Node) => string;\n    items?: SelectOption[] | SelectOptionGroup[];\n    buildAttrs: (selectedValue: string) => Record<string, string>;\n    withSearch?: boolean;\n    disableHideOnBlur?: boolean;\n}\n\nexport class TooltipSelectPluginView extends BaseTooltipPluginView {\n    private buttonText?: (node: Node) => string;\n    private items?: SelectOption[] | SelectOptionGroup[];\n    private buildAttrs: (selectedValue: string) => Record<string, string>;\n    private withSearch: boolean;\n    private enableHideOnBlur?: boolean;\n\n    constructor(view: EditorView, options: TooltipSelectOptions) {\n        super(view, options);\n\n        this.buttonText = options.buttonText;\n        this.items = options.items;\n        this.buildAttrs = options.buildAttrs;\n        this.withSearch = options.withSearch ?? true;\n        this.enableHideOnBlur = options.disableHideOnBlur !== true;\n\n        if (this.enableHideOnBlur) {\n            (this.view.dom as HTMLElement).addEventListener('focus', this.onViewFocus);\n        }\n    }\n\n    destroy(): void {\n        super.destroy();\n        (this.view.dom as HTMLElement).removeEventListener('focus', this.onViewFocus);\n    }\n\n    protected renderContent(currentNode: BaseTooltipNode): React.ReactNode {\n        return (\n            <TooltipButton\n                domRef={currentNode.dom}\n                buttonTitle={this.buttonText?.(currentNode.node)}\n                items={this.items}\n                onUpdate={(v) => this.changeAttrsCb(this.buildAttrs(v), {setFocus: true})}\n                withSearch={this.withSearch}\n                onOutsideClick={this.onOutsideClick}\n            />\n        );\n    }\n\n    protected onOutsideClick = () => {\n        if (this.enableHideOnBlur && !this.view.hasFocus()) {\n            this.manualHidden = true;\n            this.render();\n        }\n    };\n\n    private onViewFocus = () => {\n        this.manualHidden = false;\n        this.render();\n    };\n}\n"]}