@antscorp/antsomi-ui 2.0.82 → 2.0.83-text-editor-beta.1

package/es/components/organism/TextEditor/ui/Toolbar/actions/FontSizeAction.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useTextEditorStore } from '../../../provider';
+import { FontSizeInput, } from '@antscorp/antsomi-ui/es/components/molecules';
+import styled from 'styled-components';
+import { useCallback, useMemo, useRef, useState } from 'react';
+import { useDebouncedCallback } from 'use-debounce';
+import { DEFAULT_TEXT_STYLE } from '../../../constants';
+const StyledFontSizeInput = styled(FontSizeInput) `
+  &.antsomi-input-number {
+    height: 22.5px;
+
+    input.antsomi-input-number-input {
+      font-size: 12px;
+      padding: 0 0 0 7px;
+    }
+  }
+`;
+export const FontSizeAction = ({ editor, debounceUpdateSize = 500 }) => {
+    const inputRef = useRef(null);
+    const bubbleMenuContainer = useTextEditorStore(state => state.bubbleMenuContainer);
+    const numberFontSize = (editor.getAttributes('textStyle').fontSize || DEFAULT_TEXT_STYLE.fontSize).replace('px', '');
+    const [currentFontSize, setCurrentFontSize] = useState(numberFontSize);
+    const updateEditorFontSize = useDebouncedCallback((v) => {
+        if (v === numberFontSize)
+            return;
+        editor.chain().focus().setFontSize(`${v}px`).run();
+    }, debounceUpdateSize);
+    const handleUpdateSize = useCallback((value) => {
+        setCurrentFontSize(+value);
+        updateEditorFontSize(+value);
+    }, [updateEditorFontSize]);
+    const handleFontSizeChange = useCallback((value, info) => {
+        if (info.type === 'dropdown') {
+            handleUpdateSize(value);
+        }
+        inputRef.current?.closeDropdown();
+    }, [handleUpdateSize]);
+    const dropdownProps = useMemo(() => ({
+        getPopupContainer: () => bubbleMenuContainer,
+    }), [bubbleMenuContainer]);
+    return (_jsx(StyledFontSizeInput, { ref: inputRef, placeholder: "Font Size", value: currentFontSize, onChange: handleFontSizeChange, dropdownProps: dropdownProps, onBlur: handleUpdateSize }));
+};

package/es/components/organism/TextEditor/ui/Toolbar/actions/HighlightAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface HighlightActionProps {
+    editor: Editor;
+}
+export declare const HighlightAction: ({ editor }: HighlightActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/HighlightAction.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { HighlighterIcon } from 'lucide-react';
+import { ColorPicker } from '../../ColorPicker';
+import { TEXT_EDITOR_CONSTANTS } from '../../../constants';
+const { TOOLTIPS } = TEXT_EDITOR_CONSTANTS;
+export const HighlightAction = ({ editor }) => (_jsx(ColorPicker, { value: editor.getAttributes('highlight').color, onChange: v => editor.chain().focus().setHighlight({ color: v }).run(), usedColorsStorageKey: "text-backgrounds", children: _jsx(Tooltip, { title: TOOLTIPS.HIGHLIGHT.TITLE, placement: "top", children: _jsx(Button, { size: "small", icon: _jsx(HighlighterIcon, { color: editor.getAttributes('highlight').color, size: 16 }) }) }) }));

package/es/components/organism/TextEditor/ui/Toolbar/actions/IndentAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface IndentActionProps {
+    editor: Editor;
+}
+export declare const IndentAction: ({ editor }: IndentActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/IndentAction.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { IndentIcon } from 'lucide-react';
+export const IndentAction = ({ editor }) => {
+    const disabled = !editor.can().chain().focus().indent().run();
+    return (_jsx(Tooltip, { open: disabled ? false : undefined, title: "Indent (Tab)", placement: "top", children: _jsx(Button, { size: "small", disabled: disabled, onClick: () => editor.chain().focus().indent().run(), icon: _jsx(IndentIcon, { size: 16 }) }) }));
+};

package/es/components/organism/TextEditor/ui/Toolbar/actions/ItalicAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface ItalicActionProps {
+    editor: Editor;
+}
+export declare const ItalicAction: ({ editor }: ItalicActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/ItalicAction.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { ItalicIcon } from 'lucide-react';
+import { formatHotkey } from '../../../utils';
+import { TEXT_EDITOR_CONSTANTS } from '../../../constants';
+const { TOOLTIPS } = TEXT_EDITOR_CONSTANTS;
+export const ItalicAction = ({ editor }) => (_jsx(Tooltip, { title: `${TOOLTIPS.ITALIC.TITLE} (${formatHotkey(TOOLTIPS.ITALIC.SHORTCUT)})`, placement: "top", children: _jsx(Button, { size: "small", onClick: () => editor.chain().focus().toggleItalic().run(), disabled: !editor.can().chain().focus().toggleItalic().run(), type: editor.isActive('italic') ? 'primary' : 'default', icon: _jsx(ItalicIcon, { size: 16 }) }) }));

package/es/components/organism/TextEditor/ui/Toolbar/actions/LinkAction.d.ts

@@ -0,0 +1,6 @@
+import { Editor } from '@tiptap/core';
+export interface LinkActionProps {
+    editor: Editor;
+    onClick?: () => void;
+}
+export declare const LinkAction: ({ editor, onClick }: LinkActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/LinkAction.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { Link2Icon } from 'lucide-react';
+export const LinkAction = ({ editor, onClick }) => (_jsx(Tooltip, { title: "Link Tag", placement: "top", children: _jsx(Button, { size: "small", type: editor.isActive('link') ? 'primary' : 'default', icon: _jsx(Link2Icon, { size: 16 }), onClick: () => onClick?.() }) }));

package/es/components/organism/TextEditor/ui/Toolbar/actions/OrderedListAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface OrderedListActionProps {
+    editor: Editor;
+}
+export declare const OrderedListAction: ({ editor }: OrderedListActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/OrderedListAction.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { ListOrderedIcon } from 'lucide-react';
+import { formatHotkey } from '../../../utils';
+import { TEXT_EDITOR_CONSTANTS } from '../../../constants';
+const { TOOLTIPS } = TEXT_EDITOR_CONSTANTS;
+export const OrderedListAction = ({ editor }) => (_jsx(Tooltip, { title: `${TOOLTIPS.ORDERED_LIST.TITLE} (${formatHotkey(TOOLTIPS.ORDERED_LIST.SHORTCUT)})`, placement: "top", children: _jsx(Button, { size: "small", onClick: () => editor.chain().focus().toggleOrderedList().run(), type: editor.isActive('orderedList') ? 'primary' : 'default', icon: _jsx(ListOrderedIcon, { size: 16 }) }) }));

package/es/components/organism/TextEditor/ui/Toolbar/actions/OutdentAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface OutdentActionProps {
+    editor: Editor;
+}
+export declare const OutdentAction: ({ editor }: OutdentActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/OutdentAction.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { OutdentIcon } from 'lucide-react';
+export const OutdentAction = ({ editor }) => {
+    const disabled = !editor.can().chain().focus().outdent().run();
+    return (_jsx(Tooltip, { open: disabled ? false : undefined, title: "Outdent (Shift + Tab)", placement: "top", children: _jsx(Button, { size: "small", disabled: disabled, onClick: () => editor.chain().focus().outdent().run(), icon: _jsx(OutdentIcon, { size: 16 }) }) }));
+};

package/es/components/organism/TextEditor/ui/Toolbar/actions/SmartTagAction.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { Editor } from '@tiptap/core';
+export interface SmartTagActionProps {
+    editor: Editor;
+    onClick?: (event: React.MouseEvent) => void;
+}
+export declare const SmartTagAction: (props: SmartTagActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/SmartTagAction.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { BracesIcon } from 'lucide-react';
+import { TEXT_EDITOR_CONSTANTS } from '../../../constants';
+const { TOOLTIPS } = TEXT_EDITOR_CONSTANTS;
+export const SmartTagAction = (props) => {
+    const { editor, onClick } = props;
+    return (_jsx(Tooltip, { title: TOOLTIPS.SMART_TAG.TITLE, placement: "top", children: _jsx(Button, { size: "small", onClick: onClick, type: editor.isActive('smartTag') ? 'primary' : 'default', icon: _jsx(BracesIcon, { size: 16 }) }) }));
+};

package/es/components/organism/TextEditor/ui/Toolbar/actions/SpacingAction.d.ts

@@ -0,0 +1,9 @@
+import { Editor } from '@tiptap/core';
+interface SpacingActionProps {
+    editor: Editor;
+}
+export declare const SpacingIcon: (props: React.SVGProps<SVGSVGElement> & {
+    size?: number;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const SpacingAction: (props: SpacingActionProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/es/components/organism/TextEditor/ui/Toolbar/actions/SpacingAction.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Menu, Tooltip } from 'antd';
+import { useState } from 'react';
+import { TextEditorPopover } from '../../Popover';
+export const SpacingIcon = (props) => {
+    const { size = 24, ...restProps } = props;
+    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...restProps, children: _jsx("path", { d: "M21 10H13M21 6H13M21 14H13M21 18H13M6 20L6 4M6 20L3 17M6 20L9 17M6 4L3 7M6 4L9 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+};
+export const SpacingAction = (props) => {
+    const { editor } = props;
+    const [isOpen, setIsOpen] = useState(false);
+    return (_jsx(TextEditorPopover, { open: isOpen, onOpenChange: setIsOpen, trigger: ['click'], arrow: false, overlayInnerStyle: {
+            padding: 0,
+        }, content: _jsx(Menu, { items: [
+                { key: '1', label: 'Single' },
+                { key: '1.15', label: '1.15' },
+                { key: '1.5', label: '1.5' },
+                { key: '2', label: 'Double' },
+            ], onClick: ({ key }) => {
+                editor.chain().focus().setLineHeight(key).run();
+            } }), children: _jsx(Tooltip, { open: isOpen ? false : undefined, title: "Line Spacing", placement: "top", destroyTooltipOnHide: true, children: _jsx(Button, { size: "small", icon: _jsx(SpacingIcon, { size: 16 }) }) }) }));
+};

package/es/components/organism/TextEditor/ui/Toolbar/actions/StrikeAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface StrikeActionProps {
+    editor: Editor;
+}
+export declare const StrikeAction: ({ editor }: StrikeActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/StrikeAction.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { StrikethroughIcon } from 'lucide-react';
+import { formatHotkey } from '../../../utils';
+import { TEXT_EDITOR_CONSTANTS } from '../../../constants';
+const { TOOLTIPS } = TEXT_EDITOR_CONSTANTS;
+export const StrikeAction = ({ editor }) => (_jsx(Tooltip, { title: `${TOOLTIPS.STRIKE.TITLE} (${formatHotkey(TOOLTIPS.STRIKE.SHORTCUT)})`, placement: "top", children: _jsx(Button, { size: "small", onClick: () => editor.chain().focus().toggleStrike().run(), disabled: !editor.can().chain().focus().toggleStrike().run(), type: editor.isActive('strike') ? 'primary' : 'default', children: _jsx(StrikethroughIcon, { size: 16 }) }) }));

package/es/components/organism/TextEditor/ui/Toolbar/actions/SubscriptAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface SubscriptActionProps {
+    editor: Editor;
+}
+export declare const SubscriptAction: ({ editor }: SubscriptActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/SubscriptAction.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { SubscriptIcon } from 'lucide-react';
+import { TEXT_EDITOR_CONSTANTS } from '../../../constants';
+const { TOOLTIPS } = TEXT_EDITOR_CONSTANTS;
+export const SubscriptAction = ({ editor }) => (_jsx(Tooltip, { title: TOOLTIPS.SUBSCRIPT.TITLE, placement: "top", children: _jsx(Button, { size: "small", onClick: () => {
+            if (editor.isActive('superscript')) {
+                editor.chain().focus().toggleSuperscript().toggleSubscript().run();
+            }
+            else {
+                editor.chain().focus().toggleSubscript().run();
+            }
+        }, disabled: !editor.can().chain().focus().toggleSubscript().run(), type: editor.isActive('subscript') ? 'primary' : 'default', children: _jsx(SubscriptIcon, { size: 16 }) }) }));

package/es/components/organism/TextEditor/ui/Toolbar/actions/SuperscriptAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface SuperscriptActionProps {
+    editor: Editor;
+}
+export declare const SuperscriptAction: ({ editor }: SuperscriptActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/SuperscriptAction.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { SuperscriptIcon } from 'lucide-react';
+import { TEXT_EDITOR_CONSTANTS } from '../../../constants';
+const { TOOLTIPS } = TEXT_EDITOR_CONSTANTS;
+export const SuperscriptAction = ({ editor }) => (_jsx(Tooltip, { title: TOOLTIPS.SUPERSCRIPT.TITLE, placement: "top", children: _jsx(Button, { size: "small", onClick: () => {
+            if (editor.isActive('subscript')) {
+                editor.chain().focus().toggleSubscript().toggleSuperscript().run();
+            }
+            else {
+                editor.chain().focus().toggleSuperscript().run();
+            }
+        }, disabled: !editor.can().chain().focus().toggleSuperscript().run(), type: editor.isActive('superscript') ? 'primary' : 'default', children: _jsx(SuperscriptIcon, { size: 16 }) }) }));

package/es/components/organism/TextEditor/ui/Toolbar/actions/TextAlignAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface TextAlignActionProps {
+    editor: Editor;
+}
+export declare const TextAlignAction: ({ editor }: TextAlignActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/TextAlignAction.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { TextAlignSelect } from '../../TextAlignSelect';
+export const TextAlignAction = ({ editor }) => (_jsx(TextAlignSelect, { editor: editor, onChange: v => editor.chain().focus().setTextAlign(v).run() }));

package/es/components/organism/TextEditor/ui/Toolbar/actions/TextBackgroundColorAction.d.ts

@@ -0,0 +1,7 @@
+import { Editor } from '@tiptap/core';
+import { ColorPickerProps } from '../../ColorPicker/ColorPicker';
+export interface HighlightActionProps {
+    editor: Editor;
+    colorPickerProps?: ColorPickerProps;
+}
+export declare const TextBackColorAction: ({ editor, colorPickerProps }: HighlightActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/TextBackgroundColorAction.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Flex, Tooltip } from 'antd';
+import { HighlighterIcon, BrushCleaningIcon } from 'lucide-react';
+import { ColorPicker } from '../../ColorPicker';
+import { TEXT_EDITOR_CONSTANTS } from '../../../constants';
+import { useRef } from 'react';
+import tinycolor from 'tinycolor2';
+const { TOOLTIPS } = TEXT_EDITOR_CONSTANTS;
+export const TextBackColorAction = ({ editor, colorPickerProps }) => {
+    const ref = useRef(null);
+    const handleClearBackgroundColor = () => {
+        editor.chain().focus().unsetBackgroundColor().run();
+        ref.current?.setOpen(false);
+    };
+    const activeColor = editor.getAttributes('textStyle').backgroundColor;
+    return (_jsx(ColorPicker, { ...colorPickerProps, ref: ref, value: editor.getAttributes('textStyle').backgroundColor, onChange: v => editor.chain().focus().setBackgroundColor(v).run(), usedColorsStorageKey: "text-backgrounds", popoverProps: {
+            content: ({ colorGrid, usedColors, customColorPicker }) => (_jsxs(Flex, { vertical: true, gap: 8, children: [colorGrid, usedColors, customColorPicker, _jsx(Button, { icon: _jsx(BrushCleaningIcon, { size: 16 }), onClick: handleClearBackgroundColor, type: "text", children: "Clear" })] })),
+        }, children: _jsx(Tooltip, { title: TOOLTIPS.HIGHLIGHT.TITLE, placement: "top", children: _jsx(Button, { size: "small", icon: _jsx(HighlighterIcon, { color: tinycolor(activeColor).isValid() ? activeColor : undefined, size: 16 }) }) }) }));
+};

package/es/components/organism/TextEditor/ui/Toolbar/actions/TextColorAction.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { Editor } from '@tiptap/core';
+import { ColorPickerProps } from '../../ColorPicker/ColorPicker';
+interface IconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    textColor?: string;
+    size?: number;
+}
+export declare const TextColorIcon: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export interface TextColorActionProps {
+    editor: Editor;
+    colorPickerProps?: ColorPickerProps;
+}
+export declare const TextColorAction: ({ editor, colorPickerProps }: TextColorActionProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/es/components/organism/TextEditor/ui/Toolbar/actions/TextColorAction.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { ColorPicker } from '../../ColorPicker';
+import { TEXT_EDITOR_CONSTANTS } from '../../../constants';
+import tinycolor from 'tinycolor2';
+const { TOOLTIPS } = TEXT_EDITOR_CONSTANTS;
+export const TextColorIcon = (props) => {
+    const { color, textColor, size, ...rest } = props;
+    return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: size || 24, height: size || 24, viewBox: "0 0 24 24", fill: "none", stroke: color || 'currentColor', strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", ...rest, children: [_jsx("path", { stroke: textColor, d: "M4 20h16" }), _jsx("path", { d: "m6 16 6-12 6 12" }), _jsx("path", { d: "M8 12h8" })] }));
+};
+export const TextColorAction = ({ editor, colorPickerProps }) => {
+    const activeColor = editor.getAttributes('textStyle').color;
+    return (_jsx(ColorPicker, { ...colorPickerProps, value: editor.getAttributes('textStyle').color, onChange: v => editor.chain().focus().setColor(v).run(), usedColorsStorageKey: "text-colors", children: _jsx(Tooltip, { title: TOOLTIPS.TEXT_COLOR.TITLE, placement: "top", children: _jsx(Button, { size: "small", icon: _jsx(TextColorIcon, { size: 16, textColor: tinycolor(activeColor) ? activeColor : undefined }) }) }) }));
+};

package/es/components/organism/TextEditor/ui/Toolbar/actions/TextTransformAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface TextTransformActionProps {
+    editor: Editor;
+}
+export declare const TextTransformAction: ({ editor }: TextTransformActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/TextTransformAction.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { TEXT_EDITOR_CONSTANTS } from '../../../constants';
+import { TextEditorSelect } from '../../Select';
+const { TEXT_TRANSFORM } = TEXT_EDITOR_CONSTANTS;
+export const TextTransformAction = ({ editor }) => (_jsx(TextEditorSelect, { value: editor.getAttributes('textStyle').textTransform, style: { width: 120 }, size: "small", options: [
+        {
+            label: TEXT_TRANSFORM.OPTIONS.UPPERCASE.LABEL,
+            value: TEXT_TRANSFORM.OPTIONS.UPPERCASE.VALUE,
+            disabled: editor.getAttributes('textTransform').textTransform ===
+                TEXT_TRANSFORM.OPTIONS.UPPERCASE.VALUE,
+        },
+        {
+            label: TEXT_TRANSFORM.OPTIONS.LOWERCASE.LABEL,
+            value: TEXT_TRANSFORM.OPTIONS.LOWERCASE.VALUE,
+            disabled: editor.getAttributes('textTransform').textTransform ===
+                TEXT_TRANSFORM.OPTIONS.LOWERCASE.VALUE,
+        },
+        {
+            label: TEXT_TRANSFORM.OPTIONS.CAPITALIZE.LABEL,
+            value: TEXT_TRANSFORM.OPTIONS.CAPITALIZE.VALUE,
+            disabled: editor.getAttributes('textTransform').textTransform ===
+                TEXT_TRANSFORM.OPTIONS.CAPITALIZE.VALUE,
+        },
+        {
+            label: TEXT_TRANSFORM.OPTIONS.NONE.LABEL,
+            value: TEXT_TRANSFORM.OPTIONS.NONE.VALUE,
+        },
+    ], onChange: v => editor.chain().focus().setTextTransform(v).run(), placeholder: TEXT_TRANSFORM.PLACEHOLDER }));

package/es/components/organism/TextEditor/ui/Toolbar/actions/UnderlineAction.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/core';
+export interface UnderlineActionProps {
+    editor: Editor;
+}
+export declare const UnderlineAction: ({ editor }: UnderlineActionProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/organism/TextEditor/ui/Toolbar/actions/UnderlineAction.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { UnderlineIcon } from 'lucide-react';
+import { formatHotkey } from '../../../utils';
+export const UnderlineAction = ({ editor }) => (_jsx(Tooltip, { title: `Underline (${formatHotkey('U')})`, placement: "top", children: _jsx(Button, { size: "small", onClick: () => editor.chain().focus().toggleUnderline().run(), disabled: !editor.can().chain().focus().toggleUnderline().run(), type: editor.isActive('underline') ? 'primary' : 'default', icon: _jsx(UnderlineIcon, { size: 16 }) }) }));

package/es/components/organism/TextEditor/ui/Toolbar/actions/UnsetLink.d.ts

@@ -0,0 +1,6 @@
+import { Editor } from '@tiptap/core';
+interface UnsetLinkActionProps {
+    editor: Editor;
+}
+export declare const UnsetLinkAction: (props: UnsetLinkActionProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/es/components/organism/TextEditor/ui/Toolbar/actions/UnsetLink.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, Tooltip } from 'antd';
+import { Link2OffIcon } from 'lucide-react';
+// Hooks
+import { useLinkHandler } from '../../../hooks/useLinkHandler';
+export const UnsetLinkAction = (props) => {
+    const { editor } = props;
+    const { unsetLink } = useLinkHandler({ editor });
+    return (_jsx(Tooltip, { title: "Remove link", children: _jsx(Button, { size: "small", icon: _jsx(Link2OffIcon, { size: 16 }), onClick: () => unsetLink() }) }));
+};

package/es/components/organism/TextEditor/ui/Toolbar/actions/index.d.ts

@@ -0,0 +1,20 @@
+export * from './BoldAction';
+export * from './BulletListAction';
+export * from './ClearFormattingAction';
+export * from './FontFamilyAction';
+export * from './FontSizeAction';
+export * from './ItalicAction';
+export * from './StrikeAction';
+export * from './SuperscriptAction';
+export * from './SubscriptAction';
+export * from './TextTransformAction';
+export * from './LinkAction';
+export * from './SmartTagAction';
+export * from './TextColorAction';
+export * from './HighlightAction';
+export * from './OrderedListAction';
+export * from './TextAlignAction';
+export * from './IndentAction';
+export * from './OutdentAction';
+export * from './UnderlineAction';
+export * from './EmojiAction';

package/es/components/organism/TextEditor/ui/Toolbar/actions/index.js

@@ -0,0 +1,20 @@
+export * from './BoldAction';
+export * from './BulletListAction';
+export * from './ClearFormattingAction';
+export * from './FontFamilyAction';
+export * from './FontSizeAction';
+export * from './ItalicAction';
+export * from './StrikeAction';
+export * from './SuperscriptAction';
+export * from './SubscriptAction';
+export * from './TextTransformAction';
+export * from './LinkAction';
+export * from './SmartTagAction';
+export * from './TextColorAction';
+export * from './HighlightAction';
+export * from './OrderedListAction';
+export * from './TextAlignAction';
+export * from './IndentAction';
+export * from './OutdentAction';
+export * from './UnderlineAction';
+export * from './EmojiAction';

package/es/components/organism/TextEditor/ui/Toolbar/index.d.ts

@@ -0,0 +1 @@
+export { Toolbar, type ToolbarProps } from './Toolbar';

package/es/components/organism/TextEditor/ui/Toolbar/index.js

@@ -0,0 +1 @@
+export { Toolbar } from './Toolbar';

package/es/components/organism/TextEditor/utils/documentState.d.ts

@@ -0,0 +1,57 @@
+import { EditorState } from '@tiptap/pm/state';
+import { Node as ProseMirrorNode } from '@tiptap/pm/model';
+/**
+ * Configuration for document emptiness detection
+ */
+export interface DocumentStateConfig {
+    /** Minimum size to consider document as having content */
+    minContentSize?: number;
+    /** Whether to consider whitespace-only content as empty */
+    ignoreWhitespace?: boolean;
+    /** Custom validation function */
+    customValidator?: (doc: ProseMirrorNode) => boolean;
+}
+/**
+ * Calculates the minimum size of an empty document based on schema
+ */
+export declare function calculateEmptyDocumentSize(state: EditorState): number;
+/**
+ * Checks if document is effectively empty
+ */
+export declare function isDocumentEmpty(state: EditorState, config?: DocumentStateConfig): boolean;
+/**
+ * Checks if document has meaningful content
+ */
+export declare function hasDocumentContent(state: EditorState, config?: DocumentStateConfig): boolean;
+/**
+ * Gets document content statistics
+ */
+export declare function getDocumentStats(state: EditorState): {
+    nodeSize: number;
+    textLength: number;
+    trimmedTextLength: number;
+    nodeCount: void;
+    isEmpty: boolean;
+    emptyDocumentSize: number;
+};
+/**
+ * Document state change detector
+ */
+export declare class DocumentStateTracker {
+    private previousState;
+    /**
+     * Updates tracker with new state and returns changes
+     */
+    update(state: EditorState): {
+        isEmpty: boolean;
+        wasEmpty: boolean;
+        becameEmpty: boolean;
+        becameNonEmpty: boolean;
+        sizeChanged: boolean;
+        textLengthChanged: boolean;
+    };
+    /**
+     * Resets the tracker
+     */
+    reset(): void;
+}

package/es/components/organism/TextEditor/utils/documentState.js

@@ -0,0 +1,100 @@
+/**
+ * Default configuration for document state detection
+ */
+const DEFAULT_CONFIG = {
+    minContentSize: 4, // Standard ProseMirror empty doc size
+    ignoreWhitespace: true,
+    customValidator: () => false,
+};
+/**
+ * Calculates the minimum size of an empty document based on schema
+ */
+export function calculateEmptyDocumentSize(state) {
+    // Create a minimal document with the same schema
+    const emptyDoc = state.schema.topNodeType.createAndFill();
+    return emptyDoc?.nodeSize ?? 4;
+}
+/**
+ * Checks if document is effectively empty
+ */
+export function isDocumentEmpty(state, config = {}) {
+    const { minContentSize, ignoreWhitespace, customValidator } = {
+        ...DEFAULT_CONFIG,
+        ...config,
+    };
+    const { doc } = state;
+    // Use custom validator if provided
+    if (customValidator(doc)) {
+        return true;
+    }
+    // Check document size
+    const calculatedMinSize = calculateEmptyDocumentSize(state);
+    const effectiveMinSize = minContentSize === 4 ? calculatedMinSize : minContentSize;
+    if (doc.nodeSize <= effectiveMinSize) {
+        return true;
+    }
+    // Check if content is only whitespace
+    if (ignoreWhitespace) {
+        const textContent = doc.textContent.trim();
+        return textContent.length === 0;
+    }
+    return false;
+}
+/**
+ * Checks if document has meaningful content
+ */
+export function hasDocumentContent(state, config = {}) {
+    return !isDocumentEmpty(state, config);
+}
+/**
+ * Gets document content statistics
+ */
+export function getDocumentStats(state) {
+    const { doc } = state;
+    return {
+        nodeSize: doc.nodeSize,
+        textLength: doc.textContent.length,
+        trimmedTextLength: doc.textContent.trim().length,
+        nodeCount: doc.nodesBetween(0, doc.nodeSize, () => true),
+        isEmpty: isDocumentEmpty(state),
+        emptyDocumentSize: calculateEmptyDocumentSize(state),
+    };
+}
+/**
+ * Document state change detector
+ */
+export class DocumentStateTracker {
+    constructor() {
+        this.previousState = null;
+    }
+    /**
+     * Updates tracker with new state and returns changes
+     */
+    update(state) {
+        const isEmpty = isDocumentEmpty(state);
+        const { nodeSize } = state.doc;
+        const textLength = state.doc.textContent.length;
+        const result = {
+            isEmpty,
+            wasEmpty: this.previousState?.isEmpty ?? true,
+            becameEmpty: false,
+            becameNonEmpty: false,
+            sizeChanged: false,
+            textLengthChanged: false,
+        };
+        if (this.previousState) {
+            result.becameEmpty = !this.previousState.isEmpty && isEmpty;
+            result.becameNonEmpty = this.previousState.isEmpty && !isEmpty;
+            result.sizeChanged = this.previousState.nodeSize !== nodeSize;
+            result.textLengthChanged = this.previousState.textLength !== textLength;
+        }
+        this.previousState = { isEmpty, nodeSize, textLength };
+        return result;
+    }
+    /**
+     * Resets the tracker
+     */
+    reset() {
+        this.previousState = null;
+    }
+}