npm - @gravity-ui/markdown-editor - Versions diffs - 15.14.0 → 15.14.1 - Mend

@gravity-ui/markdown-editor 15.14.0 → 15.14.1

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 (53) hide show

package/build/cjs/bundle/MarkupEditorView.js CHANGED Viewed

@@ -29,7 +29,7 @@ exports.MarkupEditorView = (0, react_1.memo)((props) => {
     return ((0, jsx_runtime_1.jsxs)("div", { className: b({ toolbar: toolbarVisible }, [className]), "data-qa": qa, children: [toolbarVisible ? ((0, jsx_runtime_1.jsx)(context_1.MarkupToolbarContextProvider, { value: {
                     uploadHandler: editor.fileUploadHandler,
                     needToSetDimensionsForUploadedImages: editor.needToSetDimensionsForUploadedImages,
-                }, children: (0, jsx_runtime_1.jsx)(ToolbarView_1.ToolbarView, { qa: "g-md-toolbar", editor: editor, editorMode: "markup", toolbarEditor: editor, hiddenActionsConfig: hiddenActionsConfig, stickyToolbar: stickyToolbar, toolbarConfig: toolbarConfig, toolbarFocus: () => editor.focus(), settingsVisible: settingsVisible, className: b('toolbar', [toolbarClassName]), children: children }) })) : null, (0, jsx_runtime_1.jsx)(MarkupEditorComponent_1.MarkupEditorComponent, { autofocus: autofocus, editor: editor, className: b('editor', { 'toolbar-visible': toolbarVisible }), children: (0, jsx_runtime_1.jsx)(extensions_1.ReactRendererComponent, { storage: editor.renderStorage }) })] }));
+                }, children: (0, jsx_runtime_1.jsx)(ToolbarView_1.ToolbarView, { qa: "g-md-toolbar-main", editor: editor, editorMode: "markup", toolbarEditor: editor, hiddenActionsConfig: hiddenActionsConfig, stickyToolbar: stickyToolbar, toolbarConfig: toolbarConfig, toolbarFocus: () => editor.focus(), settingsVisible: settingsVisible, className: b('toolbar', [toolbarClassName]), children: children }) })) : null, (0, jsx_runtime_1.jsx)(MarkupEditorComponent_1.MarkupEditorComponent, { autofocus: autofocus, editor: editor, className: b('editor', { 'toolbar-visible': toolbarVisible }), children: (0, jsx_runtime_1.jsx)(extensions_1.ReactRendererComponent, { storage: editor.renderStorage }) })] }));
 });
 exports.MarkupEditorView.displayName = 'MarkdownMarkupEditorView';
 //# sourceMappingURL=MarkupEditorView.js.map

package/build/cjs/bundle/MarkupEditorView.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MarkupEditorView.js","sourceRoot":"../../../src","sources":["bundle/MarkupEditorView.tsx"],"names":[],"mappings":";;;;AAAA,iCAA2B;AAI3B,+CAAqD;AACrD,uDAAqD;AACrD,yCAAuC;AACvC,mDAAmD;AAGnD,sEAA8D;AAC9D,kDAA0C;AAC1C,yDAAsE;AAItE,kCAAiC;AAEjC,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,eAAe,CAAC,CAAC;AAiBjB,QAAA,gBAAgB,GAAG,IAAA,YAAI,EAAwB,CAAC,KAAK,EAAE,EAAE;IAClE,MAAM,EACF,MAAM,EACN,SAAS,EACT,eAAe,EACf,cAAc,EACd,aAAa,EACb,mBAAmB,EACnB,EAAE,EACF,SAAS,EACT,gBAAgB,EAChB,QAAQ,EACR,aAAa,GAAG,IAAI,GACvB,GAAG,KAAK,CAAC;IACV,IAAA,qBAAa,EAAC,CAAC,IAAI,EAAE,EAAE;QACnB,qBAAY,CAAC,OAAO,CAAC;YACjB,SAAS,EAAE,eAAe;YAC1B,KAAK,EAAE,QAAQ;YACf,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;QACH,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC;YAClB,SAAS,EAAE,eAAe;YAC1B,KAAK,EAAE,QAAQ;YACf,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;IAEH,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,EAAC,OAAO,EAAE,cAAc,EAAC,EAAE,CAAC,SAAS,CAAC,CAAC,aAAW,EAAE,aACjE,cAAc,CAAC,CAAC,CAAC,CACd,uBAAC,sCAA4B,IACzB,KAAK,EAAE;oBACH,aAAa,EAAE,MAAM,CAAC,iBAAiB;oBACvC,oCAAoC,EAChC,MAAM,CAAC,oCAAoC;iBAClD,YAED,uBAAC,yBAAW,IACR,EAAE,EAAC,~~cAAc~~,~~EACjB~~,MAAM,EAAE,MAAM,EACd,UAAU,EAAC,QAAQ,EACnB,aAAa,EAAE,MAAM,EACrB,mBAAmB,EAAE,mBAAmB,EACxC,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAClC,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,CAAC,gBAAgB,CAAC,CAAC,YAE1C,QAAQ,GACC,GACa,CAClC,CAAC,CAAC,CAAC,IAAI,EACR,uBAAC,6CAAqB,IAClB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAC,iBAAiB,EAAE,cAAc,EAAC,CAAC,YAE3D,uBAAC,mCAAsB,IAAC,OAAO,EAAE,MAAM,CAAC,aAAa,GAAI,GACrC,IACtB,CACT,CAAC;AACN,CAAC,CAAC,CAAC;AACH,wBAAgB,CAAC,WAAW,GAAG,0BAA0B,CAAC","sourcesContent":["import {memo} from 'react';\n\nimport type {QAProps} from '@gravity-ui/uikit';\n\nimport {type ClassNameProps, cn} from '../classname';\nimport {ReactRendererComponent} from '../extensions';\nimport {globalLogger} from '../logger';\nimport {useRenderTime} from '../react-utils/hooks';\n\nimport type {EditorInt} from './Editor';\nimport {MarkupEditorComponent} from './MarkupEditorComponent';\nimport {ToolbarView} from './ToolbarView';\nimport {MarkupToolbarContextProvider} from './toolbar/markup/context';\nimport type {MToolbarData, MToolbarItemData} from './toolbar/types';\nimport type {MarkdownEditorSplitMode} from './types';\n\nimport './MarkupEditorView.scss';\n\nconst b = cn('markup-editor');\n\nexport type MarkupEditorViewProps = ClassNameProps &\n QAProps & {\n editor: EditorInt;\n autofocus?: boolean;\n toolbarConfig: MToolbarData;\n settingsVisible?: boolean;\n toolbarVisible?: boolean;\n stickyToolbar?: boolean;\n toolbarClassName?: string;\n splitMode?: MarkdownEditorSplitMode;\n splitModeEnabled: boolean;\n hiddenActionsConfig?: MToolbarItemData[];\n children?: React.ReactNode;\n };\n\nexport const MarkupEditorView = memo<MarkupEditorViewProps>((props) => {\n const {\n editor,\n autofocus,\n settingsVisible,\n toolbarVisible,\n toolbarConfig,\n hiddenActionsConfig,\n qa,\n className,\n toolbarClassName,\n children,\n stickyToolbar = true,\n } = props;\n useRenderTime((time) => {\n globalLogger.metrics({\n component: 'markup-editor',\n event: 'render',\n duration: time,\n });\n editor.logger.metrics({\n component: 'markup-editor',\n event: 'render',\n duration: time,\n });\n });\n\n return (\n <div className={b({toolbar: toolbarVisible}, [className])} data-qa={qa}>\n {toolbarVisible ? (\n <MarkupToolbarContextProvider\n value={{\n uploadHandler: editor.fileUploadHandler,\n needToSetDimensionsForUploadedImages:\n editor.needToSetDimensionsForUploadedImages,\n }}\n >\n <ToolbarView\n qa=\"g-md-toolbar\"\n editor={editor}\n editorMode=\"markup\"\n toolbarEditor={editor}\n hiddenActionsConfig={hiddenActionsConfig}\n stickyToolbar={stickyToolbar}\n toolbarConfig={toolbarConfig}\n toolbarFocus={() => editor.focus()}\n settingsVisible={settingsVisible}\n className={b('toolbar', [toolbarClassName])}\n >\n {children}\n </ToolbarView>\n </MarkupToolbarContextProvider>\n ) : null}\n <MarkupEditorComponent\n autofocus={autofocus}\n editor={editor}\n className={b('editor', {'toolbar-visible': toolbarVisible})}\n >\n <ReactRendererComponent storage={editor.renderStorage} />\n </MarkupEditorComponent>\n </div>\n );\n});\nMarkupEditorView.displayName = 'MarkdownMarkupEditorView';\n"]}
1	+ {"version":3,"file":"MarkupEditorView.js","sourceRoot":"../../../src","sources":["bundle/MarkupEditorView.tsx"],"names":[],"mappings":";;;;AAAA,iCAA2B;AAI3B,+CAAqD;AACrD,uDAAqD;AACrD,yCAAuC;AACvC,mDAAmD;AAGnD,sEAA8D;AAC9D,kDAA0C;AAC1C,yDAAsE;AAItE,kCAAiC;AAEjC,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,eAAe,CAAC,CAAC;AAiBjB,QAAA,gBAAgB,GAAG,IAAA,YAAI,EAAwB,CAAC,KAAK,EAAE,EAAE;IAClE,MAAM,EACF,MAAM,EACN,SAAS,EACT,eAAe,EACf,cAAc,EACd,aAAa,EACb,mBAAmB,EACnB,EAAE,EACF,SAAS,EACT,gBAAgB,EAChB,QAAQ,EACR,aAAa,GAAG,IAAI,GACvB,GAAG,KAAK,CAAC;IACV,IAAA,qBAAa,EAAC,CAAC,IAAI,EAAE,EAAE;QACnB,qBAAY,CAAC,OAAO,CAAC;YACjB,SAAS,EAAE,eAAe;YAC1B,KAAK,EAAE,QAAQ;YACf,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;QACH,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC;YAClB,SAAS,EAAE,eAAe;YAC1B,KAAK,EAAE,QAAQ;YACf,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;IAEH,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,EAAC,OAAO,EAAE,cAAc,EAAC,EAAE,CAAC,SAAS,CAAC,CAAC,aAAW,EAAE,aACjE,cAAc,CAAC,CAAC,CAAC,CACd,uBAAC,sCAA4B,IACzB,KAAK,EAAE;oBACH,aAAa,EAAE,MAAM,CAAC,iBAAiB;oBACvC,oCAAoC,EAChC,MAAM,CAAC,oCAAoC;iBAClD,YAED,uBAAC,yBAAW,IACR,EAAE,EAAC,mBAAmB,EACtB,MAAM,EAAE,MAAM,EACd,UAAU,EAAC,QAAQ,EACnB,aAAa,EAAE,MAAM,EACrB,mBAAmB,EAAE,mBAAmB,EACxC,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAClC,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,CAAC,gBAAgB,CAAC,CAAC,YAE1C,QAAQ,GACC,GACa,CAClC,CAAC,CAAC,CAAC,IAAI,EACR,uBAAC,6CAAqB,IAClB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAC,iBAAiB,EAAE,cAAc,EAAC,CAAC,YAE3D,uBAAC,mCAAsB,IAAC,OAAO,EAAE,MAAM,CAAC,aAAa,GAAI,GACrC,IACtB,CACT,CAAC;AACN,CAAC,CAAC,CAAC;AACH,wBAAgB,CAAC,WAAW,GAAG,0BAA0B,CAAC","sourcesContent":["import {memo} from 'react';\n\nimport type {QAProps} from '@gravity-ui/uikit';\n\nimport {type ClassNameProps, cn} from '../classname';\nimport {ReactRendererComponent} from '../extensions';\nimport {globalLogger} from '../logger';\nimport {useRenderTime} from '../react-utils/hooks';\n\nimport type {EditorInt} from './Editor';\nimport {MarkupEditorComponent} from './MarkupEditorComponent';\nimport {ToolbarView} from './ToolbarView';\nimport {MarkupToolbarContextProvider} from './toolbar/markup/context';\nimport type {MToolbarData, MToolbarItemData} from './toolbar/types';\nimport type {MarkdownEditorSplitMode} from './types';\n\nimport './MarkupEditorView.scss';\n\nconst b = cn('markup-editor');\n\nexport type MarkupEditorViewProps = ClassNameProps &\n QAProps & {\n editor: EditorInt;\n autofocus?: boolean;\n toolbarConfig: MToolbarData;\n settingsVisible?: boolean;\n toolbarVisible?: boolean;\n stickyToolbar?: boolean;\n toolbarClassName?: string;\n splitMode?: MarkdownEditorSplitMode;\n splitModeEnabled: boolean;\n hiddenActionsConfig?: MToolbarItemData[];\n children?: React.ReactNode;\n };\n\nexport const MarkupEditorView = memo<MarkupEditorViewProps>((props) => {\n const {\n editor,\n autofocus,\n settingsVisible,\n toolbarVisible,\n toolbarConfig,\n hiddenActionsConfig,\n qa,\n className,\n toolbarClassName,\n children,\n stickyToolbar = true,\n } = props;\n useRenderTime((time) => {\n globalLogger.metrics({\n component: 'markup-editor',\n event: 'render',\n duration: time,\n });\n editor.logger.metrics({\n component: 'markup-editor',\n event: 'render',\n duration: time,\n });\n });\n\n return (\n <div className={b({toolbar: toolbarVisible}, [className])} data-qa={qa}>\n {toolbarVisible ? (\n <MarkupToolbarContextProvider\n value={{\n uploadHandler: editor.fileUploadHandler,\n needToSetDimensionsForUploadedImages:\n editor.needToSetDimensionsForUploadedImages,\n }}\n >\n <ToolbarView\n qa=\"g-md-toolbar-main\"\n editor={editor}\n editorMode=\"markup\"\n toolbarEditor={editor}\n hiddenActionsConfig={hiddenActionsConfig}\n stickyToolbar={stickyToolbar}\n toolbarConfig={toolbarConfig}\n toolbarFocus={() => editor.focus()}\n settingsVisible={settingsVisible}\n className={b('toolbar', [toolbarClassName])}\n >\n {children}\n </ToolbarView>\n </MarkupToolbarContextProvider>\n ) : null}\n <MarkupEditorComponent\n autofocus={autofocus}\n editor={editor}\n className={b('editor', {'toolbar-visible': toolbarVisible})}\n >\n <ReactRendererComponent storage={editor.renderStorage} />\n </MarkupEditorComponent>\n </div>\n );\n});\nMarkupEditorView.displayName = 'MarkdownMarkupEditorView';\n"]}

package/build/cjs/bundle/WysiwygEditorView.js CHANGED Viewed

@@ -25,7 +25,7 @@ exports.WysiwygEditorView = (0, react_1.memo)((props) => {
             duration: time,
         });
     });
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b({ toolbar: toolbarVisible }, [className]), "data-qa": qa, children: [toolbarVisible ? ((0, jsx_runtime_1.jsx)(ToolbarView_1.ToolbarView, { qa: "g-md-toolbar", editor: editor, editorMode: "wysiwyg", toolbarEditor: editor, stickyToolbar: stickyToolbar, toolbarConfig: toolbarConfig, toolbarFocus: () => editor.focus(), hiddenActionsConfig: hiddenActionsConfig, settingsVisible: settingsVisible, className: b('toolbar', [toolbarClassName]), children: children })) : null, (0, jsx_runtime_1.jsx)(WysiwygEditorComponent_1.WysiwygEditorComponent, { autofocus: autofocus, editor: editor, className: b('editor'), children: (0, jsx_runtime_1.jsx)(extensions_1.ReactRendererComponent, { storage: editor.renderStorage }) })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: b({ toolbar: toolbarVisible }, [className]), "data-qa": qa, children: [toolbarVisible ? ((0, jsx_runtime_1.jsx)(ToolbarView_1.ToolbarView, { qa: "g-md-toolbar-main", editor: editor, editorMode: "wysiwyg", toolbarEditor: editor, stickyToolbar: stickyToolbar, toolbarConfig: toolbarConfig, toolbarFocus: () => editor.focus(), hiddenActionsConfig: hiddenActionsConfig, settingsVisible: settingsVisible, className: b('toolbar', [toolbarClassName]), children: children })) : null, (0, jsx_runtime_1.jsx)(WysiwygEditorComponent_1.WysiwygEditorComponent, { autofocus: autofocus, editor: editor, className: b('editor'), children: (0, jsx_runtime_1.jsx)(extensions_1.ReactRendererComponent, { storage: editor.renderStorage }) })] }));
 });
 exports.WysiwygEditorView.displayName = 'MarkdownWysiwgEditorView';
 //# sourceMappingURL=WysiwygEditorView.js.map

package/build/cjs/bundle/WysiwygEditorView.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"WysiwygEditorView.js","sourceRoot":"../../../src","sources":["bundle/WysiwygEditorView.tsx"],"names":[],"mappings":";;;;AAAA,iCAA2B;AAI3B,+CAAqD;AACrD,uDAAqD;AACrD,yCAAuC;AACvC,mDAAmD;AAGnD,kDAA0C;AAC1C,wEAAgE;AAGhE,mCAAkC;AAElC,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,gBAAgB,CAAC,CAAC;AAelB,QAAA,iBAAiB,GAAG,IAAA,YAAI,EAAyB,CAAC,KAAK,EAAE,EAAE;IACpE,MAAM,EACF,MAAM,EACN,SAAS,EACT,eAAe,EACf,cAAc,EACd,aAAa,EACb,mBAAmB,EACnB,EAAE,EACF,SAAS,EACT,gBAAgB,EAChB,QAAQ,EACR,aAAa,GAAG,IAAI,GACvB,GAAG,KAAK,CAAC;IACV,IAAA,qBAAa,EAAC,CAAC,IAAI,EAAE,EAAE;QACnB,qBAAY,CAAC,OAAO,CAAC;YACjB,SAAS,EAAE,gBAAgB;YAC3B,KAAK,EAAE,QAAQ;YACf,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;QACH,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC;YAClB,SAAS,EAAE,gBAAgB;YAC3B,KAAK,EAAE,QAAQ;YACf,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;IACH,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,EAAC,OAAO,EAAE,cAAc,EAAC,EAAE,CAAC,SAAS,CAAC,CAAC,aAAW,EAAE,aACjE,cAAc,CAAC,CAAC,CAAC,CACd,uBAAC,yBAAW,IACR,EAAE,EAAC,~~cAAc~~,~~EACjB~~,MAAM,EAAE,MAAM,EACd,UAAU,EAAC,SAAS,EACpB,aAAa,EAAE,MAAM,EACrB,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAClC,mBAAmB,EAAE,mBAAmB,EACxC,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,CAAC,gBAAgB,CAAC,CAAC,YAE1C,QAAQ,GACC,CACjB,CAAC,CAAC,CAAC,IAAI,EACR,uBAAC,+CAAsB,IAAC,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,YAChF,uBAAC,mCAAsB,IAAC,OAAO,EAAE,MAAM,CAAC,aAAa,GAAI,GACpC,IACvB,CACT,CAAC;AACN,CAAC,CAAC,CAAC;AACH,yBAAiB,CAAC,WAAW,GAAG,0BAA0B,CAAC","sourcesContent":["import {memo} from 'react';\n\nimport type {QAProps} from '@gravity-ui/uikit';\n\nimport {type ClassNameProps, cn} from '../classname';\nimport {ReactRendererComponent} from '../extensions';\nimport {globalLogger} from '../logger';\nimport {useRenderTime} from '../react-utils/hooks';\n\nimport type {EditorInt} from './Editor';\nimport {ToolbarView} from './ToolbarView';\nimport {WysiwygEditorComponent} from './WysiwygEditorComponent';\nimport type {WToolbarData, WToolbarItemData} from './toolbar/types';\n\nimport './WysiwygEditorView.scss';\n\nconst b = cn('wysiwyg-editor');\n\nexport type WysiwygEditorViewProps = ClassNameProps &\n QAProps & {\n editor: EditorInt;\n autofocus?: boolean;\n settingsVisible?: boolean;\n toolbarConfig: WToolbarData;\n toolbarVisible?: boolean;\n stickyToolbar?: boolean;\n toolbarClassName?: string;\n hiddenActionsConfig?: WToolbarItemData[];\n children?: React.ReactNode;\n };\n\nexport const WysiwygEditorView = memo<WysiwygEditorViewProps>((props) => {\n const {\n editor,\n autofocus,\n settingsVisible,\n toolbarVisible,\n toolbarConfig,\n hiddenActionsConfig,\n qa,\n className,\n toolbarClassName,\n children,\n stickyToolbar = true,\n } = props;\n useRenderTime((time) => {\n globalLogger.metrics({\n component: 'wysiwyg-editor',\n event: 'render',\n duration: time,\n });\n editor.logger.metrics({\n component: 'wysiwyg-editor',\n event: 'render',\n duration: time,\n });\n });\n return (\n <div className={b({toolbar: toolbarVisible}, [className])} data-qa={qa}>\n {toolbarVisible ? (\n <ToolbarView\n qa=\"g-md-toolbar\"\n editor={editor}\n editorMode=\"wysiwyg\"\n toolbarEditor={editor}\n stickyToolbar={stickyToolbar}\n toolbarConfig={toolbarConfig}\n toolbarFocus={() => editor.focus()}\n hiddenActionsConfig={hiddenActionsConfig}\n settingsVisible={settingsVisible}\n className={b('toolbar', [toolbarClassName])}\n >\n {children}\n </ToolbarView>\n ) : null}\n <WysiwygEditorComponent autofocus={autofocus} editor={editor} className={b('editor')}>\n <ReactRendererComponent storage={editor.renderStorage} />\n </WysiwygEditorComponent>\n </div>\n );\n});\nWysiwygEditorView.displayName = 'MarkdownWysiwgEditorView';\n"]}
1	+ {"version":3,"file":"WysiwygEditorView.js","sourceRoot":"../../../src","sources":["bundle/WysiwygEditorView.tsx"],"names":[],"mappings":";;;;AAAA,iCAA2B;AAI3B,+CAAqD;AACrD,uDAAqD;AACrD,yCAAuC;AACvC,mDAAmD;AAGnD,kDAA0C;AAC1C,wEAAgE;AAGhE,mCAAkC;AAElC,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,gBAAgB,CAAC,CAAC;AAelB,QAAA,iBAAiB,GAAG,IAAA,YAAI,EAAyB,CAAC,KAAK,EAAE,EAAE;IACpE,MAAM,EACF,MAAM,EACN,SAAS,EACT,eAAe,EACf,cAAc,EACd,aAAa,EACb,mBAAmB,EACnB,EAAE,EACF,SAAS,EACT,gBAAgB,EAChB,QAAQ,EACR,aAAa,GAAG,IAAI,GACvB,GAAG,KAAK,CAAC;IACV,IAAA,qBAAa,EAAC,CAAC,IAAI,EAAE,EAAE;QACnB,qBAAY,CAAC,OAAO,CAAC;YACjB,SAAS,EAAE,gBAAgB;YAC3B,KAAK,EAAE,QAAQ;YACf,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;QACH,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC;YAClB,SAAS,EAAE,gBAAgB;YAC3B,KAAK,EAAE,QAAQ;YACf,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;IACH,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,EAAC,OAAO,EAAE,cAAc,EAAC,EAAE,CAAC,SAAS,CAAC,CAAC,aAAW,EAAE,aACjE,cAAc,CAAC,CAAC,CAAC,CACd,uBAAC,yBAAW,IACR,EAAE,EAAC,mBAAmB,EACtB,MAAM,EAAE,MAAM,EACd,UAAU,EAAC,SAAS,EACpB,aAAa,EAAE,MAAM,EACrB,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAClC,mBAAmB,EAAE,mBAAmB,EACxC,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,CAAC,gBAAgB,CAAC,CAAC,YAE1C,QAAQ,GACC,CACjB,CAAC,CAAC,CAAC,IAAI,EACR,uBAAC,+CAAsB,IAAC,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,YAChF,uBAAC,mCAAsB,IAAC,OAAO,EAAE,MAAM,CAAC,aAAa,GAAI,GACpC,IACvB,CACT,CAAC;AACN,CAAC,CAAC,CAAC;AACH,yBAAiB,CAAC,WAAW,GAAG,0BAA0B,CAAC","sourcesContent":["import {memo} from 'react';\n\nimport type {QAProps} from '@gravity-ui/uikit';\n\nimport {type ClassNameProps, cn} from '../classname';\nimport {ReactRendererComponent} from '../extensions';\nimport {globalLogger} from '../logger';\nimport {useRenderTime} from '../react-utils/hooks';\n\nimport type {EditorInt} from './Editor';\nimport {ToolbarView} from './ToolbarView';\nimport {WysiwygEditorComponent} from './WysiwygEditorComponent';\nimport type {WToolbarData, WToolbarItemData} from './toolbar/types';\n\nimport './WysiwygEditorView.scss';\n\nconst b = cn('wysiwyg-editor');\n\nexport type WysiwygEditorViewProps = ClassNameProps &\n QAProps & {\n editor: EditorInt;\n autofocus?: boolean;\n settingsVisible?: boolean;\n toolbarConfig: WToolbarData;\n toolbarVisible?: boolean;\n stickyToolbar?: boolean;\n toolbarClassName?: string;\n hiddenActionsConfig?: WToolbarItemData[];\n children?: React.ReactNode;\n };\n\nexport const WysiwygEditorView = memo<WysiwygEditorViewProps>((props) => {\n const {\n editor,\n autofocus,\n settingsVisible,\n toolbarVisible,\n toolbarConfig,\n hiddenActionsConfig,\n qa,\n className,\n toolbarClassName,\n children,\n stickyToolbar = true,\n } = props;\n useRenderTime((time) => {\n globalLogger.metrics({\n component: 'wysiwyg-editor',\n event: 'render',\n duration: time,\n });\n editor.logger.metrics({\n component: 'wysiwyg-editor',\n event: 'render',\n duration: time,\n });\n });\n return (\n <div className={b({toolbar: toolbarVisible}, [className])} data-qa={qa}>\n {toolbarVisible ? (\n <ToolbarView\n qa=\"g-md-toolbar-main\"\n editor={editor}\n editorMode=\"wysiwyg\"\n toolbarEditor={editor}\n stickyToolbar={stickyToolbar}\n toolbarConfig={toolbarConfig}\n toolbarFocus={() => editor.focus()}\n hiddenActionsConfig={hiddenActionsConfig}\n settingsVisible={settingsVisible}\n className={b('toolbar', [toolbarClassName])}\n >\n {children}\n </ToolbarView>\n ) : null}\n <WysiwygEditorComponent autofocus={autofocus} editor={editor} className={b('editor')}>\n <ReactRendererComponent storage={editor.renderStorage} />\n </WysiwygEditorComponent>\n </div>\n );\n});\nWysiwygEditorView.displayName = 'MarkdownWysiwgEditorView';\n"]}

package/build/cjs/bundle/toolbar/ToolbarButtonWithPopupMenu.js CHANGED Viewed

@@ -11,7 +11,7 @@ const hooks_1 = require("../../react-utils/hooks.js");
 const toolbar_1 = require("../../toolbar/index.js");
 require("./ToolbarButtonWithPopupMenu.css");
 const b = (0, classname_1.cn)('toolbar-button-with-popup-menu');
-const ToolbarButtonWithPopupMenu = ({ disablePortal, className, focus, onClick, icon, iconClassName, chevronIconClassName, title, menuItems, _selectionType, }) => {
+const ToolbarButtonWithPopupMenu = ({ disablePortal, className, focus, onClick, icon, iconClassName, chevronIconClassName, title, menuItems, _selectionType, qa, ...props }) => {
     const [anchorElement, setAnchorElement] = (0, hooks_1.useElementState)();
     const [open, , hide, toggleOpen] = (0, hooks_1.useBooleanState)(false);
     const groups = (0, react_1.useMemo)(() => (0, lodash_1.groupBy)(menuItems.map((i) => ({ ...i, group: i.group || '' })), 'group'), [menuItems]);
@@ -30,7 +30,8 @@ const ToolbarButtonWithPopupMenu = ({ disablePortal, className, focus, onClick,
             popupOpen && someActive,
         ]
         : [someActive || popupOpen ? 'normal' : 'flat', someActive];
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(uikit_1.ActionTooltip, { disabled: popupOpen, openDelay: toolbar_1.ToolbarTooltipDelay.Open, closeDelay: toolbar_1.ToolbarTooltipDelay.Close, title: (0, lodash_1.isFunction)(title) ? title() : title, children: (0, jsx_runtime_1.jsxs)(uikit_1.Button, { size: "m", ref: setAnchorElement, view: btnView, selected: btnSelected, disabled: everyDisabled, className: b(null, [className]), onClick: toggleOpen, children: [(0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icon.data, size: icon.size, className: iconClassName }), '', (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.ChevronDown, className: chevronIconClassName })] }) }), (0, jsx_runtime_1.jsx)(uikit_1.Popup, { open: popupOpen, disablePortal: disablePortal, anchorElement: anchorElement, onOpenChange: (open) => {
+    const textTitle = (0, lodash_1.isFunction)(title) ? title() : title;
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(uikit_1.ActionTooltip, { disabled: popupOpen, openDelay: toolbar_1.ToolbarTooltipDelay.Open, closeDelay: toolbar_1.ToolbarTooltipDelay.Close, title: textTitle, children: (0, jsx_runtime_1.jsxs)(uikit_1.Button, { size: "m", ref: setAnchorElement, view: btnView, selected: btnSelected, disabled: everyDisabled, className: b(null, [className]), onClick: toggleOpen, "aria-label": textTitle, qa: qa, ...props, children: [(0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icon.data, size: icon.size, className: iconClassName }), '', (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.ChevronDown, className: chevronIconClassName })] }) }), (0, jsx_runtime_1.jsx)(uikit_1.Popup, { open: popupOpen, disablePortal: disablePortal, anchorElement: anchorElement, onOpenChange: (open) => {
                     if (!open)
                         hide();
                 }, children: (0, jsx_runtime_1.jsx)(uikit_1.Menu, { size: "l", children: Object.entries(groups).map(([label, items], key) => {

package/build/cjs/bundle/toolbar/ToolbarButtonWithPopupMenu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToolbarButtonWithPopupMenu.js","sourceRoot":"../../../../src","sources":["bundle/toolbar/ToolbarButtonWithPopupMenu.tsx"],"names":[],"mappings":";;;;AAAA,iCAAyC;AAEzC,6CAA8C;AAC9C,6CAQ2B;AAE3B,kDAAmC;AAEnC,4CAAiD;AACjD,sDAAyE;AACzE,oDAA+F;AAE/F,4CAA2C;AAC3C,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,gCAAgC,CAAC,CAAC;AA2BxC,MAAM,0BAA0B,GAA8C,CAAC,EAClF,aAAa,EACb,SAAS,EACT,KAAK,EACL,OAAO,EACP,IAAI,EACJ,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,SAAS,EACT,cAAc,~~GACjB~~,EAAE,EAAE;IACD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,uBAAe,GAAE,CAAC;IAC5D,MAAM,CAAC,IAAI,EAAE,AAAD,EAAG,IAAI,EAAE,UAAU,CAAC,GAAG,IAAA,uBAAe,EAAC,KAAK,CAAC,CAAC;IAC1D,MAAM,MAAM,GAAG,IAAA,eAAO,EAClB,GAAG,EAAE,CACD,IAAA,gBAAO,EACH,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAC,GAAG,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,IAAI,EAAE,EAAC,CAAC,CAAC,EACpD,OAAO,CACV,EACL,CAAC,SAAS,CAAC,CACd,CAAC;IAEF,MAAM,UAAU,GAAG,SAAS,CAAC,IAAI,CAC7B,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,KAAK,IAAI,CAClE,CAAC;IACF,MAAM,aAAa,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,KAAK,KAAK,CAAC,CAAC;IAElF,MAAM,SAAS,GAAG,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;IAC/C,MAAM,eAAe,GAAG,IAAI,IAAI,CAAC,SAAS,CAAC;IAC3C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,eAAe,EAAE,CAAC;YAClB,IAAI,EAAE,CAAC;QACX,CAAC;IACL,CAAC,EAAE,CAAC,IAAI,EAAE,eAAe,CAAC,CAAC,CAAC;IAE5B,MAAM,CAAC,OAAO,EAAE,WAAW,CAAC,GACxB,cAAc,KAAK,OAAO;QACtB,CAAC,CAAE;YACG,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM;YAC1D,SAAS,IAAI,UAAU;SAChB;QACb,CAAC,CAAE,CAAC,UAAU,IAAI,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,EAAE,UAAU,CAAW,CAAC;IAE/E,OAAO,CACH,6DACI,uBAAC,qBAAa,IACV,QAAQ,EAAE,SAAS,EACnB,SAAS,EAAE,6BAAmB,CAAC,IAAI,EACnC,UAAU,EAAE,6BAAmB,CAAC,KAAK,EACrC,KAAK,EAAE,~~IAAA~~,~~mBAAU~~,~~EAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,YAE1C,~~wBAAC,cAAM,IACH,IAAI,EAAC,GAAG,EACR,GAAG,EAAE,gBAAgB,EACrB,IAAI,EAAE,OAAO,EACb,QAAQ,EAAE,WAAW,EACrB,QAAQ,EAAE,aAAa,EACvB,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,SAAS,CAAC,CAAC,EAC/B,OAAO,EAAE,UAAU,~~aAEnB~~,uBAAC,YAAI,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,aAAa,GAAI,EACnE,EAAE,EACH,uBAAC,YAAI,IAAC,IAAI,EAAE,mBAAW,EAAE,SAAS,EAAE,oBAAoB,GAAI,IACvD,GACG,EAChB,uBAAC,aAAK,IACF,IAAI,EAAE,SAAS,EACf,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE;oBACnB,IAAI,CAAC,IAAI;wBAAE,IAAI,EAAE,CAAC;gBACtB,CAAC,YAED,uBAAC,YAAI,IAAC,IAAI,EAAC,GAAG,YACT,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,EAAE,GAAG,EAAE,EAAE;wBAChD,OAAO,CACH,uBAAC,YAAI,CAAC,KAAK,IAAC,KAAK,EAAE,KAAK,EAAY,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,YACzD,KAAK,CAAC,GAAG,CACN,CAAC,EAAC,EAAE,EAAE,IAAI,EAAE,QAAQ,GAAG,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,aAAa,EAAC,EAAE,EAAE,CAAC,CACxD,uBAAC,YAAI,CAAC,IAAI,IAEN,SAAS,EACL,uBAAC,YAAI,IACD,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,QAAQ,EACd,SAAS,EAAE,aAAa,GAC1B,EAEN,MAAM,EAAE,MAAM,CAAC,QAAQ,EAAE,EACzB,QAAQ,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE,EAC5B,OAAO,EAAE,GAAG,EAAE;oCACV,IAAI,EAAE,CAAC;oCACP,KAAK,EAAE,CAAC;oCACR,MAAM,CAAC,GAAG,EAAE,CAAC;oCACb,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC;gCAClB,CAAC,EACD,UAAU,EAAE,EAAC,YAAY,EAAE,IAAI,EAAC,YAE/B,IAAI,IAlBA,EAAE,CAmBC,CACf,CACJ,IAzB0B,GAAG,CA0BrB,CAChB,CAAC;oBACN,CAAC,CAAC,GACC,GACH,IACT,CACN,CAAC;AACN,CAAC,CAAC;~~AA9GW~~,QAAA,0BAA0B,~~8BA8GrC~~","sourcesContent":["import {useEffect, useMemo} from 'react';\n\nimport {ChevronDown} from '@gravity-ui/icons';\nimport {\n ActionTooltip,\n Button,\n Icon,\n type IconProps,\n Menu,\n Popup,\n type PopupProps,\n} from '@gravity-ui/uikit';\n\nimport {cn} from '../../classname';\nimport type {Action} from '../../core';\nimport {groupBy, isFunction} from '../../lodash';\nimport {useBooleanState, useElementState} from '../../react-utils/hooks';\nimport {type ToolbarBaseProps, type ToolbarIconData, ToolbarTooltipDelay} from '../../toolbar';\n\nimport './ToolbarButtonWithPopupMenu.scss';\nconst b = cn('toolbar-button-with-popup-menu');\n\nexport type MenuItem = {\n id: string;\n action: Action;\n icon: IconProps['data'];\n text: string;\n iconSize?: IconProps['size'];\n iconClassname?: string;\n group?: string;\n ignoreActive?: boolean;\n};\n\nexport type ToolbarButtonWithPopupMenuProps = Omit<\n ToolbarBaseProps<never> &\n Pick<PopupProps, 'disablePortal'> & {\n icon: ToolbarIconData;\n iconClassName?: string;\n chevronIconClassName?: string;\n title: string \| (() => string);\n menuItems: MenuItem[];\n /** @default 'classic' */\n _selectionType?: 'classic' \| 'light';\n },\n 'editor'\n>;\n\nexport const ToolbarButtonWithPopupMenu: React.FC<ToolbarButtonWithPopupMenuProps> = ({\n disablePortal,\n className,\n focus,\n onClick,\n icon,\n iconClassName,\n chevronIconClassName,\n title,\n menuItems,\n _selectionType,\n}) => {\n const [anchorElement, setAnchorElement] = useElementState();\n const [open, , hide, toggleOpen] = useBooleanState(false);\n const groups = useMemo(\n () =>\n groupBy(\n menuItems.map((i) => ({...i, group: i.group \|\| ''})),\n 'group',\n ),\n [menuItems],\n );\n\n const someActive = menuItems.some(\n (item) => !item.ignoreActive && item.action.isActive() === true,\n );\n const everyDisabled = menuItems.every((item) => item.action.isEnable() === false);\n\n const popupOpen = everyDisabled ? false : open;\n const shouldForceHide = open && !popupOpen;\n useEffect(() => {\n if (shouldForceHide) {\n hide();\n }\n }, [hide, shouldForceHide]);\n\n const [btnView, btnSelected] =\n _selectionType === 'light'\n ? ([\n popupOpen ? 'normal' : someActive ? 'flat-action' : 'flat',\n popupOpen && someActive,\n ] as const)\n : ([someActive \|\| popupOpen ? 'normal' : 'flat', someActive] as const);\n\n return (\n <>\n <ActionTooltip\n disabled={popupOpen}\n openDelay={ToolbarTooltipDelay.Open}\n closeDelay={ToolbarTooltipDelay.Close}\n title={~~isFunction(title) ? title() : title~~}\n >\n <Button\n size=\"m\"\n ref={setAnchorElement}\n view={btnView}\n selected={btnSelected}\n disabled={everyDisabled}\n className={b(null, [className])}\n onClick={toggleOpen}\n >\n <Icon data={icon.data} size={icon.size} className={iconClassName} />\n {''}\n <Icon data={ChevronDown} className={chevronIconClassName} />\n </Button>\n </ActionTooltip>\n <Popup\n open={popupOpen}\n disablePortal={disablePortal}\n anchorElement={anchorElement}\n onOpenChange={(open) => {\n if (!open) hide();\n }}\n >\n <Menu size=\"l\">\n {Object.entries(groups).map(([label, items], key) => {\n return (\n <Menu.Group label={label} key={key} className={b('menu-group')}>\n {items.map(\n ({id, icon, iconSize = 16, action, text, iconClassname}) => (\n <Menu.Item\n key={id}\n iconStart={\n <Icon\n data={icon}\n size={iconSize}\n className={iconClassname}\n />\n }\n active={action.isActive()}\n disabled={!action.isEnable()}\n onClick={() => {\n hide();\n focus();\n action.run();\n onClick?.(id);\n }}\n extraProps={{'aria-label': text}}\n >\n {text}\n </Menu.Item>\n ),\n )}\n </Menu.Group>\n );\n })}\n </Menu>\n </Popup>\n </>\n );\n};\n"]}
1	+ {"version":3,"file":"ToolbarButtonWithPopupMenu.js","sourceRoot":"../../../../src","sources":["bundle/toolbar/ToolbarButtonWithPopupMenu.tsx"],"names":[],"mappings":";;;;AAAA,iCAAyC;AAEzC,6CAA8C;AAC9C,6CAQ2B;AAE3B,kDAAmC;AAEnC,4CAAiD;AACjD,sDAAyE;AACzE,oDAA+F;AAE/F,4CAA2C;AAC3C,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,gCAAgC,CAAC,CAAC;AA2BxC,MAAM,0BAA0B,GAA8C,CAAC,EAClF,aAAa,EACb,SAAS,EACT,KAAK,EACL,OAAO,EACP,IAAI,EACJ,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,SAAS,EACT,cAAc,EACd,EAAE,EACF,GAAG,KAAK,EACX,EAAE,EAAE;IACD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,uBAAe,GAAE,CAAC;IAC5D,MAAM,CAAC,IAAI,EAAE,AAAD,EAAG,IAAI,EAAE,UAAU,CAAC,GAAG,IAAA,uBAAe,EAAC,KAAK,CAAC,CAAC;IAC1D,MAAM,MAAM,GAAG,IAAA,eAAO,EAClB,GAAG,EAAE,CACD,IAAA,gBAAO,EACH,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAC,GAAG,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,IAAI,EAAE,EAAC,CAAC,CAAC,EACpD,OAAO,CACV,EACL,CAAC,SAAS,CAAC,CACd,CAAC;IAEF,MAAM,UAAU,GAAG,SAAS,CAAC,IAAI,CAC7B,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,KAAK,IAAI,CAClE,CAAC;IACF,MAAM,aAAa,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,KAAK,KAAK,CAAC,CAAC;IAElF,MAAM,SAAS,GAAG,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;IAC/C,MAAM,eAAe,GAAG,IAAI,IAAI,CAAC,SAAS,CAAC;IAC3C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,eAAe,EAAE,CAAC;YAClB,IAAI,EAAE,CAAC;QACX,CAAC;IACL,CAAC,EAAE,CAAC,IAAI,EAAE,eAAe,CAAC,CAAC,CAAC;IAE5B,MAAM,CAAC,OAAO,EAAE,WAAW,CAAC,GACxB,cAAc,KAAK,OAAO;QACtB,CAAC,CAAE;YACG,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM;YAC1D,SAAS,IAAI,UAAU;SAChB;QACb,CAAC,CAAE,CAAC,UAAU,IAAI,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,EAAE,UAAU,CAAW,CAAC;IAE/E,MAAM,SAAS,GAAG,IAAA,mBAAU,EAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC;IAEtD,OAAO,CACH,6DACI,uBAAC,qBAAa,IACV,QAAQ,EAAE,SAAS,EACnB,SAAS,EAAE,6BAAmB,CAAC,IAAI,EACnC,UAAU,EAAE,6BAAmB,CAAC,KAAK,EACrC,KAAK,EAAE,SAAS,YAEhB,wBAAC,cAAM,IACH,IAAI,EAAC,GAAG,EACR,GAAG,EAAE,gBAAgB,EACrB,IAAI,EAAE,OAAO,EACb,QAAQ,EAAE,WAAW,EACrB,QAAQ,EAAE,aAAa,EACvB,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,SAAS,CAAC,CAAC,EAC/B,OAAO,EAAE,UAAU,gBACP,SAAS,EACrB,EAAE,EAAE,EAAE,KACF,KAAK,aAET,uBAAC,YAAI,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,aAAa,GAAI,EACnE,EAAE,EACH,uBAAC,YAAI,IAAC,IAAI,EAAE,mBAAW,EAAE,SAAS,EAAE,oBAAoB,GAAI,IACvD,GACG,EAChB,uBAAC,aAAK,IACF,IAAI,EAAE,SAAS,EACf,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE;oBACnB,IAAI,CAAC,IAAI;wBAAE,IAAI,EAAE,CAAC;gBACtB,CAAC,YAED,uBAAC,YAAI,IAAC,IAAI,EAAC,GAAG,YACT,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,EAAE,GAAG,EAAE,EAAE;wBAChD,OAAO,CACH,uBAAC,YAAI,CAAC,KAAK,IAAC,KAAK,EAAE,KAAK,EAAY,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,YACzD,KAAK,CAAC,GAAG,CACN,CAAC,EAAC,EAAE,EAAE,IAAI,EAAE,QAAQ,GAAG,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,aAAa,EAAC,EAAE,EAAE,CAAC,CACxD,uBAAC,YAAI,CAAC,IAAI,IAEN,SAAS,EACL,uBAAC,YAAI,IACD,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,QAAQ,EACd,SAAS,EAAE,aAAa,GAC1B,EAEN,MAAM,EAAE,MAAM,CAAC,QAAQ,EAAE,EACzB,QAAQ,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE,EAC5B,OAAO,EAAE,GAAG,EAAE;oCACV,IAAI,EAAE,CAAC;oCACP,KAAK,EAAE,CAAC;oCACR,MAAM,CAAC,GAAG,EAAE,CAAC;oCACb,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC;gCAClB,CAAC,EACD,UAAU,EAAE,EAAC,YAAY,EAAE,IAAI,EAAC,YAE/B,IAAI,IAlBA,EAAE,CAmBC,CACf,CACJ,IAzB0B,GAAG,CA0BrB,CAChB,CAAC;oBACN,CAAC,CAAC,GACC,GACH,IACT,CACN,CAAC;AACN,CAAC,CAAC;AArHW,QAAA,0BAA0B,8BAqHrC","sourcesContent":["import {useEffect, useMemo} from 'react';\n\nimport {ChevronDown} from '@gravity-ui/icons';\nimport {\n ActionTooltip,\n Button,\n Icon,\n type IconProps,\n Menu,\n Popup,\n type PopupProps,\n} from '@gravity-ui/uikit';\n\nimport {cn} from '../../classname';\nimport type {Action} from '../../core';\nimport {groupBy, isFunction} from '../../lodash';\nimport {useBooleanState, useElementState} from '../../react-utils/hooks';\nimport {type ToolbarBaseProps, type ToolbarIconData, ToolbarTooltipDelay} from '../../toolbar';\n\nimport './ToolbarButtonWithPopupMenu.scss';\nconst b = cn('toolbar-button-with-popup-menu');\n\nexport type MenuItem = {\n id: string;\n action: Action;\n icon: IconProps['data'];\n text: string;\n iconSize?: IconProps['size'];\n iconClassname?: string;\n group?: string;\n ignoreActive?: boolean;\n};\n\nexport type ToolbarButtonWithPopupMenuProps = Omit<\n ToolbarBaseProps<never> &\n Pick<PopupProps, 'disablePortal'> & {\n icon: ToolbarIconData;\n iconClassName?: string;\n chevronIconClassName?: string;\n title: string \| (() => string);\n menuItems: MenuItem[];\n /** @default 'classic' */\n _selectionType?: 'classic' \| 'light';\n },\n 'editor'\n>;\n\nexport const ToolbarButtonWithPopupMenu: React.FC<ToolbarButtonWithPopupMenuProps> = ({\n disablePortal,\n className,\n focus,\n onClick,\n icon,\n iconClassName,\n chevronIconClassName,\n title,\n menuItems,\n _selectionType,\n qa,\n ...props\n}) => {\n const [anchorElement, setAnchorElement] = useElementState();\n const [open, , hide, toggleOpen] = useBooleanState(false);\n const groups = useMemo(\n () =>\n groupBy(\n menuItems.map((i) => ({...i, group: i.group \|\| ''})),\n 'group',\n ),\n [menuItems],\n );\n\n const someActive = menuItems.some(\n (item) => !item.ignoreActive && item.action.isActive() === true,\n );\n const everyDisabled = menuItems.every((item) => item.action.isEnable() === false);\n\n const popupOpen = everyDisabled ? false : open;\n const shouldForceHide = open && !popupOpen;\n useEffect(() => {\n if (shouldForceHide) {\n hide();\n }\n }, [hide, shouldForceHide]);\n\n const [btnView, btnSelected] =\n _selectionType === 'light'\n ? ([\n popupOpen ? 'normal' : someActive ? 'flat-action' : 'flat',\n popupOpen && someActive,\n ] as const)\n : ([someActive \|\| popupOpen ? 'normal' : 'flat', someActive] as const);\n\n const textTitle = isFunction(title) ? title() : title;\n\n return (\n <>\n <ActionTooltip\n disabled={popupOpen}\n openDelay={ToolbarTooltipDelay.Open}\n closeDelay={ToolbarTooltipDelay.Close}\n title={textTitle}\n >\n <Button\n size=\"m\"\n ref={setAnchorElement}\n view={btnView}\n selected={btnSelected}\n disabled={everyDisabled}\n className={b(null, [className])}\n onClick={toggleOpen}\n aria-label={textTitle}\n qa={qa}\n {...props}\n >\n <Icon data={icon.data} size={icon.size} className={iconClassName} />\n {''}\n <Icon data={ChevronDown} className={chevronIconClassName} />\n </Button>\n </ActionTooltip>\n <Popup\n open={popupOpen}\n disablePortal={disablePortal}\n anchorElement={anchorElement}\n onOpenChange={(open) => {\n if (!open) hide();\n }}\n >\n <Menu size=\"l\">\n {Object.entries(groups).map(([label, items], key) => {\n return (\n <Menu.Group label={label} key={key} className={b('menu-group')}>\n {items.map(\n ({id, icon, iconSize = 16, action, text, iconClassname}) => (\n <Menu.Item\n key={id}\n iconStart={\n <Icon\n data={icon}\n size={iconSize}\n className={iconClassname}\n />\n }\n active={action.isActive()}\n disabled={!action.isEnable()}\n onClick={() => {\n hide();\n focus();\n action.run();\n onClick?.(id);\n }}\n extraProps={{'aria-label': text}}\n >\n {text}\n </Menu.Item>\n ),\n )}\n </Menu.Group>\n );\n })}\n </Menu>\n </Popup>\n </>\n );\n};\n"]}

package/build/cjs/bundle/toolbar/custom/ToolbarColors.js CHANGED Viewed

@@ -58,7 +58,7 @@ const ToolbarColors = (props) => {
             },
         });
     }
-    return ((0, jsx_runtime_1.jsx)(ToolbarButtonWithPopupMenu_1.ToolbarButtonWithPopupMenu, { ...props, title: (0, menubar_1.i18n)('colorify'), menuItems: items, icon: textColorIcon, _selectionType: "light", iconClassName: b('menu-icon', { color: currentColor }), chevronIconClassName: b('chevron-icon', { color: currentColor }) }));
+    return ((0, jsx_runtime_1.jsx)(ToolbarButtonWithPopupMenu_1.ToolbarButtonWithPopupMenu, { ...props, title: (0, menubar_1.i18n)('colorify'), menuItems: items, icon: textColorIcon, _selectionType: "light", iconClassName: b('menu-icon', { color: currentColor }), chevronIconClassName: b('chevron-icon', { color: currentColor }), "data-selected-color": currentColor ?? 'default' }));
 };
 exports.ToolbarColors = ToolbarColors;
 //# sourceMappingURL=ToolbarColors.js.map

package/build/cjs/bundle/toolbar/custom/ToolbarColors.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToolbarColors.js","sourceRoot":"../../../../../src","sources":["bundle/toolbar/custom/ToolbarColors.tsx"],"names":[],"mappings":"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~~GAChE~~,CACL,CAAC;AACN,CAAC,CAAC;~~AA9DW~~,QAAA,aAAa,~~iBA8DxB~~","sourcesContent":["import {cn} from '../../../classname';\nimport {Colors} from '../../../extensions';\nimport {i18n} from '../../../i18n/menubar';\nimport type {ToolbarBaseProps} from '../../../toolbar';\nimport {icons} from '../../config/icons';\nimport {\n type MenuItem,\n ToolbarButtonWithPopupMenu,\n type ToolbarButtonWithPopupMenuProps,\n} from '../ToolbarButtonWithPopupMenu';\n\nimport './ToolbarColors.scss';\n\nconst b = cn('toolbar-colors');\nconst textColorIcon = icons.textColor;\n\nexport type ToolbarColorsProps = Omit<ToolbarBaseProps<never>, 'editor'> &\n Pick<ToolbarButtonWithPopupMenuProps, 'disablePortal'> & {\n active?: boolean;\n enable?: boolean;\n currentColor?: string;\n withDefault?: boolean;\n exec(color: string): void;\n };\n\nexport const ToolbarColors: React.FC<ToolbarColorsProps> = (props) => {\n const {exec, onClick, enable, currentColor, withDefault} = props;\n const isDefault = currentColor === undefined;\n\n const onItemClick = (color: string) => () => {\n // do not exec when current color is default and clicked to default item\n if (!(isDefault && color === '')) exec(color);\n onClick?.('colorify', {color: color === '' ? 'default' : color});\n };\n\n const items = [\n Colors.Gray,\n Colors.Yellow,\n Colors.Orange,\n Colors.Red,\n Colors.Green,\n Colors.Blue,\n Colors.Violet,\n ].map<MenuItem>((color) => ({\n id: color,\n icon: textColorIcon.data,\n iconSize: textColorIcon.size ?? 16,\n text: i18n(`colorify__color_${color}`),\n iconClassname: b('item-icon', {color}),\n action: {\n run: onItemClick(color),\n isEnable: () => Boolean(enable),\n isActive: () => color === currentColor,\n meta() {},\n },\n group: i18n(`colorify__group_text`),\n }));\n\n if (withDefault) {\n items.unshift({\n id: 'default',\n icon: textColorIcon.data,\n iconSize: textColorIcon.size ?? 16,\n text: i18n(`colorify__color_default`),\n iconClassname: b('item-icon', {color: 'default'}),\n group: i18n(`colorify__group_text`),\n ignoreActive: true,\n action: {\n run: onItemClick(''),\n isEnable: () => Boolean(enable),\n isActive: () => isDefault,\n meta() {},\n },\n });\n }\n\n return (\n <ToolbarButtonWithPopupMenu\n {...props}\n title={i18n('colorify')}\n menuItems={items}\n icon={textColorIcon}\n _selectionType=\"light\"\n iconClassName={b('menu-icon', {color: currentColor})}\n chevronIconClassName={b('chevron-icon', {color: currentColor})}\n />\n );\n};\n"]}
1	+ {"version":3,"file":"ToolbarColors.js","sourceRoot":"../../../../../src","sources":["bundle/toolbar/custom/ToolbarColors.tsx"],"names":[],"mappings":";;;;AAAA,qDAAsC;AACtC,6DAA2C;AAC3C,4DAA2C;AAE3C,iDAAyC;AACzC,iFAIuC;AAEvC,+BAA8B;AAE9B,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,gBAAgB,CAAC,CAAC;AAC/B,MAAM,aAAa,GAAG,aAAK,CAAC,SAAS,CAAC;AAW/B,MAAM,aAAa,GAAiC,CAAC,KAAK,EAAE,EAAE;IACjE,MAAM,EAAC,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,WAAW,EAAC,GAAG,KAAK,CAAC;IACjE,MAAM,SAAS,GAAG,YAAY,KAAK,SAAS,CAAC;IAE7C,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,EAAE,CAAC,GAAG,EAAE;QACxC,wEAAwE;QACxE,IAAI,CAAC,CAAC,SAAS,IAAI,KAAK,KAAK,EAAE,CAAC;YAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QAC9C,OAAO,EAAE,CAAC,UAAU,EAAE,EAAC,KAAK,EAAE,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,EAAC,CAAC,CAAC;IACrE,CAAC,CAAC;IAEF,MAAM,KAAK,GAAG;QACV,mBAAM,CAAC,IAAI;QACX,mBAAM,CAAC,MAAM;QACb,mBAAM,CAAC,MAAM;QACb,mBAAM,CAAC,GAAG;QACV,mBAAM,CAAC,KAAK;QACZ,mBAAM,CAAC,IAAI;QACX,mBAAM,CAAC,MAAM;KAChB,CAAC,GAAG,CAAW,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QACxB,EAAE,EAAE,KAAK;QACT,IAAI,EAAE,aAAa,CAAC,IAAI;QACxB,QAAQ,EAAE,aAAa,CAAC,IAAI,IAAI,EAAE;QAClC,IAAI,EAAE,IAAA,cAAI,EAAC,mBAAmB,KAAK,EAAE,CAAC;QACtC,aAAa,EAAE,CAAC,CAAC,WAAW,EAAE,EAAC,KAAK,EAAC,CAAC;QACtC,MAAM,EAAE;YACJ,GAAG,EAAE,WAAW,CAAC,KAAK,CAAC;YACvB,QAAQ,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC;YAC/B,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK,KAAK,YAAY;YACtC,IAAI,KAAI,CAAC;SACZ;QACD,KAAK,EAAE,IAAA,cAAI,EAAC,sBAAsB,CAAC;KACtC,CAAC,CAAC,CAAC;IAEJ,IAAI,WAAW,EAAE,CAAC;QACd,KAAK,CAAC,OAAO,CAAC;YACV,EAAE,EAAE,SAAS;YACb,IAAI,EAAE,aAAa,CAAC,IAAI;YACxB,QAAQ,EAAE,aAAa,CAAC,IAAI,IAAI,EAAE;YAClC,IAAI,EAAE,IAAA,cAAI,EAAC,yBAAyB,CAAC;YACrC,aAAa,EAAE,CAAC,CAAC,WAAW,EAAE,EAAC,KAAK,EAAE,SAAS,EAAC,CAAC;YACjD,KAAK,EAAE,IAAA,cAAI,EAAC,sBAAsB,CAAC;YACnC,YAAY,EAAE,IAAI;YAClB,MAAM,EAAE;gBACJ,GAAG,EAAE,WAAW,CAAC,EAAE,CAAC;gBACpB,QAAQ,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC;gBAC/B,QAAQ,EAAE,GAAG,EAAE,CAAC,SAAS;gBACzB,IAAI,KAAI,CAAC;aACZ;SACJ,CAAC,CAAC;IACP,CAAC;IAED,OAAO,CACH,uBAAC,uDAA0B,OACnB,KAAK,EACT,KAAK,EAAE,IAAA,cAAI,EAAC,UAAU,CAAC,EACvB,SAAS,EAAE,KAAK,EAChB,IAAI,EAAE,aAAa,EACnB,cAAc,EAAC,OAAO,EACtB,aAAa,EAAE,CAAC,CAAC,WAAW,EAAE,EAAC,KAAK,EAAE,YAAY,EAAC,CAAC,EACpD,oBAAoB,EAAE,CAAC,CAAC,cAAc,EAAE,EAAC,KAAK,EAAE,YAAY,EAAC,CAAC,yBACzC,YAAY,IAAI,SAAS,GAChD,CACL,CAAC;AACN,CAAC,CAAC;AA/DW,QAAA,aAAa,iBA+DxB","sourcesContent":["import {cn} from '../../../classname';\nimport {Colors} from '../../../extensions';\nimport {i18n} from '../../../i18n/menubar';\nimport type {ToolbarBaseProps} from '../../../toolbar';\nimport {icons} from '../../config/icons';\nimport {\n type MenuItem,\n ToolbarButtonWithPopupMenu,\n type ToolbarButtonWithPopupMenuProps,\n} from '../ToolbarButtonWithPopupMenu';\n\nimport './ToolbarColors.scss';\n\nconst b = cn('toolbar-colors');\nconst textColorIcon = icons.textColor;\n\nexport type ToolbarColorsProps = Omit<ToolbarBaseProps<never>, 'editor'> &\n Pick<ToolbarButtonWithPopupMenuProps, 'disablePortal'> & {\n active?: boolean;\n enable?: boolean;\n currentColor?: string;\n withDefault?: boolean;\n exec(color: string): void;\n };\n\nexport const ToolbarColors: React.FC<ToolbarColorsProps> = (props) => {\n const {exec, onClick, enable, currentColor, withDefault} = props;\n const isDefault = currentColor === undefined;\n\n const onItemClick = (color: string) => () => {\n // do not exec when current color is default and clicked to default item\n if (!(isDefault && color === '')) exec(color);\n onClick?.('colorify', {color: color === '' ? 'default' : color});\n };\n\n const items = [\n Colors.Gray,\n Colors.Yellow,\n Colors.Orange,\n Colors.Red,\n Colors.Green,\n Colors.Blue,\n Colors.Violet,\n ].map<MenuItem>((color) => ({\n id: color,\n icon: textColorIcon.data,\n iconSize: textColorIcon.size ?? 16,\n text: i18n(`colorify__color_${color}`),\n iconClassname: b('item-icon', {color}),\n action: {\n run: onItemClick(color),\n isEnable: () => Boolean(enable),\n isActive: () => color === currentColor,\n meta() {},\n },\n group: i18n(`colorify__group_text`),\n }));\n\n if (withDefault) {\n items.unshift({\n id: 'default',\n icon: textColorIcon.data,\n iconSize: textColorIcon.size ?? 16,\n text: i18n(`colorify__color_default`),\n iconClassname: b('item-icon', {color: 'default'}),\n group: i18n(`colorify__group_text`),\n ignoreActive: true,\n action: {\n run: onItemClick(''),\n isEnable: () => Boolean(enable),\n isActive: () => isDefault,\n meta() {},\n },\n });\n }\n\n return (\n <ToolbarButtonWithPopupMenu\n {...props}\n title={i18n('colorify')}\n menuItems={items}\n icon={textColorIcon}\n _selectionType=\"light\"\n iconClassName={b('menu-icon', {color: currentColor})}\n chevronIconClassName={b('chevron-icon', {color: currentColor})}\n data-selected-color={currentColor ?? 'default'}\n />\n );\n};\n"]}

package/build/cjs/extensions/additional/GPT/GptDialog/GptDialog.js CHANGED Viewed

@@ -9,7 +9,6 @@ const uikit_1 = require("@gravity-ui/uikit");
 const classname_1 = require("../../../../classname.js");
 const dialog_1 = require("../../../../i18n/gpt/dialog/index.js");
 const GPT_1 = tslib_1.__importDefault(require("../../../../icons/GPT.js"));
-const useAutoFocus_1 = require("../../../../react-utils/useAutoFocus.js");
 const ErrorScreen_1 = require("../ErrorScreen/ErrorScreen.js");
 const IconRefuge_1 = require("../IconRefuge/IconRefuge.js");
 const PresetList_1 = require("../PresetList/PresetList.js");
@@ -43,7 +42,11 @@ const GptDialog = ({ markup, answerRender, promptPresets, disablePromptPresets,
         gptAlert?.onCloseGptAlert?.();
         setShowedGptAlert(false);
     }, [gptAlert]);
-    (0, useAutoFocus_1.useAutoFocus)(customPromptContainerRef, [showAnswer]);
+    (0, react_1.useEffect)(() => {
+        if (customPromptContainerRef.current) {
+            customPromptContainerRef.current.focus();
+        }
+    }, [customPromptContainerRef.current]);
     (0, useGptHotKeys_1.useGptHotKeys)(constants_1.gptHotKeys.tryAgainGpt, handleTryAgain);
     (0, useGptHotKeys_1.useGptHotKeys)(constants_1.gptHotKeys.freshStartGpt, handleFreshStart);
     (0, useGptHotKeys_1.useGptHotKeys)(constants_1.gptHotKeys.applyResultGpt, handleApplyResult);

package/build/cjs/extensions/additional/GPT/GptDialog/GptDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GptDialog.js","sourceRoot":"../../../../../../src","sources":["extensions/additional/GPT/GptDialog/GptDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useCallback, useRef, useState} from 'react';\n\nimport {ArrowRight, ArrowRotateLeft, ThumbsDown, ThumbsUp} from '@gravity-ui/icons';\nimport {ActionTooltip, Alert, type AlertProps, Button, Icon, TextInput} from '@gravity-ui/uikit';\n\nimport {cn} from '../../../../classname';\nimport {i18n} from '../../../../i18n/gpt/dialog';\nimport gptIcon from '../../../../icons/GPT';\nimport {useAutoFocus} from '../../../../react-utils/useAutoFocus';\nimport {ErrorScreen} from '../ErrorScreen/ErrorScreen';\nimport type {CommonAnswer, GptRequestData, PromptPreset} from '../ErrorScreen/types';\nimport {IconRefuge} from '../IconRefuge/IconRefuge';\nimport {PresetList} from '../PresetList/PresetList';\nimport {gptHotKeys} from '../constants';\nimport {useGpt} from '../hooks/useGpt';\nimport {useGptHotKeys} from '../hooks/useGptHotKeys';\nimport {getAlertGptInfo, getDisableReplaceButtonText, getInputPlaceHolder} from '../utils';\n\nimport {LoadingScreen} from './LoadingScreen/LoadingScreen';\n\nimport './GptDialog.scss';\n\nexport type GptDialogProps<\n AnswerData extends CommonAnswer = CommonAnswer,\n PromptData extends unknown = unknown,\n> = {\n markup: string;\n answerRender: (data: AnswerData) => JSX.Element;\n onApplyResult: (markup: string) => void;\n promptPresets?: PromptPreset<PromptData>[];\n disablePromptPresets?: boolean;\n customPromptPlaceholder?: string;\n disabledPromptPlaceholder?: string;\n onCustomPromptApply?: (data: GptRequestData<PromptData>) => Promise<AnswerData \| undefined>;\n onPromptPresetClick?: (data: GptRequestData<PromptData>) => Promise<AnswerData \| undefined>;\n onTryAgain?: (data: GptRequestData<PromptData>) => Promise<AnswerData \| undefined>;\n onLike?: (data: GptRequestData<PromptData>) => Promise<void>;\n onDislike?: (data: GptRequestData<PromptData>) => Promise<void>;\n onClose?: () => void;\n onUpdate?: (value: AnswerData \| undefined) => void;\n gptAlertProps?: {\n showedGptAlert: boolean;\n onCloseGptAlert?: () => void;\n message?: string;\n theme?: AlertProps['theme'];\n className?: string;\n };\n};\n\nexport const cnGptDialog = cn('gpt-dialog');\n\nexport const GptDialog = <\n AnswerData extends CommonAnswer = CommonAnswer,\n PromptData extends unknown = unknown,\n>({\n markup,\n answerRender,\n promptPresets,\n disablePromptPresets,\n customPromptPlaceholder,\n disabledPromptPlaceholder,\n onCustomPromptApply,\n onPromptPresetClick,\n onTryAgain,\n onApplyResult,\n onClose,\n onLike,\n onDislike,\n onUpdate,\n gptAlertProps,\n}: GptDialogProps<AnswerData, PromptData>) => {\n const {\n answer,\n customPrompt,\n loading,\n mode,\n feedbackType,\n feedbackTypeLoading,\n handleLike,\n handleDislike,\n handleCustomPromptUpdate,\n handleCustomPromptKeyPress,\n handleCustomPromptApply,\n handlePresetClick,\n handleTryAgain,\n handleFreshStart,\n handleApplyResult,\n showAnswer,\n showError,\n showAnswerActions,\n showTryAgainButton,\n } = useGpt({\n markup,\n promptPresets,\n onLike,\n onDislike,\n onCustomPromptApply,\n onPromptPresetClick,\n onTryAgain,\n onApplyResult,\n onUpdate,\n });\n\n const gptAlert = gptAlertProps;\n\n const customPromptContainerRef = useRef<HTMLInputElement>(null);\n\n const [showedGptAlert, setShowedGptAlert] = useState(gptAlert?.showedGptAlert);\n\n const {alertMessage, alertTheme, alertClassName} = getAlertGptInfo(gptAlert);\n\n const onCloseAlert = useCallback(() => {\n if (gptAlert) {\n gptAlert.showedGptAlert = false;\n }\n gptAlert?.onCloseGptAlert?.();\n\n setShowedGptAlert(false);\n }, [gptAlert]);\n\n useAutoFocus(customPromptContainerRef, [showAnswer]);\n\n useGptHotKeys(gptHotKeys.tryAgainGpt, handleTryAgain);\n useGptHotKeys(gptHotKeys.freshStartGpt, handleFreshStart);\n useGptHotKeys(gptHotKeys.applyResultGpt, handleApplyResult);\n\n const replaceButtonText = getDisableReplaceButtonText(disablePromptPresets);\n\n const inputPlaceholderText = getInputPlaceHolder(\n disablePromptPresets,\n disabledPromptPlaceholder,\n customPromptPlaceholder,\n );\n\n const tryAgainButton = (\n <ActionTooltip hotkey={gptHotKeys.tryAgainGpt} title={i18n('try-again')}>\n <Button\n className={cnGptDialog('try-again-button')}\n view=\"normal\"\n size=\"m\"\n onClick={handleTryAgain}\n >\n <Icon data={ArrowRotateLeft} size={16} />\n {i18n('try-again')}\n </Button>\n </ActionTooltip>\n );\n\n let content = null;\n\n if (loading) {\n content = <LoadingScreen />;\n } else if (showError) {\n content = <ErrorScreen onRetry={handleTryAgain} onStartAgain={handleFreshStart} />;\n } else {\n content = (\n <>\n <div className={cnGptDialog('header')}>\n <div className={cnGptDialog('header-top')}>\n <IconRefuge\n containerClassName={cnGptDialog('gpt-icon')}\n data={gptIcon}\n refugeSize={28}\n size={16}\n />\n {(mode === 'only-custom' \|\| mode === 'custom-and-presets') &&\n (showAnswer ? (\n <span className={cnGptDialog('answer-title')}>\n {i18n('answer-title')}\n </span>\n ) : (\n <div className={cnGptDialog('custom-prompt')}>\n <TextInput\n controlRef={customPromptContainerRef}\n view=\"clear\"\n size=\"m\"\n className={cnGptDialog('custom-prompt-input')}\n placeholder={inputPlaceholderText}\n onKeyPress={handleCustomPromptKeyPress}\n onUpdate={handleCustomPromptUpdate}\n />\n <Button\n className={cnGptDialog('custom-prompt-ask-button')}\n view=\"normal\"\n size=\"s\"\n disabled={!customPrompt}\n onClick={handleCustomPromptApply}\n >\n <Icon data={ArrowRight} size={16} />\n </Button>\n </div>\n ))}\n {mode === 'only-presets' && (\n <div className={cnGptDialog('alone-presets')}>\n <span className={cnGptDialog('alone-presets-text')}>\n {i18n('only-presets-title')}\n </span>\n </div>\n )}\n </div>\n {(mode === 'custom-and-presets' \|\| mode === 'only-presets') &&\n ((showTryAgainButton && (\n <div className={cnGptDialog('header-bottom')}>\n {tryAgainButton}\n <ActionTooltip\n title={i18n('fresh-start-button')}\n hotkey={gptHotKeys.freshStartGpt}\n >\n <Button\n className={cnGptDialog('back-to-start')}\n view=\"normal\"\n size=\"m\"\n onClick={handleFreshStart}\n >\n {i18n('fresh-start-button')}\n </Button>\n </ActionTooltip>\n </div>\n )) \|\|\n (!disablePromptPresets && (\n <div className={cnGptDialog('header-bottom')}>\n <PresetList\n disablePromptPresets={disablePromptPresets}\n promptPresets={promptPresets}\n onPresetClick={handlePresetClick}\n />\n </div>\n )) \|\|\n (disablePromptPresets && showedGptAlert && (\n <Alert\n theme={alertTheme}\n message={alertMessage}\n align=\"center\"\n className={cnGptDialog('description-alert', alertClassName)}\n onClose={onCloseAlert}\n />\n )))}\n </div>\n {showAnswer && (\n <>\n <div className={cnGptDialog('body')}>\n <div className={cnGptDialog('answer')}>{answerRender(answer!)}</div>\n </div>\n <div className={cnGptDialog('footer')}>\n {showAnswerActions && (\n <div className={cnGptDialog('answer-actions')}>\n <Button\n className={cnGptDialog('like-button')}\n view=\"normal\"\n size=\"m\"\n onClick={handleLike}\n selected={feedbackType === 'like'}\n loading={feedbackTypeLoading === 'like'}\n >\n <Icon data={ThumbsUp} size={16} />\n </Button>\n <Button\n className={cnGptDialog('dislike-button')}\n view=\"normal\"\n size=\"m\"\n onClick={handleDislike}\n selected={feedbackType === 'dislike'}\n loading={feedbackTypeLoading === 'dislike'}\n >\n <Icon data={ThumbsDown} size={16} />\n </Button>\n {feedbackType && (\n <span className={cnGptDialog('feedback-message')}>\n {i18n('feedback-message')}\n </span>\n )}\n </div>\n )}\n <ActionTooltip\n title={i18n('close-button')}\n hotkey={gptHotKeys.closeGpt}\n >\n <Button\n className={cnGptDialog('close-button')}\n view=\"flat\"\n size=\"m\"\n onClick={onClose}\n >\n {i18n('close-button')}\n </Button>\n </ActionTooltip>\n <ActionTooltip\n title={replaceButtonText}\n hotkey={gptHotKeys.applyResultGpt}\n >\n <Button\n className={cnGptDialog('apply-button')}\n view=\"action\"\n size=\"m\"\n onClick={handleApplyResult}\n >\n {replaceButtonText}\n </Button>\n </ActionTooltip>\n </div>\n </>\n )}\n </>\n );\n }\n\n return <div className={cnGptDialog()}> {content} </div>;\n};\n"]}
1	+ {"version":3,"file":"GptDialog.js","sourceRoot":"../../../../../../src","sources":["extensions/additional/GPT/GptDialog/GptDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useCallback, useEffect, useRef, useState} from 'react';\n\nimport {ArrowRight, ArrowRotateLeft, ThumbsDown, ThumbsUp} from '@gravity-ui/icons';\nimport {ActionTooltip, Alert, type AlertProps, Button, Icon, TextInput} from '@gravity-ui/uikit';\n\nimport {cn} from '../../../../classname';\nimport {i18n} from '../../../../i18n/gpt/dialog';\nimport gptIcon from '../../../../icons/GPT';\nimport {ErrorScreen} from '../ErrorScreen/ErrorScreen';\nimport type {CommonAnswer, GptRequestData, PromptPreset} from '../ErrorScreen/types';\nimport {IconRefuge} from '../IconRefuge/IconRefuge';\nimport {PresetList} from '../PresetList/PresetList';\nimport {gptHotKeys} from '../constants';\nimport {useGpt} from '../hooks/useGpt';\nimport {useGptHotKeys} from '../hooks/useGptHotKeys';\nimport {getAlertGptInfo, getDisableReplaceButtonText, getInputPlaceHolder} from '../utils';\n\nimport {LoadingScreen} from './LoadingScreen/LoadingScreen';\n\nimport './GptDialog.scss';\n\nexport type GptDialogProps<\n AnswerData extends CommonAnswer = CommonAnswer,\n PromptData extends unknown = unknown,\n> = {\n markup: string;\n answerRender: (data: AnswerData) => JSX.Element;\n onApplyResult: (markup: string) => void;\n promptPresets?: PromptPreset<PromptData>[];\n disablePromptPresets?: boolean;\n customPromptPlaceholder?: string;\n disabledPromptPlaceholder?: string;\n onCustomPromptApply?: (data: GptRequestData<PromptData>) => Promise<AnswerData \| undefined>;\n onPromptPresetClick?: (data: GptRequestData<PromptData>) => Promise<AnswerData \| undefined>;\n onTryAgain?: (data: GptRequestData<PromptData>) => Promise<AnswerData \| undefined>;\n onLike?: (data: GptRequestData<PromptData>) => Promise<void>;\n onDislike?: (data: GptRequestData<PromptData>) => Promise<void>;\n onClose?: () => void;\n onUpdate?: (value: AnswerData \| undefined) => void;\n gptAlertProps?: {\n showedGptAlert: boolean;\n onCloseGptAlert?: () => void;\n message?: string;\n theme?: AlertProps['theme'];\n className?: string;\n };\n};\n\nexport const cnGptDialog = cn('gpt-dialog');\n\nexport const GptDialog = <\n AnswerData extends CommonAnswer = CommonAnswer,\n PromptData extends unknown = unknown,\n>({\n markup,\n answerRender,\n promptPresets,\n disablePromptPresets,\n customPromptPlaceholder,\n disabledPromptPlaceholder,\n onCustomPromptApply,\n onPromptPresetClick,\n onTryAgain,\n onApplyResult,\n onClose,\n onLike,\n onDislike,\n onUpdate,\n gptAlertProps,\n}: GptDialogProps<AnswerData, PromptData>) => {\n const {\n answer,\n customPrompt,\n loading,\n mode,\n feedbackType,\n feedbackTypeLoading,\n handleLike,\n handleDislike,\n handleCustomPromptUpdate,\n handleCustomPromptKeyPress,\n handleCustomPromptApply,\n handlePresetClick,\n handleTryAgain,\n handleFreshStart,\n handleApplyResult,\n showAnswer,\n showError,\n showAnswerActions,\n showTryAgainButton,\n } = useGpt({\n markup,\n promptPresets,\n onLike,\n onDislike,\n onCustomPromptApply,\n onPromptPresetClick,\n onTryAgain,\n onApplyResult,\n onUpdate,\n });\n\n const gptAlert = gptAlertProps;\n\n const customPromptContainerRef = useRef<HTMLInputElement>(null);\n\n const [showedGptAlert, setShowedGptAlert] = useState(gptAlert?.showedGptAlert);\n\n const {alertMessage, alertTheme, alertClassName} = getAlertGptInfo(gptAlert);\n\n const onCloseAlert = useCallback(() => {\n if (gptAlert) {\n gptAlert.showedGptAlert = false;\n }\n gptAlert?.onCloseGptAlert?.();\n\n setShowedGptAlert(false);\n }, [gptAlert]);\n\n useEffect(() => {\n if (customPromptContainerRef.current) {\n customPromptContainerRef.current.focus();\n }\n }, [customPromptContainerRef.current]);\n\n useGptHotKeys(gptHotKeys.tryAgainGpt, handleTryAgain);\n useGptHotKeys(gptHotKeys.freshStartGpt, handleFreshStart);\n useGptHotKeys(gptHotKeys.applyResultGpt, handleApplyResult);\n\n const replaceButtonText = getDisableReplaceButtonText(disablePromptPresets);\n\n const inputPlaceholderText = getInputPlaceHolder(\n disablePromptPresets,\n disabledPromptPlaceholder,\n customPromptPlaceholder,\n );\n\n const tryAgainButton = (\n <ActionTooltip hotkey={gptHotKeys.tryAgainGpt} title={i18n('try-again')}>\n <Button\n className={cnGptDialog('try-again-button')}\n view=\"normal\"\n size=\"m\"\n onClick={handleTryAgain}\n >\n <Icon data={ArrowRotateLeft} size={16} />\n {i18n('try-again')}\n </Button>\n </ActionTooltip>\n );\n\n let content = null;\n\n if (loading) {\n content = <LoadingScreen />;\n } else if (showError) {\n content = <ErrorScreen onRetry={handleTryAgain} onStartAgain={handleFreshStart} />;\n } else {\n content = (\n <>\n <div className={cnGptDialog('header')}>\n <div className={cnGptDialog('header-top')}>\n <IconRefuge\n containerClassName={cnGptDialog('gpt-icon')}\n data={gptIcon}\n refugeSize={28}\n size={16}\n />\n {(mode === 'only-custom' \|\| mode === 'custom-and-presets') &&\n (showAnswer ? (\n <span className={cnGptDialog('answer-title')}>\n {i18n('answer-title')}\n </span>\n ) : (\n <div className={cnGptDialog('custom-prompt')}>\n <TextInput\n controlRef={customPromptContainerRef}\n view=\"clear\"\n size=\"m\"\n className={cnGptDialog('custom-prompt-input')}\n placeholder={inputPlaceholderText}\n onKeyPress={handleCustomPromptKeyPress}\n onUpdate={handleCustomPromptUpdate}\n />\n <Button\n className={cnGptDialog('custom-prompt-ask-button')}\n view=\"normal\"\n size=\"s\"\n disabled={!customPrompt}\n onClick={handleCustomPromptApply}\n >\n <Icon data={ArrowRight} size={16} />\n </Button>\n </div>\n ))}\n {mode === 'only-presets' && (\n <div className={cnGptDialog('alone-presets')}>\n <span className={cnGptDialog('alone-presets-text')}>\n {i18n('only-presets-title')}\n </span>\n </div>\n )}\n </div>\n {(mode === 'custom-and-presets' \|\| mode === 'only-presets') &&\n ((showTryAgainButton && (\n <div className={cnGptDialog('header-bottom')}>\n {tryAgainButton}\n <ActionTooltip\n title={i18n('fresh-start-button')}\n hotkey={gptHotKeys.freshStartGpt}\n >\n <Button\n className={cnGptDialog('back-to-start')}\n view=\"normal\"\n size=\"m\"\n onClick={handleFreshStart}\n >\n {i18n('fresh-start-button')}\n </Button>\n </ActionTooltip>\n </div>\n )) \|\|\n (!disablePromptPresets && (\n <div className={cnGptDialog('header-bottom')}>\n <PresetList\n disablePromptPresets={disablePromptPresets}\n promptPresets={promptPresets}\n onPresetClick={handlePresetClick}\n />\n </div>\n )) \|\|\n (disablePromptPresets && showedGptAlert && (\n <Alert\n theme={alertTheme}\n message={alertMessage}\n align=\"center\"\n className={cnGptDialog('description-alert', alertClassName)}\n onClose={onCloseAlert}\n />\n )))}\n </div>\n {showAnswer && (\n <>\n <div className={cnGptDialog('body')}>\n <div className={cnGptDialog('answer')}>{answerRender(answer!)}</div>\n </div>\n <div className={cnGptDialog('footer')}>\n {showAnswerActions && (\n <div className={cnGptDialog('answer-actions')}>\n <Button\n className={cnGptDialog('like-button')}\n view=\"normal\"\n size=\"m\"\n onClick={handleLike}\n selected={feedbackType === 'like'}\n loading={feedbackTypeLoading === 'like'}\n >\n <Icon data={ThumbsUp} size={16} />\n </Button>\n <Button\n className={cnGptDialog('dislike-button')}\n view=\"normal\"\n size=\"m\"\n onClick={handleDislike}\n selected={feedbackType === 'dislike'}\n loading={feedbackTypeLoading === 'dislike'}\n >\n <Icon data={ThumbsDown} size={16} />\n </Button>\n {feedbackType && (\n <span className={cnGptDialog('feedback-message')}>\n {i18n('feedback-message')}\n </span>\n )}\n </div>\n )}\n <ActionTooltip\n title={i18n('close-button')}\n hotkey={gptHotKeys.closeGpt}\n >\n <Button\n className={cnGptDialog('close-button')}\n view=\"flat\"\n size=\"m\"\n onClick={onClose}\n >\n {i18n('close-button')}\n </Button>\n </ActionTooltip>\n <ActionTooltip\n title={replaceButtonText}\n hotkey={gptHotKeys.applyResultGpt}\n >\n <Button\n className={cnGptDialog('apply-button')}\n view=\"action\"\n size=\"m\"\n onClick={handleApplyResult}\n >\n {replaceButtonText}\n </Button>\n </ActionTooltip>\n </div>\n </>\n )}\n </>\n );\n }\n\n return <div className={cnGptDialog()}> {content} </div>;\n};\n"]}

package/build/cjs/extensions/additional/GPT/plugin.js CHANGED Viewed

@@ -16,8 +16,8 @@ const gptWidgetPlugin = (params) => {
             apply: (tr, decos) => {
                 const meta = tr.getMeta(key);
                 const paramsGpt = params;
-                paramsGpt.disablePromptPresets = false;
                 if (meta?.action === 'show') {
+                    paramsGpt.disablePromptPresets = false;
                     if (meta.to === meta.from) {
                         const spanElem = document.createElement('span');
                         spanElem.className = constants_1.WIDGET_DECO_CLASS_NAME;

package/build/cjs/extensions/additional/GPT/plugin.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"plugin.js","sourceRoot":"../../../../../src","sources":["extensions/additional/GPT/plugin.ts"],"names":[],"mappings":";;;AAAA,yDAAoD;AACpD,uDAA2D;AAG3D,8CAA0E;AAE1E,iDAAsD;AACtD,sCAA0C;AAY1C,MAAM,GAAG,GAAG,IAAI,6BAAS,CAAgB,YAAY,CAAC,CAAC;AAExC,wBAAS;AAEjB,MAAM,eAAe,GAAG,CAI3B,MAAuD,EACjD,EAAE;IACR,OAAO,IAAI,0BAAM,CAAC;QACd,GAAG;QACH,KAAK,EAAE;YACH,IAAI,EAAE,GAAG,EAAE,CAAC,gCAAa,CAAC,KAAK;YAC/B,KAAK,EAAE,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE;gBACjB,MAAM,IAAI,GAAG,EAAE,CAAC,OAAO,CAAC,GAAG,CAA8B,CAAC;gBAC1D,MAAM,SAAS,GAAG,MAAM,CAAC;gBAEzB,~~SAAS,CAAC,oBAAoB,GAAG,KAAK,CAAC;gBAEvC,~~IAAI,IAAI,EAAE,MAAM,KAAK,MAAM,EAAE,CAAC;oBAC1B,IAAI,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC,IAAI,EAAE,CAAC;wBACxB,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;wBAChD,QAAQ,CAAC,SAAS,GAAG,kCAAsB,CAAC;wBAC5C,QAAQ,CAAC,WAAW,GAAG,GAAG,CAAC;wBAE3B,SAAS,CAAC,oBAAoB,GAAG,IAAI,CAAC;wBAEtC,IAAI,IAAA,yBAAiB,EAAC,SAAS,EAAE,IAAI,CAAC;4BAAE,OAAO,gCAAa,CAAC,KAAK,CAAC;wBAEnE,OAAO,gCAAa,CAAC,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE;4BAChC,6BAAU,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE;gCACnC,CAAC,iCAAqB,CAAC,EAAE,IAAI;6BAChC,CAAC;yBACL,CAAC,CAAC;oBACP,CAAC;oBAED,IAAI,IAAA,yBAAiB,EAAC,SAAS,EAAE,KAAK,CAAC;wBAAE,OAAO,gCAAa,CAAC,KAAK,CAAC;oBAEpE,OAAO,gCAAa,CAAC,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE;wBAChC,6BAAU,CAAC,MAAM,CACb,IAAI,CAAC,IAAI,EACT,IAAI,CAAC,EAAE,EACP,EAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,kCAAsB,EAAC,EACjD,EAAC,CAAC,iCAAqB,CAAC,EAAE,IAAI,EAAC,CAClC;qBACJ,CAAC,CAAC;gBACP,CAAC;gBAED,IAAI,IAAI,EAAE,MAAM,KAAK,MAAM,EAAE,CAAC;oBAC1B,SAAS,CAAC,oBAAoB,GAAG,KAAK,CAAC;oBAEvC,OAAO,gCAAa,CAAC,KAAK,CAAC;gBAC/B,CAAC;gBAED,OAAO,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC;YACzC,CAAC;SACJ;QACD,KAAK,EAAE;YACH,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC;SAC9C;QACD,IAAI,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,wBAAiB,CAAC,IAAI,EAAE,MAAM,CAAC;KACtD,CAAC,CAAC;AACP,CAAC,CAAC;AA3DW,QAAA,eAAe,mBA2D1B","sourcesContent":["import {Plugin, PluginKey} from 'prosemirror-state';\nimport {Decoration, DecorationSet} from 'prosemirror-view';\n\nimport type {CommonAnswer} from './ErrorScreen/types';\nimport {WIDGET_DECO_CLASS_NAME, WIDGET_DECO_SPEC_FLAG} from './constants';\nimport type {GptWidgetDecoViewParams} from './gptExtension/view';\nimport {GptWidgetDecoView} from './gptExtension/view';\nimport {isEmptyGptPrompts} from './utils';\n\nexport type GptWidgetMeta =\n \| {\n action: 'show';\n from: number;\n to: number;\n }\n \| {\n action: 'hide';\n };\n\nconst key = new PluginKey<DecorationSet>('gpt-widget');\n\nexport {key as pluginKey};\n\nexport const gptWidgetPlugin = <\n AnswerData extends CommonAnswer = CommonAnswer,\n PromptData extends unknown = unknown,\n>(\n params: GptWidgetDecoViewParams<AnswerData, PromptData>,\n): Plugin => {\n return new Plugin({\n key,\n state: {\n init: () => DecorationSet.empty,\n apply: (tr, decos) => {\n const meta = tr.getMeta(key) as GptWidgetMeta \| undefined;\n const paramsGpt = params;\n\n ~~paramsGpt.disablePromptPresets = false;\n\n~~ if (meta?.action === 'show') {\n if (meta.to === meta.from) {\n const spanElem = document.createElement('span');\n spanElem.className = WIDGET_DECO_CLASS_NAME;\n spanElem.textContent = ' ';\n\n paramsGpt.disablePromptPresets = true;\n\n if (isEmptyGptPrompts(paramsGpt, true)) return DecorationSet.empty;\n\n return DecorationSet.create(tr.doc, [\n Decoration.widget(meta.from, spanElem, {\n [WIDGET_DECO_SPEC_FLAG]: true,\n }),\n ]);\n }\n\n if (isEmptyGptPrompts(paramsGpt, false)) return DecorationSet.empty;\n\n return DecorationSet.create(tr.doc, [\n Decoration.inline(\n meta.from,\n meta.to,\n {nodeName: 'span', class: WIDGET_DECO_CLASS_NAME},\n {[WIDGET_DECO_SPEC_FLAG]: true},\n ),\n ]);\n }\n\n if (meta?.action === 'hide') {\n paramsGpt.disablePromptPresets = false;\n\n return DecorationSet.empty;\n }\n\n return decos.map(tr.mapping, tr.doc);\n },\n },\n props: {\n decorations: (state) => key.getState(state),\n },\n view: (view) => new GptWidgetDecoView(view, params),\n });\n};\n"]}
1	+ {"version":3,"file":"plugin.js","sourceRoot":"../../../../../src","sources":["extensions/additional/GPT/plugin.ts"],"names":[],"mappings":";;;AAAA,yDAAoD;AACpD,uDAA2D;AAG3D,8CAA0E;AAE1E,iDAAsD;AACtD,sCAA0C;AAY1C,MAAM,GAAG,GAAG,IAAI,6BAAS,CAAgB,YAAY,CAAC,CAAC;AAExC,wBAAS;AAEjB,MAAM,eAAe,GAAG,CAI3B,MAAuD,EACjD,EAAE;IACR,OAAO,IAAI,0BAAM,CAAC;QACd,GAAG;QACH,KAAK,EAAE;YACH,IAAI,EAAE,GAAG,EAAE,CAAC,gCAAa,CAAC,KAAK;YAC/B,KAAK,EAAE,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE;gBACjB,MAAM,IAAI,GAAG,EAAE,CAAC,OAAO,CAAC,GAAG,CAA8B,CAAC;gBAC1D,MAAM,SAAS,GAAG,MAAM,CAAC;gBAEzB,IAAI,IAAI,EAAE,MAAM,KAAK,MAAM,EAAE,CAAC;oBAC1B,SAAS,CAAC,oBAAoB,GAAG,KAAK,CAAC;oBAEvC,IAAI,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC,IAAI,EAAE,CAAC;wBACxB,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;wBAChD,QAAQ,CAAC,SAAS,GAAG,kCAAsB,CAAC;wBAC5C,QAAQ,CAAC,WAAW,GAAG,GAAG,CAAC;wBAE3B,SAAS,CAAC,oBAAoB,GAAG,IAAI,CAAC;wBAEtC,IAAI,IAAA,yBAAiB,EAAC,SAAS,EAAE,IAAI,CAAC;4BAAE,OAAO,gCAAa,CAAC,KAAK,CAAC;wBAEnE,OAAO,gCAAa,CAAC,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE;4BAChC,6BAAU,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE;gCACnC,CAAC,iCAAqB,CAAC,EAAE,IAAI;6BAChC,CAAC;yBACL,CAAC,CAAC;oBACP,CAAC;oBAED,IAAI,IAAA,yBAAiB,EAAC,SAAS,EAAE,KAAK,CAAC;wBAAE,OAAO,gCAAa,CAAC,KAAK,CAAC;oBAEpE,OAAO,gCAAa,CAAC,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE;wBAChC,6BAAU,CAAC,MAAM,CACb,IAAI,CAAC,IAAI,EACT,IAAI,CAAC,EAAE,EACP,EAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,kCAAsB,EAAC,EACjD,EAAC,CAAC,iCAAqB,CAAC,EAAE,IAAI,EAAC,CAClC;qBACJ,CAAC,CAAC;gBACP,CAAC;gBAED,IAAI,IAAI,EAAE,MAAM,KAAK,MAAM,EAAE,CAAC;oBAC1B,SAAS,CAAC,oBAAoB,GAAG,KAAK,CAAC;oBAEvC,OAAO,gCAAa,CAAC,KAAK,CAAC;gBAC/B,CAAC;gBAED,OAAO,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC;YACzC,CAAC;SACJ;QACD,KAAK,EAAE;YACH,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC;SAC9C;QACD,IAAI,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,wBAAiB,CAAC,IAAI,EAAE,MAAM,CAAC;KACtD,CAAC,CAAC;AACP,CAAC,CAAC;AA3DW,QAAA,eAAe,mBA2D1B","sourcesContent":["import {Plugin, PluginKey} from 'prosemirror-state';\nimport {Decoration, DecorationSet} from 'prosemirror-view';\n\nimport type {CommonAnswer} from './ErrorScreen/types';\nimport {WIDGET_DECO_CLASS_NAME, WIDGET_DECO_SPEC_FLAG} from './constants';\nimport type {GptWidgetDecoViewParams} from './gptExtension/view';\nimport {GptWidgetDecoView} from './gptExtension/view';\nimport {isEmptyGptPrompts} from './utils';\n\nexport type GptWidgetMeta =\n \| {\n action: 'show';\n from: number;\n to: number;\n }\n \| {\n action: 'hide';\n };\n\nconst key = new PluginKey<DecorationSet>('gpt-widget');\n\nexport {key as pluginKey};\n\nexport const gptWidgetPlugin = <\n AnswerData extends CommonAnswer = CommonAnswer,\n PromptData extends unknown = unknown,\n>(\n params: GptWidgetDecoViewParams<AnswerData, PromptData>,\n): Plugin => {\n return new Plugin({\n key,\n state: {\n init: () => DecorationSet.empty,\n apply: (tr, decos) => {\n const meta = tr.getMeta(key) as GptWidgetMeta \| undefined;\n const paramsGpt = params;\n\n if (meta?.action === 'show') {\n paramsGpt.disablePromptPresets = false;\n\n if (meta.to === meta.from) {\n const spanElem = document.createElement('span');\n spanElem.className = WIDGET_DECO_CLASS_NAME;\n spanElem.textContent = ' ';\n\n paramsGpt.disablePromptPresets = true;\n\n if (isEmptyGptPrompts(paramsGpt, true)) return DecorationSet.empty;\n\n return DecorationSet.create(tr.doc, [\n Decoration.widget(meta.from, spanElem, {\n [WIDGET_DECO_SPEC_FLAG]: true,\n }),\n ]);\n }\n\n if (isEmptyGptPrompts(paramsGpt, false)) return DecorationSet.empty;\n\n return DecorationSet.create(tr.doc, [\n Decoration.inline(\n meta.from,\n meta.to,\n {nodeName: 'span', class: WIDGET_DECO_CLASS_NAME},\n {[WIDGET_DECO_SPEC_FLAG]: true},\n ),\n ]);\n }\n\n if (meta?.action === 'hide') {\n paramsGpt.disablePromptPresets = false;\n\n return DecorationSet.empty;\n }\n\n return decos.map(tr.mapping, tr.doc);\n },\n },\n props: {\n decorations: (state) => key.getState(state),\n },\n view: (view) => new GptWidgetDecoView(view, params),\n });\n};\n"]}

package/build/cjs/extensions/behavior/CommandMenu/component.js CHANGED Viewed

@@ -23,7 +23,7 @@ function calcListHeight(itemsCount) {
 const CommandMenuComponent = ({ anchorElement, currentIndex, items, onItemClick, onOpenChange, }) => {
     if (!anchorElement)
         return null;
-    return ((0, jsx_runtime_1.jsx)(uikit_1.Popup, { open: true, anchorElement: anchorElement, placement: placement, onOpenChange: onOpenChange, qa: "g-md-command-menu", children: (0, jsx_runtime_1.jsx)("div", { className: b(), children: (0, jsx_runtime_1.jsx)(uikit_1.List, { virtualized: true, items: items, sortable: false, filterable: false, emptyPlaceholder: (0, suggest_1.i18n)('empty-msg'), itemHeight: ITEM_HEIGHT, itemsHeight: calcListHeight(items.length), renderItem: renderItem, deactivateOnLeave: false, activeItemIndex: currentIndex, onItemClick: (_item, index) => onItemClick(index), className: b('list'), itemClassName: b('list-item') }) }) }));
+    return ((0, jsx_runtime_1.jsx)(uikit_1.Popup, { open: true, anchorElement: anchorElement, placement: placement, onOpenChange: onOpenChange, qa: "g-md-toolbar-command-menu", children: (0, jsx_runtime_1.jsx)("div", { className: b(), children: (0, jsx_runtime_1.jsx)(uikit_1.List, { virtualized: true, items: items, sortable: false, filterable: false, emptyPlaceholder: (0, suggest_1.i18n)('empty-msg'), itemHeight: ITEM_HEIGHT, itemsHeight: calcListHeight(items.length), renderItem: renderItem, deactivateOnLeave: false, activeItemIndex: currentIndex, onItemClick: (_item, index) => onItemClick(index), className: b('list'), itemClassName: b('list-item') }) }) }));
 };
 exports.CommandMenuComponent = CommandMenuComponent;
 function renderItem({ id, title, icon, hotkey, hint, preview }) {

package/build/cjs/extensions/behavior/CommandMenu/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"component.js","sourceRoot":"../../../../../src","sources":["extensions/behavior/CommandMenu/component.tsx"],"names":[],"mappings":";;;AA6FA,wBAMC;;AAnGD,6CAA2F;AAE3F,qDAAsC;AACtC,4DAA2C;AAC3C,+CAA2C;AAC3C,yEAAuE;AACvE,uEAA+D;AAK/D,2BAA0B;AAE1B,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,cAAc,CAAC,CAAC;AAC7B,MAAM,SAAS,GAAmB,CAAC,cAAc,EAAE,WAAW,EAAE,YAAY,EAAE,SAAS,CAAC,CAAC;AAEzF,MAAM,WAAW,GAAG,EAAE,CAAC,CAAC,KAAK;AAC7B,MAAM,mBAAmB,GAAG,EAAE,CAAC;AAC/B,MAAM,eAAe,GAAG,WAAW,GAAG,mBAAmB,CAAC,CAAC,KAAK;AAChE,SAAS,cAAc,CAAC,UAAkB;IACtC,IAAI,UAAU,IAAI,CAAC;QAAE,OAAO,SAAS,CAAC;IACtC,OAAO,IAAI,CAAC,GAAG,CAAC,eAAe,EAAE,UAAU,GAAG,WAAW,CAAC,CAAC;AAC/D,CAAC;AAaM,MAAM,oBAAoB,GAAwC,CAAC,EACtE,aAAa,EACb,YAAY,EACZ,KAAK,EACL,WAAW,EACX,YAAY,GACf,EAAE,EAAE;IACD,IAAI,CAAC,aAAa;QAAE,OAAO,IAAI,CAAC;IAEhC,OAAO,CACH,uBAAC,aAAK,IACF,IAAI,QACJ,aAAa,EAAE,aAAa,EAC5B,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,EAAE,EAAC,~~mBAAmB~~,~~YAEtB~~,gCAAK,SAAS,EAAE,CAAC,EAAE,YACf,uBAAC,YAAI,IACD,WAAW,QACX,KAAK,EAAE,KAA0B,EACjC,QAAQ,EAAE,KAAK,EACf,UAAU,EAAE,KAAK,EACjB,gBAAgB,EAAE,IAAA,cAAI,EAAC,WAAW,CAAC,EACnC,UAAU,EAAE,WAAW,EACvB,WAAW,EAAE,cAAc,CAAC,KAAK,CAAC,MAAM,CAAC,EACzC,UAAU,EAAE,UAAU,EACtB,iBAAiB,EAAE,KAAK,EACxB,eAAe,EAAE,YAAY,EAC7B,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EACjD,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,aAAa,EAAE,CAAC,CAAC,WAAW,CAAC,GAC/B,GACA,GACF,CACX,CAAC;AACN,CAAC,CAAC;AApCW,QAAA,oBAAoB,wBAoC/B;AAEF,SAAS,UAAU,CAAC,EAAC,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAkB;IACzE,MAAM,SAAS,GAAG,IAAA,mBAAU,EAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC;IACtD,MAAM,QAAQ,GAAG,IAAA,mBAAU,EAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;IAElD,OAAO,CACH,uBAAC,+BAAc,IAAC,OAAO,EAAE,OAAO,YAC5B,iCAAc,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,EAAE,EAAC,CAAC,aACpC,uBAAC,YAAI,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,GAAI,EAC9D,iCAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,aAC1B,iCAAM,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,YAAG,SAAS,GAAQ,EACpD,iCAAK,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,aAC1B,MAAM,IAAI,uBAAC,cAAM,IAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,aAAa,CAAC,GAAI,EAChE,QAAQ,IAAI,uBAAC,gBAAQ,IAAC,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,YAAG,QAAQ,GAAY,IACrE,IACJ,KARA,EAAE,CASN,GACO,CACpB,CAAC;AACN,CAAC;AAED,SAAgB,MAAM,CAAC,KAAgC;IACnD,OAAO,CACH,uBAAC,mCAAmB,cAChB,uBAAC,4BAAoB,OAAK,KAAK,GAAI,GACjB,CACzB,CAAC;AACN,CAAC","sourcesContent":["import {HelpMark, Hotkey, Icon, List, Popup, type PopupPlacement} from '@gravity-ui/uikit';\n\nimport {cn} from '../../../classname';\nimport {i18n} from '../../../i18n/suggest';\nimport {isFunction} from '../../../lodash';\nimport {ErrorLoggerBoundary} from '../../../react-utils/ErrorBoundary';\nimport {PreviewTooltip} from '../../../toolbar/PreviewTooltip';\nimport type {AutocompletePopupProps} from '../../../utils/autocomplete-popup';\n\nimport type {CommandAction} from './types';\n\nimport './component.scss';\n\nconst b = cn('command-menu');\nconst placement: PopupPlacement = ['bottom-start', 'top-start', 'bottom-end', 'top-end'];\n\nconst ITEM_HEIGHT = 28; // px\nconst VISIBLE_ITEMS_COUNT = 10;\nconst MAX_LIST_HEIGHT = ITEM_HEIGHT * VISIBLE_ITEMS_COUNT; // px\nfunction calcListHeight(itemsCount: number): number \| undefined {\n if (itemsCount <= 0) return undefined;\n return Math.min(MAX_LIST_HEIGHT, itemsCount * ITEM_HEIGHT);\n}\n\nexport type CommandMenuItem = Pick<\n CommandAction,\n 'id' \| 'title' \| 'icon' \| 'hotkey' \| 'hint' \| 'preview'\n>;\n\nexport type CommandMenuComponentProps = AutocompletePopupProps & {\n currentIndex?: number;\n items: readonly CommandMenuItem[];\n onItemClick(itemIndex: number): void;\n};\n\nexport const CommandMenuComponent: React.FC<CommandMenuComponentProps> = ({\n anchorElement,\n currentIndex,\n items,\n onItemClick,\n onOpenChange,\n}) => {\n if (!anchorElement) return null;\n\n return (\n <Popup\n open\n anchorElement={anchorElement}\n placement={placement}\n onOpenChange={onOpenChange}\n qa=\"g-md-command-menu\"\n >\n <div className={b()}>\n <List<CommandMenuItem>\n virtualized\n items={items as CommandMenuItem[]}\n sortable={false}\n filterable={false}\n emptyPlaceholder={i18n('empty-msg')}\n itemHeight={ITEM_HEIGHT}\n itemsHeight={calcListHeight(items.length)}\n renderItem={renderItem}\n deactivateOnLeave={false}\n activeItemIndex={currentIndex}\n onItemClick={(_item, index) => onItemClick(index)}\n className={b('list')}\n itemClassName={b('list-item')}\n />\n </div>\n </Popup>\n );\n};\n\nfunction renderItem({id, title, icon, hotkey, hint, preview}: CommandMenuItem): React.ReactNode {\n const titleText = isFunction(title) ? title() : title;\n const hintText = isFunction(hint) ? hint() : hint;\n\n return (\n <PreviewTooltip preview={preview}>\n <div key={id} className={b('item', {id})}>\n <Icon data={icon.data} size={20} className={b('item-icon')} />\n <div className={b('item-body')}>\n <span className={b('item-title')}>{titleText}</span>\n <div className={b('item-extra')}>\n {hotkey && <Hotkey value={hotkey} className={b('item-hotkey')} />}\n {hintText && <HelpMark className={b('item-hint')}>{hintText}</HelpMark>}\n </div>\n </div>\n </div>\n </PreviewTooltip>\n );\n}\n\nexport function render(props: CommandMenuComponentProps): React.ReactNode {\n return (\n <ErrorLoggerBoundary>\n <CommandMenuComponent {...props} />\n </ErrorLoggerBoundary>\n );\n}\n"]}
1	+ {"version":3,"file":"component.js","sourceRoot":"../../../../../src","sources":["extensions/behavior/CommandMenu/component.tsx"],"names":[],"mappings":"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","sourcesContent":["import {HelpMark, Hotkey, Icon, List, Popup, type PopupPlacement} from '@gravity-ui/uikit';\n\nimport {cn} from '../../../classname';\nimport {i18n} from '../../../i18n/suggest';\nimport {isFunction} from '../../../lodash';\nimport {ErrorLoggerBoundary} from '../../../react-utils/ErrorBoundary';\nimport {PreviewTooltip} from '../../../toolbar/PreviewTooltip';\nimport type {AutocompletePopupProps} from '../../../utils/autocomplete-popup';\n\nimport type {CommandAction} from './types';\n\nimport './component.scss';\n\nconst b = cn('command-menu');\nconst placement: PopupPlacement = ['bottom-start', 'top-start', 'bottom-end', 'top-end'];\n\nconst ITEM_HEIGHT = 28; // px\nconst VISIBLE_ITEMS_COUNT = 10;\nconst MAX_LIST_HEIGHT = ITEM_HEIGHT * VISIBLE_ITEMS_COUNT; // px\nfunction calcListHeight(itemsCount: number): number \| undefined {\n if (itemsCount <= 0) return undefined;\n return Math.min(MAX_LIST_HEIGHT, itemsCount * ITEM_HEIGHT);\n}\n\nexport type CommandMenuItem = Pick<\n CommandAction,\n 'id' \| 'title' \| 'icon' \| 'hotkey' \| 'hint' \| 'preview'\n>;\n\nexport type CommandMenuComponentProps = AutocompletePopupProps & {\n currentIndex?: number;\n items: readonly CommandMenuItem[];\n onItemClick(itemIndex: number): void;\n};\n\nexport const CommandMenuComponent: React.FC<CommandMenuComponentProps> = ({\n anchorElement,\n currentIndex,\n items,\n onItemClick,\n onOpenChange,\n}) => {\n if (!anchorElement) return null;\n\n return (\n <Popup\n open\n anchorElement={anchorElement}\n placement={placement}\n onOpenChange={onOpenChange}\n qa=\"g-md-toolbar-command-menu\"\n >\n <div className={b()}>\n <List<CommandMenuItem>\n virtualized\n items={items as CommandMenuItem[]}\n sortable={false}\n filterable={false}\n emptyPlaceholder={i18n('empty-msg')}\n itemHeight={ITEM_HEIGHT}\n itemsHeight={calcListHeight(items.length)}\n renderItem={renderItem}\n deactivateOnLeave={false}\n activeItemIndex={currentIndex}\n onItemClick={(_item, index) => onItemClick(index)}\n className={b('list')}\n itemClassName={b('list-item')}\n />\n </div>\n </Popup>\n );\n};\n\nfunction renderItem({id, title, icon, hotkey, hint, preview}: CommandMenuItem): React.ReactNode {\n const titleText = isFunction(title) ? title() : title;\n const hintText = isFunction(hint) ? hint() : hint;\n\n return (\n <PreviewTooltip preview={preview}>\n <div key={id} className={b('item', {id})}>\n <Icon data={icon.data} size={20} className={b('item-icon')} />\n <div className={b('item-body')}>\n <span className={b('item-title')}>{titleText}</span>\n <div className={b('item-extra')}>\n {hotkey && <Hotkey value={hotkey} className={b('item-hotkey')} />}\n {hintText && <HelpMark className={b('item-hint')}>{hintText}</HelpMark>}\n </div>\n </div>\n </div>\n </PreviewTooltip>\n );\n}\n\nexport function render(props: CommandMenuComponentProps): React.ReactNode {\n return (\n <ErrorLoggerBoundary>\n <CommandMenuComponent {...props} />\n </ErrorLoggerBoundary>\n );\n}\n"]}

package/build/cjs/extensions/behavior/SelectionContext/tooltip.js CHANGED Viewed

@@ -57,6 +57,7 @@ class TooltipView {
     getSelectionTooltipProps() {
         return {
             ...this.baseProps,
+            qa: 'g-md-toolbar-selection',
             focus: () => this.view.focus(),
             data: this.getFilteredConfig(),
             editor: this.actions,

package/build/cjs/extensions/behavior/SelectionContext/tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tooltip.js","sourceRoot":"../../../../../src","sources":["extensions/behavior/SelectionContext/tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import type {VirtualElement} from '@floating-ui/react'; // eslint-disable-line import/no-extraneous-dependencies\nimport {Popup, type PopupPlacement, type PopupProps} from '@gravity-ui/uikit';\nimport type {EditorState} from 'prosemirror-state';\nimport type {EditorView} from 'prosemirror-view';\n\nimport type {ActionStorage} from '../../../core';\nimport {isFunction} from '../../../lodash';\nimport {type Logger2, globalLogger} from '../../../logger';\nimport {ErrorLoggerBoundary} from '../../../react-utils/ErrorBoundary';\nimport {Toolbar} from '../../../toolbar';\nimport type {\n ToolbarButtonPopupData,\n ToolbarGroupItemData,\n ToolbarProps,\n ToolbarSingleItemData,\n} from '../../../toolbar';\nimport {type RendererItem, getReactRendererFromState} from '../ReactRenderer';\n\ntype SelectionTooltipBaseProps = {\n show?: boolean;\n poppupProps: PopupProps;\n};\ntype SelectionTooltipProps = SelectionTooltipBaseProps & ToolbarProps<ActionStorage>;\n\nconst SelectionTooltip: React.FC<SelectionTooltipProps> = ({\n show,\n poppupProps,\n ...toolbarProps\n}) => {\n if (!show) return null;\n return (\n <Popup open {...poppupProps} style={{padding: '4px 8px'}}>\n <Toolbar {...toolbarProps} />\n </Popup>\n );\n};\n\nexport type ContextGroupItemData =\n \| (ToolbarGroupItemData<ActionStorage> & {\n condition?: (state: EditorState) => void;\n })\n \| ((ToolbarSingleItemData<ActionStorage> \| ToolbarButtonPopupData<ActionStorage>) & {\n condition?: 'enabled';\n });\n\nexport type ContextGroupData = ContextGroupItemData[];\nexport type ContextConfig = ContextGroupData[];\n\nexport type TooltipViewParams = {\n /** @default 'bottom' /\n placement?: 'top' \| 'bottom';\n /* @default false */\n flip?: boolean;\n};\n\nexport class TooltipView {\n #isTooltipOpen = false;\n\n private readonly logger: Logger2.ILogger;\n private readonly actions: ActionStorage;\n private readonly menuConfig: ContextConfig;\n private readonly placement: PopupPlacement;\n\n private view!: EditorView;\n private baseProps: SelectionTooltipBaseProps = {show: false, poppupProps: {}};\n private _tooltipRenderItem: RendererItem \| null = null;\n\n constructor(\n actions: ActionStorage,\n menuConfig: ContextConfig,\n logger: Logger2.ILogger,\n params: TooltipViewParams,\n ) {\n this.logger = logger;\n this.actions = actions;\n this.menuConfig = menuConfig;\n\n const {flip, placement = 'bottom'} = params;\n this.placement = flip ? placement : [placement];\n }\n\n get isTooltipOpen(): boolean {\n return this.#isTooltipOpen;\n }\n\n show(view: EditorView, popupProps?: PopupProps) {\n this.view = view;\n this.#isTooltipOpen = true;\n this.baseProps = {\n show: true,\n poppupProps: {\n ...popupProps,\n ...this.calcPosition(view),\n },\n };\n this.renderPopup();\n }\n\n hide(view: EditorView) {\n this.view = view;\n this.#isTooltipOpen = false;\n this.baseProps = {show: false, poppupProps: {}};\n this.renderPopup();\n }\n\n destroy() {\n this._tooltipRenderItem?.remove();\n this._tooltipRenderItem = null;\n }\n\n private getSelectionTooltipProps(): SelectionTooltipProps {\n return {\n ...this.baseProps,\n focus: () => this.view.focus(),\n data: this.getFilteredConfig(),\n editor: this.actions,\n onClick: (id) => {\n globalLogger.action({mode: 'wysiwyg', source: 'context-menu', action: id});\n this.logger.action({source: 'context-menu', action: id});\n },\n };\n }\n\n private getFilteredConfig(): ContextConfig {\n return this.baseProps.show\n ? this.menuConfig\n .map((groupData) =>\n groupData.filter((item) => {\n const {condition} = item;\n if (condition === 'enabled') {\n return item.isEnable(this.actions);\n }\n if (isFunction(condition)) {\n return condition(this.view.state);\n }\n return true;\n }),\n )\n .filter((groupData) => Boolean(groupData.length))\n : [];\n }\n\n private renderPopup() {\n this.tooltipRenderItem.rerender();\n }\n\n private get tooltipRenderItem() {\n if (!this._tooltipRenderItem) {\n const reactRenderer = getReactRendererFromState(this.view.state);\n this._tooltipRenderItem = reactRenderer.createItem('selection_context', () => (\n <ErrorLoggerBoundary>\n <SelectionTooltip {...this.getSelectionTooltipProps()} />\n </ErrorLoggerBoundary>\n ));\n }\n return this._tooltipRenderItem;\n }\n\n private calcPosition(view: EditorView): PopupProps {\n const virtualElem: VirtualElement = {\n getBoundingClientRect() {\n // These are in screen coordinates\n const start = view.coordsAtPos(view.state.selection.from);\n const end = view.coordsAtPos(view.state.selection.to);\n // Find a center-ish x position from the selection endpoints (when\n // crossing lines, end may be more to the left)\n const yCenter = Math.max((start.left + end.left) / 2, start.left + 3);\n\n const top = start.top;\n const left = yCenter - 1;\n const width = 2;\n const height = end.bottom - start.top;\n\n return {\n top,\n left,\n right: left + width,\n bottom: top + height,\n y: top,\n x: left,\n height,\n width,\n };\n },\n };\n\n return {\n placement: this.placement,\n anchorElement: virtualElem,\n };\n }\n}\n"]}
1	+ {"version":3,"file":"tooltip.js","sourceRoot":"../../../../../src","sources":["extensions/behavior/SelectionContext/tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import type {VirtualElement} from '@floating-ui/react'; // eslint-disable-line import/no-extraneous-dependencies\nimport {Popup, type PopupPlacement, type PopupProps} from '@gravity-ui/uikit';\nimport type {EditorState} from 'prosemirror-state';\nimport type {EditorView} from 'prosemirror-view';\n\nimport type {ActionStorage} from '../../../core';\nimport {isFunction} from '../../../lodash';\nimport {type Logger2, globalLogger} from '../../../logger';\nimport {ErrorLoggerBoundary} from '../../../react-utils/ErrorBoundary';\nimport {Toolbar} from '../../../toolbar';\nimport type {\n ToolbarButtonPopupData,\n ToolbarGroupItemData,\n ToolbarProps,\n ToolbarSingleItemData,\n} from '../../../toolbar';\nimport {type RendererItem, getReactRendererFromState} from '../ReactRenderer';\n\ntype SelectionTooltipBaseProps = {\n show?: boolean;\n poppupProps: PopupProps;\n};\ntype SelectionTooltipProps = SelectionTooltipBaseProps & ToolbarProps<ActionStorage>;\n\nconst SelectionTooltip: React.FC<SelectionTooltipProps> = ({\n show,\n poppupProps,\n ...toolbarProps\n}) => {\n if (!show) return null;\n return (\n <Popup open {...poppupProps} style={{padding: '4px 8px'}}>\n <Toolbar {...toolbarProps} />\n </Popup>\n );\n};\n\nexport type ContextGroupItemData =\n \| (ToolbarGroupItemData<ActionStorage> & {\n condition?: (state: EditorState) => void;\n })\n \| ((ToolbarSingleItemData<ActionStorage> \| ToolbarButtonPopupData<ActionStorage>) & {\n condition?: 'enabled';\n });\n\nexport type ContextGroupData = ContextGroupItemData[];\nexport type ContextConfig = ContextGroupData[];\n\nexport type TooltipViewParams = {\n /** @default 'bottom' /\n placement?: 'top' \| 'bottom';\n /* @default false */\n flip?: boolean;\n};\n\nexport class TooltipView {\n #isTooltipOpen = false;\n\n private readonly logger: Logger2.ILogger;\n private readonly actions: ActionStorage;\n private readonly menuConfig: ContextConfig;\n private readonly placement: PopupPlacement;\n\n private view!: EditorView;\n private baseProps: SelectionTooltipBaseProps = {show: false, poppupProps: {}};\n private _tooltipRenderItem: RendererItem \| null = null;\n\n constructor(\n actions: ActionStorage,\n menuConfig: ContextConfig,\n logger: Logger2.ILogger,\n params: TooltipViewParams,\n ) {\n this.logger = logger;\n this.actions = actions;\n this.menuConfig = menuConfig;\n\n const {flip, placement = 'bottom'} = params;\n this.placement = flip ? placement : [placement];\n }\n\n get isTooltipOpen(): boolean {\n return this.#isTooltipOpen;\n }\n\n show(view: EditorView, popupProps?: PopupProps) {\n this.view = view;\n this.#isTooltipOpen = true;\n this.baseProps = {\n show: true,\n poppupProps: {\n ...popupProps,\n ...this.calcPosition(view),\n },\n };\n this.renderPopup();\n }\n\n hide(view: EditorView) {\n this.view = view;\n this.#isTooltipOpen = false;\n this.baseProps = {show: false, poppupProps: {}};\n this.renderPopup();\n }\n\n destroy() {\n this._tooltipRenderItem?.remove();\n this._tooltipRenderItem = null;\n }\n\n private getSelectionTooltipProps(): SelectionTooltipProps {\n return {\n ...this.baseProps,\n qa: 'g-md-toolbar-selection',\n focus: () => this.view.focus(),\n data: this.getFilteredConfig(),\n editor: this.actions,\n onClick: (id) => {\n globalLogger.action({mode: 'wysiwyg', source: 'context-menu', action: id});\n this.logger.action({source: 'context-menu', action: id});\n },\n };\n }\n\n private getFilteredConfig(): ContextConfig {\n return this.baseProps.show\n ? this.menuConfig\n .map((groupData) =>\n groupData.filter((item) => {\n const {condition} = item;\n if (condition === 'enabled') {\n return item.isEnable(this.actions);\n }\n if (isFunction(condition)) {\n return condition(this.view.state);\n }\n return true;\n }),\n )\n .filter((groupData) => Boolean(groupData.length))\n : [];\n }\n\n private renderPopup() {\n this.tooltipRenderItem.rerender();\n }\n\n private get tooltipRenderItem() {\n if (!this._tooltipRenderItem) {\n const reactRenderer = getReactRendererFromState(this.view.state);\n this._tooltipRenderItem = reactRenderer.createItem('selection_context', () => (\n <ErrorLoggerBoundary>\n <SelectionTooltip {...this.getSelectionTooltipProps()} />\n </ErrorLoggerBoundary>\n ));\n }\n return this._tooltipRenderItem;\n }\n\n private calcPosition(view: EditorView): PopupProps {\n const virtualElem: VirtualElement = {\n getBoundingClientRect() {\n // These are in screen coordinates\n const start = view.coordsAtPos(view.state.selection.from);\n const end = view.coordsAtPos(view.state.selection.to);\n // Find a center-ish x position from the selection endpoints (when\n // crossing lines, end may be more to the left)\n const yCenter = Math.max((start.left + end.left) / 2, start.left + 3);\n\n const top = start.top;\n const left = yCenter - 1;\n const width = 2;\n const height = end.bottom - start.top;\n\n return {\n top,\n left,\n right: left + width,\n bottom: top + height,\n y: top,\n x: left,\n height,\n width,\n };\n },\n };\n\n return {\n placement: this.placement,\n anchorElement: virtualElem,\n };\n }\n}\n"]}

package/build/cjs/toolbar/FlexToolbar.js CHANGED Viewed

@@ -46,6 +46,6 @@ function FlexToolbar(props) {
             hiddenActions: filteredHiddenAction,
         });
     }, [data, width, hiddenActions]);
-    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: b(null, [className]), children: (0, jsx_runtime_1.jsxs)("div", { className: b('container'), children: [(0, jsx_runtime_1.jsx)(Toolbar_1.Toolbar, { ...props, data: items, className: b('bar') }), dots?.length && ((0, jsx_runtime_1.jsx)(ToolbarListButton_1.ToolbarListButton, { qa: "g-md-toolbar-more-action", qaMenu: "g-md-toolbar-more-menu", data: dots, icon: { data: icons_1.Ellipsis }, title: props.dotsTitle, editor: props.editor, focus: props.focus, onClick: props.onClick, className: b('dots'), alwaysActive: true }))] }) }));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: b(null, [className]), children: (0, jsx_runtime_1.jsxs)("div", { className: b('container'), children: [(0, jsx_runtime_1.jsx)(Toolbar_1.Toolbar, { ...props, data: items, className: b('bar') }), dots?.length && ((0, jsx_runtime_1.jsx)(ToolbarListButton_1.ToolbarListButton, { qa: "g-md-toolbar-more-action", qaMenu: "g-md-toolbar-additional", data: dots, icon: { data: icons_1.Ellipsis }, title: props.dotsTitle, editor: props.editor, focus: props.focus, onClick: props.onClick, className: b('dots'), alwaysActive: true }))] }) }));
 }
 //# sourceMappingURL=FlexToolbar.js.map

package/build/cjs/toolbar/FlexToolbar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FlexToolbar.js","sourceRoot":"../../../src","sources":["toolbar/FlexToolbar.tsx"],"names":[],"mappings":";;AAuBA,kCAyDC;;AAhFD,iCAA8B;AAE9B,6CAA2C;AAC3C,yCAAqC;AAErC,+CAAgC;AAChC,yCAAiC;AACjC,mDAAmD;AAEnD,0CAAqD;AACrD,8DAAsD;AACtD,4CAA6C;AAC7C,sCAA8D;AAE9D,6BAA4B;AAE5B,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,cAAc,CAAC,CAAC;AAO7B,SAAgB,WAAW,CAAI,KAA0B;IACrD,IAAA,qBAAa,EAAC,CAAC,IAAI,EAAE,EAAE;QACnB,eAAM,CAAC,OAAO,CAAC;YACX,SAAS,EAAE,SAAS;YACpB,KAAK,EAAE,QAAQ;YACf,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;IAEH,MAAM,EAAC,IAAI,EAAE,SAAS,EAAE,aAAa,EAAC,GAAG,KAAK,CAAC;IAE/C,MAAM,CAAC,GAAG,EAAE,EAAC,KAAK,EAAC,CAAC,GAAG,IAAA,sBAAU,GAAkB,CAAC;IACpD,MAAM,EAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAC,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QACrC,MAAM,gBAAgB,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAW,EAAE,YAAY,EAAE,EAAE;YAC/D,OAAO;gBACH,GAAG,CAAC;gBACJ,GAAG,YAAY;qBACV,GAAG,CAAC,CAAC,aAAa,EAAE,EAAE;oBACnB,IAAI,aAAa,CAAC,IAAI,KAAK,uBAAe,CAAC,UAAU,EAAE,CAAC;wBACpD,OAAO,aAAa,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;oBAC/C,CAAC;oBACD,OAAO,aAAa,CAAC,EAAE,CAAC;gBAC5B,CAAC,CAAC;qBACD,IAAI,EAAE;aACd,CAAC;QACN,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,sEAAsE;QACtE,MAAM,oBAAoB,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QAC5F,OAAO,IAAA,4BAAiB,EAAC;YACrB,IAAI;YACJ,cAAc,EAAE,KAAK;YACrB,aAAa,EAAE,oBAAoB;SACtC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC;IAEjC,OAAO,CACH,gCAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,SAAS,CAAC,CAAC,YAC1C,iCAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,aAC1B,uBAAC,iBAAO,OAAK,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC,KAAK,CAAC,GAAI,EACvD,IAAI,EAAE,MAAM,IAAI,CACb,uBAAC,qCAAiB,IACd,EAAE,EAAC,0BAA0B,EAC7B,MAAM,EAAC,~~wBAAwB~~,~~EAC/B~~,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,EAAC,IAAI,EAAE,gBAAQ,EAAC,EACtB,KAAK,EAAE,KAAK,CAAC,SAAS,EACtB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,YAAY,EAAE,IAAI,GACpB,CACL,IACC,GACJ,CACT,CAAC;AACN,CAAC","sourcesContent":["import {useMemo} from 'react';\n\nimport {Ellipsis} from '@gravity-ui/icons';\nimport {useMeasure} from 'react-use';\n\nimport {cn} from '../classname';\nimport {logger} from '../logger';\nimport {useRenderTime} from '../react-utils/hooks';\n\nimport {Toolbar, type ToolbarProps} from './Toolbar';\nimport {ToolbarListButton} from './ToolbarListButton';\nimport {shrinkToolbarData} from './flexible';\nimport {ToolbarDataType, type ToolbarItemData} from './types';\n\nimport './FlexToolbar.scss';\n\nconst b = cn('flex-toolbar');\n\nexport type FlexToolbarProps<E> = ToolbarProps<E> & {\n dotsTitle: string \| (() => string);\n hiddenActions?: ToolbarItemData<E>[];\n};\n\nexport function FlexToolbar<E>(props: FlexToolbarProps<E>) {\n useRenderTime((time) => {\n logger.metrics({\n component: 'toolbar',\n event: 'render',\n duration: time,\n });\n });\n\n const {data, className, hiddenActions} = props;\n\n const [ref, {width}] = useMeasure<HTMLDivElement>();\n const {data: items, dots} = useMemo(() => {\n const toolbarButtonIds = data.reduce((a: string[], toolbarGroup) => {\n return [\n ...a,\n ...toolbarGroup\n .map((toolbarButton) => {\n if (toolbarButton.type === ToolbarDataType.ListButton) {\n return toolbarButton.data.map((v) => v.id);\n }\n return toolbarButton.id;\n })\n .flat(),\n ];\n }, []);\n\n // Finding only actions tha are not present in the main toolbar config\n const filteredHiddenAction = hiddenActions?.filter((a) => !toolbarButtonIds.includes(a.id));\n return shrinkToolbarData({\n data,\n availableWidth: width,\n hiddenActions: filteredHiddenAction,\n });\n }, [data, width, hiddenActions]);\n\n return (\n <div ref={ref} className={b(null, [className])}>\n <div className={b('container')}>\n <Toolbar {...props} data={items} className={b('bar')} />\n {dots?.length && (\n <ToolbarListButton\n qa=\"g-md-toolbar-more-action\"\n qaMenu=\"g-md-toolbar-~~more-menu~~\"\n data={dots}\n icon={{data: Ellipsis}}\n title={props.dotsTitle}\n editor={props.editor}\n focus={props.focus}\n onClick={props.onClick}\n className={b('dots')}\n alwaysActive={true}\n />\n )}\n </div>\n </div>\n );\n}\n"]}
1	+ {"version":3,"file":"FlexToolbar.js","sourceRoot":"../../../src","sources":["toolbar/FlexToolbar.tsx"],"names":[],"mappings":";;AAuBA,kCAyDC;;AAhFD,iCAA8B;AAE9B,6CAA2C;AAC3C,yCAAqC;AAErC,+CAAgC;AAChC,yCAAiC;AACjC,mDAAmD;AAEnD,0CAAqD;AACrD,8DAAsD;AACtD,4CAA6C;AAC7C,sCAA8D;AAE9D,6BAA4B;AAE5B,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,cAAc,CAAC,CAAC;AAO7B,SAAgB,WAAW,CAAI,KAA0B;IACrD,IAAA,qBAAa,EAAC,CAAC,IAAI,EAAE,EAAE;QACnB,eAAM,CAAC,OAAO,CAAC;YACX,SAAS,EAAE,SAAS;YACpB,KAAK,EAAE,QAAQ;YACf,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;IAEH,MAAM,EAAC,IAAI,EAAE,SAAS,EAAE,aAAa,EAAC,GAAG,KAAK,CAAC;IAE/C,MAAM,CAAC,GAAG,EAAE,EAAC,KAAK,EAAC,CAAC,GAAG,IAAA,sBAAU,GAAkB,CAAC;IACpD,MAAM,EAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAC,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QACrC,MAAM,gBAAgB,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAW,EAAE,YAAY,EAAE,EAAE;YAC/D,OAAO;gBACH,GAAG,CAAC;gBACJ,GAAG,YAAY;qBACV,GAAG,CAAC,CAAC,aAAa,EAAE,EAAE;oBACnB,IAAI,aAAa,CAAC,IAAI,KAAK,uBAAe,CAAC,UAAU,EAAE,CAAC;wBACpD,OAAO,aAAa,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;oBAC/C,CAAC;oBACD,OAAO,aAAa,CAAC,EAAE,CAAC;gBAC5B,CAAC,CAAC;qBACD,IAAI,EAAE;aACd,CAAC;QACN,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,sEAAsE;QACtE,MAAM,oBAAoB,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QAC5F,OAAO,IAAA,4BAAiB,EAAC;YACrB,IAAI;YACJ,cAAc,EAAE,KAAK;YACrB,aAAa,EAAE,oBAAoB;SACtC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC;IAEjC,OAAO,CACH,gCAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,SAAS,CAAC,CAAC,YAC1C,iCAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,aAC1B,uBAAC,iBAAO,OAAK,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC,KAAK,CAAC,GAAI,EACvD,IAAI,EAAE,MAAM,IAAI,CACb,uBAAC,qCAAiB,IACd,EAAE,EAAC,0BAA0B,EAC7B,MAAM,EAAC,yBAAyB,EAChC,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,EAAC,IAAI,EAAE,gBAAQ,EAAC,EACtB,KAAK,EAAE,KAAK,CAAC,SAAS,EACtB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,YAAY,EAAE,IAAI,GACpB,CACL,IACC,GACJ,CACT,CAAC;AACN,CAAC","sourcesContent":["import {useMemo} from 'react';\n\nimport {Ellipsis} from '@gravity-ui/icons';\nimport {useMeasure} from 'react-use';\n\nimport {cn} from '../classname';\nimport {logger} from '../logger';\nimport {useRenderTime} from '../react-utils/hooks';\n\nimport {Toolbar, type ToolbarProps} from './Toolbar';\nimport {ToolbarListButton} from './ToolbarListButton';\nimport {shrinkToolbarData} from './flexible';\nimport {ToolbarDataType, type ToolbarItemData} from './types';\n\nimport './FlexToolbar.scss';\n\nconst b = cn('flex-toolbar');\n\nexport type FlexToolbarProps<E> = ToolbarProps<E> & {\n dotsTitle: string \| (() => string);\n hiddenActions?: ToolbarItemData<E>[];\n};\n\nexport function FlexToolbar<E>(props: FlexToolbarProps<E>) {\n useRenderTime((time) => {\n logger.metrics({\n component: 'toolbar',\n event: 'render',\n duration: time,\n });\n });\n\n const {data, className, hiddenActions} = props;\n\n const [ref, {width}] = useMeasure<HTMLDivElement>();\n const {data: items, dots} = useMemo(() => {\n const toolbarButtonIds = data.reduce((a: string[], toolbarGroup) => {\n return [\n ...a,\n ...toolbarGroup\n .map((toolbarButton) => {\n if (toolbarButton.type === ToolbarDataType.ListButton) {\n return toolbarButton.data.map((v) => v.id);\n }\n return toolbarButton.id;\n })\n .flat(),\n ];\n }, []);\n\n // Finding only actions tha are not present in the main toolbar config\n const filteredHiddenAction = hiddenActions?.filter((a) => !toolbarButtonIds.includes(a.id));\n return shrinkToolbarData({\n data,\n availableWidth: width,\n hiddenActions: filteredHiddenAction,\n });\n }, [data, width, hiddenActions]);\n\n return (\n <div ref={ref} className={b(null, [className])}>\n <div className={b('container')}>\n <Toolbar {...props} data={items} className={b('bar')} />\n {dots?.length && (\n <ToolbarListButton\n qa=\"g-md-toolbar-more-action\"\n qaMenu=\"g-md-toolbar-additional\"\n data={dots}\n icon={{data: Ellipsis}}\n title={props.dotsTitle}\n editor={props.editor}\n focus={props.focus}\n onClick={props.onClick}\n className={b('dots')}\n alwaysActive={true}\n />\n )}\n </div>\n </div>\n );\n}\n"]}

package/build/cjs/toolbar/Toolbar.d.ts CHANGED Viewed

@@ -4,4 +4,4 @@ export type { ToolbarData };
 export type ToolbarProps<E> = ToolbarBaseProps<E> & {
     data: ToolbarData<E>;
 };
-export declare function Toolbar<E>({ editor, data, className, focus, onClick }: ToolbarProps<E>): JSX.Element;
+export declare function Toolbar<E>({ editor, data, className, focus, onClick, qa }: ToolbarProps<E>): JSX.Element;

package/build/cjs/toolbar/Toolbar.js CHANGED Viewed

@@ -7,8 +7,8 @@ const classname_1 = require("../classname.js");
 const ToolbarGroup_1 = require("./ToolbarGroup.js");
 require("./Toolbar.css");
 const b = (0, classname_1.cn)('toolbar');
-function Toolbar({ editor, data, className, focus, onClick }) {
-    return ((0, jsx_runtime_1.jsx)("div", { className: b(null, [className]), children: data.map((group, index) => {
+function Toolbar({ editor, data, className, focus, onClick, qa }) {
+    return ((0, jsx_runtime_1.jsx)("div", { className: b(null, [className]), "data-qa": qa, children: data.map((group, index) => {
             const isLastGroup = index === data.length - 1;
             return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ToolbarGroup_1.ToolbarButtonGroup, { data: group, editor: editor, focus: focus, onClick: onClick, className: b('group') }), isLastGroup || (0, jsx_runtime_1.jsx)("div", { className: b('group-separator') })] }, index));
         }) }));

package/build/cjs/toolbar/Toolbar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Toolbar.js","sourceRoot":"../../../src","sources":["toolbar/Toolbar.tsx"],"names":[],"mappings":";;AAiBA,0BAqBC;;AAtCD,iCAA+B;AAE/B,+CAAgC;AAEhC,oDAAkD;AAGlD,yBAAwB;AAExB,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,SAAS,CAAC,CAAC;AAQxB,SAAgB,OAAO,CAAI,EAAC,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAkB;~~IACjF~~,OAAO,CACH,gCAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,SAAS,CAAC,CAAC,~~YAC/B~~,IAAI,CAAC,GAAG,CAAkB,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;YACxC,MAAM,WAAW,GAAG,KAAK,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;YAE9C,OAAO,CACH,wBAAC,gBAAQ,eACL,uBAAC,iCAAkB,IACf,IAAI,EAAE,KAAK,EACX,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,GACvB,EACD,WAAW,IAAI,gCAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,GAAI,KAR7C,KAAK,CAST,CACd,CAAC;QACN,CAAC,CAAC,GACA,CACT,CAAC;AACN,CAAC","sourcesContent":["import {Fragment} from 'react';\n\nimport {cn} from '../classname';\n\nimport {ToolbarButtonGroup} from './ToolbarGroup';\nimport type {ToolbarBaseProps, ToolbarData} from './types';\n\nimport './Toolbar.scss';\n\nconst b = cn('toolbar');\n\nexport type {ToolbarData};\n\nexport type ToolbarProps<E> = ToolbarBaseProps<E> & {\n data: ToolbarData<E>;\n};\n\nexport function Toolbar<E>({editor, data, className, focus, onClick}: ToolbarProps<E>) {\n return (\n <div className={b(null, [className])}>\n {data.map<React.ReactNode>((group, index) => {\n const isLastGroup = index === data.length - 1;\n\n return (\n <Fragment key={index}>\n <ToolbarButtonGroup\n data={group}\n editor={editor}\n focus={focus}\n onClick={onClick}\n className={b('group')}\n />\n {isLastGroup \|\| <div className={b('group-separator')} />}\n </Fragment>\n );\n })}\n </div>\n );\n}\n"]}
1	+ {"version":3,"file":"Toolbar.js","sourceRoot":"../../../src","sources":["toolbar/Toolbar.tsx"],"names":[],"mappings":";;AAiBA,0BAqBC;;AAtCD,iCAA+B;AAE/B,+CAAgC;AAEhC,oDAAkD;AAGlD,yBAAwB;AAExB,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,SAAS,CAAC,CAAC;AAQxB,SAAgB,OAAO,CAAI,EAAC,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAkB;IACrF,OAAO,CACH,gCAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,SAAS,CAAC,CAAC,aAAW,EAAE,YAC5C,IAAI,CAAC,GAAG,CAAkB,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;YACxC,MAAM,WAAW,GAAG,KAAK,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;YAE9C,OAAO,CACH,wBAAC,gBAAQ,eACL,uBAAC,iCAAkB,IACf,IAAI,EAAE,KAAK,EACX,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,GACvB,EACD,WAAW,IAAI,gCAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,GAAI,KAR7C,KAAK,CAST,CACd,CAAC;QACN,CAAC,CAAC,GACA,CACT,CAAC;AACN,CAAC","sourcesContent":["import {Fragment} from 'react';\n\nimport {cn} from '../classname';\n\nimport {ToolbarButtonGroup} from './ToolbarGroup';\nimport type {ToolbarBaseProps, ToolbarData} from './types';\n\nimport './Toolbar.scss';\n\nconst b = cn('toolbar');\n\nexport type {ToolbarData};\n\nexport type ToolbarProps<E> = ToolbarBaseProps<E> & {\n data: ToolbarData<E>;\n};\n\nexport function Toolbar<E>({editor, data, className, focus, onClick, qa}: ToolbarProps<E>) {\n return (\n <div className={b(null, [className])} data-qa={qa}>\n {data.map<React.ReactNode>((group, index) => {\n const isLastGroup = index === data.length - 1;\n\n return (\n <Fragment key={index}>\n <ToolbarButtonGroup\n data={group}\n editor={editor}\n focus={focus}\n onClick={onClick}\n className={b('group')}\n />\n {isLastGroup \|\| <div className={b('group-separator')} />}\n </Fragment>\n );\n })}\n </div>\n );\n}\n"]}

package/build/cjs/toolbar/ToolbarListButton.d.ts CHANGED Viewed

@@ -3,5 +3,6 @@ import "./ToolbarListButton.css";
 export type { ToolbarListButtonData };
 export type ToolbarListButtonProps<E> = ToolbarBaseProps<E> & ToolbarListButtonData<E> & {
     qaMenu?: string;
+    qaActionDisabledPopover?: string;
 };
-export declare function ToolbarListButton<E>({ className, editor, focus, onClick, icon, title, withArrow, data, alwaysActive, replaceActiveIcon, qa, qaMenu, }: ToolbarListButtonProps<E>): JSX.Element | null;
+export declare function ToolbarListButton<E>({ className, editor, focus, onClick, icon, title, withArrow, data, alwaysActive, replaceActiveIcon, qa, qaMenu, qaActionDisabledPopover, }: ToolbarListButtonProps<E>): JSX.Element | null;

package/build/cjs/toolbar/ToolbarListButton.js CHANGED Viewed

@@ -13,7 +13,7 @@ const PreviewTooltip_1 = require("./PreviewTooltip.js");
 const ToolbarButton_1 = require("./ToolbarButton.js");
 require("./ToolbarListButton.css");
 const b = (0, classname_1.cn)('toolbar-list-button');
-function ToolbarListButton({ className, editor, focus, onClick, icon, title, withArrow, data, alwaysActive, replaceActiveIcon, qa, qaMenu, }) {
+function ToolbarListButton({ className, editor, focus, onClick, icon, title, withArrow, data, alwaysActive, replaceActiveIcon, qa, qaMenu, qaActionDisabledPopover = 'g-md-toolbar-action-disabled-hint', }) {
     const [anchorElement, setAnchorElement] = (0, hooks_1.useElementState)();
     const [open, , hide, toggleOpen] = (0, hooks_1.useBooleanState)(false);
     const [popupItem, setPopupItem] = (0, react_1.useState)();
@@ -66,7 +66,7 @@ function ToolbarListButton({ className, editor, focus, onClick, icon, title, wit
                                 onClick?.(id);
                             }
                         };
-                        return ((0, jsx_runtime_1.jsx)(uikit_1.Popover, { className: b('action-disabled-popover'), content: (0, jsx_runtime_1.jsx)("div", { className: b('action-disabled-tooltip'), children: hintWhenDisabledText }), placement: "left", modal: false, disabled: hideHintWhenDisabled, qa: "g-md-toolbar-action-disabled-hint", children: (props, ref) => ((0, jsx_runtime_1.jsx)(PreviewTooltip_1.PreviewTooltip, { preview: preview, children: (0, jsx_runtime_1.jsx)(uikit_1.Menu.Item, { ref: ref, active: isActive(editor), disabled: !isEnable(editor), onClick: handleClick, iconStart: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icon.data, size: icon.size ?? 16 }), extraProps: {
+                        return ((0, jsx_runtime_1.jsx)(uikit_1.Popover, { className: b('action-disabled-popover'), content: (0, jsx_runtime_1.jsx)("div", { className: b('action-disabled-tooltip'), children: hintWhenDisabledText }), placement: "left", modal: false, disabled: hideHintWhenDisabled, qa: qaActionDisabledPopover, children: (props, ref) => ((0, jsx_runtime_1.jsx)(PreviewTooltip_1.PreviewTooltip, { preview: preview, children: (0, jsx_runtime_1.jsx)(uikit_1.Menu.Item, { ref: ref, active: isActive(editor), disabled: !isEnable(editor), onClick: handleClick, iconStart: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icon.data, size: icon.size ?? 16 }), extraProps: {
                                         ...props,
                                         'aria-label': titleText,
                                     }, children: (0, jsx_runtime_1.jsxs)("div", { className: b('item'), children: [titleText, (0, jsx_runtime_1.jsxs)("div", { className: b('extra'), children: [hotkey && (0, jsx_runtime_1.jsx)(uikit_1.Hotkey, { value: hotkey }), hintText && ((0, jsx_runtime_1.jsx)(uikit_1.HelpMark, { className: b('hint'), popoverProps: { modal: false }, children: hintText }))] })] }) }, id) })) }, id));