@kopexa/tiptap 17.6.18 → 17.7.2

package/dist/ui/text-align-button/index.js

@@ -1,235 +0,0 @@
-"use client";
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/ui/text-align-button/index.tsx
-var text_align_button_exports = {};
-__export(text_align_button_exports, {
-  TEXT_ALIGN_SHORTCUT_KEYS: () => TEXT_ALIGN_SHORTCUT_KEYS,
-  TextAlignButton: () => TextAlignButton,
-  canSetTextAlign: () => canSetTextAlign,
-  hasSetTextAlign: () => hasSetTextAlign,
-  isTextAlignActive: () => isTextAlignActive,
-  setTextAlign: () => setTextAlign,
-  shouldShowButton: () => shouldShowButton,
-  textAlignIcons: () => textAlignIcons,
-  textAlignLabels: () => textAlignLabels,
-  useTextAlign: () => useTextAlign
-});
-module.exports = __toCommonJS(text_align_button_exports);
-
-// src/ui/text-align-button/text-align-button.tsx
-var import_button = require("@kopexa/button");
-var import_react4 = require("react");
-
-// src/hooks/use-tiptap-editor.ts
-var import_react = require("@tiptap/react");
-var import_react2 = require("react");
-function useTiptapEditor(providedEditor) {
-  const { editor: coreEditor } = (0, import_react.useCurrentEditor)();
-  const mainEditor = (0, import_react2.useMemo)(
-    () => providedEditor || coreEditor,
-    [providedEditor, coreEditor]
-  );
-  const editorState = (0, import_react.useEditorState)({
-    editor: mainEditor,
-    selector(context) {
-      if (!context.editor) {
-        return {
-          editor: null,
-          editorState: void 0,
-          canCommand: void 0
-        };
-      }
-      return {
-        editor: context.editor,
-        editorState: context.editor.state,
-        canCommand: context.editor.can
-      };
-    }
-  });
-  return editorState || { editor: null };
-}
-
-// src/ui/text-align-button/use-text-align.ts
-var import_editor_utils = require("@kopexa/editor-utils");
-var import_icons = require("@kopexa/icons");
-var import_react3 = require("react");
-var TEXT_ALIGN_SHORTCUT_KEYS = {
-  left: "mod+shift+l",
-  center: "mod+shift+e",
-  right: "mod+shift+r",
-  justify: "mod+shift+j"
-};
-var textAlignIcons = {
-  left: import_icons.AlignLeftIcon,
-  center: import_icons.AlignCenterIcon,
-  right: import_icons.AlignRightIcon,
-  justify: import_icons.AlignJustifyIcon
-};
-var textAlignLabels = {
-  left: "Align left",
-  center: "Align center",
-  right: "Align right",
-  justify: "Align justify"
-};
-function canSetTextAlign(editor, align) {
-  if (!editor || !editor.isEditable) return false;
-  if (!(0, import_editor_utils.isExtensionAvailable)(editor, "textAlign") || (0, import_editor_utils.isNodeTypeSelected)(editor, ["image"]))
-    return false;
-  return editor.can().setTextAlign(align);
-}
-function hasSetTextAlign(commands) {
-  return "setTextAlign" in commands;
-}
-function isTextAlignActive(editor, align) {
-  if (!editor || !editor.isEditable) return false;
-  return editor.isActive({ textAlign: align });
-}
-function setTextAlign(editor, align) {
-  if (!editor || !editor.isEditable) return false;
-  if (!canSetTextAlign(editor, align)) return false;
-  const chain = editor.chain().focus();
-  if (hasSetTextAlign(chain)) {
-    return chain.setTextAlign(align).run();
-  }
-  return false;
-}
-function shouldShowButton(props) {
-  const { editor, hideWhenUnavailable, align } = props;
-  if (!editor || !editor.isEditable) return false;
-  if (!(0, import_editor_utils.isExtensionAvailable)(editor, "textAlign")) return false;
-  if (hideWhenUnavailable && !editor.isActive("code")) {
-    return canSetTextAlign(editor, align);
-  }
-  return true;
-}
-function useTextAlign(config) {
-  const {
-    editor: providedEditor,
-    align,
-    hideWhenUnavailable = false,
-    onAligned
-  } = config;
-  const { editor } = useTiptapEditor(providedEditor);
-  const [isVisible, setIsVisible] = (0, import_react3.useState)(true);
-  const canAlign = canSetTextAlign(editor, align);
-  const isActive = isTextAlignActive(editor, align);
-  (0, import_react3.useEffect)(() => {
-    if (!editor) return;
-    const handleSelectionUpdate = () => {
-      setIsVisible(shouldShowButton({ editor, align, hideWhenUnavailable }));
-    };
-    handleSelectionUpdate();
-    editor.on("selectionUpdate", handleSelectionUpdate);
-    return () => {
-      editor.off("selectionUpdate", handleSelectionUpdate);
-    };
-  }, [editor, hideWhenUnavailable, align]);
-  const handleTextAlign = (0, import_react3.useCallback)(() => {
-    if (!editor) return false;
-    const success = setTextAlign(editor, align);
-    if (success) {
-      onAligned == null ? void 0 : onAligned();
-    }
-    return success;
-  }, [editor, align, onAligned]);
-  return {
-    isVisible,
-    isActive,
-    handleTextAlign,
-    canAlign,
-    label: textAlignLabels[align],
-    shortcutKeys: TEXT_ALIGN_SHORTCUT_KEYS[align],
-    Icon: textAlignIcons[align]
-  };
-}
-
-// src/ui/text-align-button/text-align-button.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
-var TextAlignButton = ({
-  editor: providedEditor,
-  align,
-  text,
-  hideWhenUnavailable = false,
-  onAligned,
-  showShortcut = false,
-  onClick,
-  children,
-  ...buttonProps
-}) => {
-  const { editor } = useTiptapEditor(providedEditor);
-  const {
-    isVisible,
-    handleTextAlign,
-    label,
-    canAlign,
-    isActive,
-    Icon,
-    shortcutKeys
-  } = useTextAlign({
-    editor,
-    align,
-    hideWhenUnavailable,
-    onAligned
-  });
-  const handleClick = (0, import_react4.useCallback)(
-    (e) => {
-      onClick == null ? void 0 : onClick(e);
-      if (e.defaultPrevented) return;
-      handleTextAlign();
-    },
-    [handleTextAlign, onClick]
-  );
-  if (!isVisible) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_button.IconButton,
-    {
-      type: "button",
-      disabled: canAlign,
-      variant: "ghost",
-      color: "default",
-      "data-active-state": isActive ? "on" : "off",
-      "data-disabled": canAlign,
-      tabIndex: -1,
-      "aria-label": label,
-      "aria-pressed": isActive,
-      tooltip: label,
-      shortcutKeys,
-      onClick: handleClick,
-      ...buttonProps,
-      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {})
-    }
-  );
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  TEXT_ALIGN_SHORTCUT_KEYS,
-  TextAlignButton,
-  canSetTextAlign,
-  hasSetTextAlign,
-  isTextAlignActive,
-  setTextAlign,
-  shouldShowButton,
-  textAlignIcons,
-  textAlignLabels,
-  useTextAlign
-});

package/dist/ui/text-align-button/index.mjs

@@ -1,29 +0,0 @@
-"use client";
-import "../../chunk-4ALV4UA5.mjs";
-import {
-  TextAlignButton
-} from "../../chunk-GYIYX2JH.mjs";
-import {
-  TEXT_ALIGN_SHORTCUT_KEYS,
-  canSetTextAlign,
-  hasSetTextAlign,
-  isTextAlignActive,
-  setTextAlign,
-  shouldShowButton,
-  textAlignIcons,
-  textAlignLabels,
-  useTextAlign
-} from "../../chunk-IQERE7KP.mjs";
-import "../../chunk-P55PLOHR.mjs";
-export {
-  TEXT_ALIGN_SHORTCUT_KEYS,
-  TextAlignButton,
-  canSetTextAlign,
-  hasSetTextAlign,
-  isTextAlignActive,
-  setTextAlign,
-  shouldShowButton,
-  textAlignIcons,
-  textAlignLabels,
-  useTextAlign
-};

package/dist/ui/text-align-button/text-align-button.d.mts

@@ -1,20 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ButtonProps } from '@kopexa/button';
-import { UseTextAlignConfig } from './use-text-align.mjs';
-import '@kopexa/icons';
-import '@tiptap/react';
-
-interface TextAlignButtonProps extends Omit<ButtonProps, "type">, UseTextAlignConfig {
-    /**
-     * Optional text to display alongside the icon.
-     */
-    text?: string;
-    /**
-     * Optional show shortcut keys in the button.
-     * @default false
-     */
-    showShortcut?: boolean;
-}
-declare const TextAlignButton: ({ editor: providedEditor, align, text, hideWhenUnavailable, onAligned, showShortcut, onClick, children, ...buttonProps }: TextAlignButtonProps) => react_jsx_runtime.JSX.Element | null;
-
-export { TextAlignButton, type TextAlignButtonProps };

package/dist/ui/text-align-button/text-align-button.d.ts

@@ -1,20 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ButtonProps } from '@kopexa/button';
-import { UseTextAlignConfig } from './use-text-align.js';
-import '@kopexa/icons';
-import '@tiptap/react';
-
-interface TextAlignButtonProps extends Omit<ButtonProps, "type">, UseTextAlignConfig {
-    /**
-     * Optional text to display alongside the icon.
-     */
-    text?: string;
-    /**
-     * Optional show shortcut keys in the button.
-     * @default false
-     */
-    showShortcut?: boolean;
-}
-declare const TextAlignButton: ({ editor: providedEditor, align, text, hideWhenUnavailable, onAligned, showShortcut, onClick, children, ...buttonProps }: TextAlignButtonProps) => react_jsx_runtime.JSX.Element | null;
-
-export { TextAlignButton, type TextAlignButtonProps };

package/dist/ui/text-align-button/text-align-button.js

@@ -1,215 +0,0 @@
-"use client";
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/ui/text-align-button/text-align-button.tsx
-var text_align_button_exports = {};
-__export(text_align_button_exports, {
-  TextAlignButton: () => TextAlignButton
-});
-module.exports = __toCommonJS(text_align_button_exports);
-var import_button = require("@kopexa/button");
-var import_react4 = require("react");
-
-// src/hooks/use-tiptap-editor.ts
-var import_react = require("@tiptap/react");
-var import_react2 = require("react");
-function useTiptapEditor(providedEditor) {
-  const { editor: coreEditor } = (0, import_react.useCurrentEditor)();
-  const mainEditor = (0, import_react2.useMemo)(
-    () => providedEditor || coreEditor,
-    [providedEditor, coreEditor]
-  );
-  const editorState = (0, import_react.useEditorState)({
-    editor: mainEditor,
-    selector(context) {
-      if (!context.editor) {
-        return {
-          editor: null,
-          editorState: void 0,
-          canCommand: void 0
-        };
-      }
-      return {
-        editor: context.editor,
-        editorState: context.editor.state,
-        canCommand: context.editor.can
-      };
-    }
-  });
-  return editorState || { editor: null };
-}
-
-// src/ui/text-align-button/use-text-align.ts
-var import_editor_utils = require("@kopexa/editor-utils");
-var import_icons = require("@kopexa/icons");
-var import_react3 = require("react");
-var TEXT_ALIGN_SHORTCUT_KEYS = {
-  left: "mod+shift+l",
-  center: "mod+shift+e",
-  right: "mod+shift+r",
-  justify: "mod+shift+j"
-};
-var textAlignIcons = {
-  left: import_icons.AlignLeftIcon,
-  center: import_icons.AlignCenterIcon,
-  right: import_icons.AlignRightIcon,
-  justify: import_icons.AlignJustifyIcon
-};
-var textAlignLabels = {
-  left: "Align left",
-  center: "Align center",
-  right: "Align right",
-  justify: "Align justify"
-};
-function canSetTextAlign(editor, align) {
-  if (!editor || !editor.isEditable) return false;
-  if (!(0, import_editor_utils.isExtensionAvailable)(editor, "textAlign") || (0, import_editor_utils.isNodeTypeSelected)(editor, ["image"]))
-    return false;
-  return editor.can().setTextAlign(align);
-}
-function hasSetTextAlign(commands) {
-  return "setTextAlign" in commands;
-}
-function isTextAlignActive(editor, align) {
-  if (!editor || !editor.isEditable) return false;
-  return editor.isActive({ textAlign: align });
-}
-function setTextAlign(editor, align) {
-  if (!editor || !editor.isEditable) return false;
-  if (!canSetTextAlign(editor, align)) return false;
-  const chain = editor.chain().focus();
-  if (hasSetTextAlign(chain)) {
-    return chain.setTextAlign(align).run();
-  }
-  return false;
-}
-function shouldShowButton(props) {
-  const { editor, hideWhenUnavailable, align } = props;
-  if (!editor || !editor.isEditable) return false;
-  if (!(0, import_editor_utils.isExtensionAvailable)(editor, "textAlign")) return false;
-  if (hideWhenUnavailable && !editor.isActive("code")) {
-    return canSetTextAlign(editor, align);
-  }
-  return true;
-}
-function useTextAlign(config) {
-  const {
-    editor: providedEditor,
-    align,
-    hideWhenUnavailable = false,
-    onAligned
-  } = config;
-  const { editor } = useTiptapEditor(providedEditor);
-  const [isVisible, setIsVisible] = (0, import_react3.useState)(true);
-  const canAlign = canSetTextAlign(editor, align);
-  const isActive = isTextAlignActive(editor, align);
-  (0, import_react3.useEffect)(() => {
-    if (!editor) return;
-    const handleSelectionUpdate = () => {
-      setIsVisible(shouldShowButton({ editor, align, hideWhenUnavailable }));
-    };
-    handleSelectionUpdate();
-    editor.on("selectionUpdate", handleSelectionUpdate);
-    return () => {
-      editor.off("selectionUpdate", handleSelectionUpdate);
-    };
-  }, [editor, hideWhenUnavailable, align]);
-  const handleTextAlign = (0, import_react3.useCallback)(() => {
-    if (!editor) return false;
-    const success = setTextAlign(editor, align);
-    if (success) {
-      onAligned == null ? void 0 : onAligned();
-    }
-    return success;
-  }, [editor, align, onAligned]);
-  return {
-    isVisible,
-    isActive,
-    handleTextAlign,
-    canAlign,
-    label: textAlignLabels[align],
-    shortcutKeys: TEXT_ALIGN_SHORTCUT_KEYS[align],
-    Icon: textAlignIcons[align]
-  };
-}
-
-// src/ui/text-align-button/text-align-button.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
-var TextAlignButton = ({
-  editor: providedEditor,
-  align,
-  text,
-  hideWhenUnavailable = false,
-  onAligned,
-  showShortcut = false,
-  onClick,
-  children,
-  ...buttonProps
-}) => {
-  const { editor } = useTiptapEditor(providedEditor);
-  const {
-    isVisible,
-    handleTextAlign,
-    label,
-    canAlign,
-    isActive,
-    Icon,
-    shortcutKeys
-  } = useTextAlign({
-    editor,
-    align,
-    hideWhenUnavailable,
-    onAligned
-  });
-  const handleClick = (0, import_react4.useCallback)(
-    (e) => {
-      onClick == null ? void 0 : onClick(e);
-      if (e.defaultPrevented) return;
-      handleTextAlign();
-    },
-    [handleTextAlign, onClick]
-  );
-  if (!isVisible) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_button.IconButton,
-    {
-      type: "button",
-      disabled: canAlign,
-      variant: "ghost",
-      color: "default",
-      "data-active-state": isActive ? "on" : "off",
-      "data-disabled": canAlign,
-      tabIndex: -1,
-      "aria-label": label,
-      "aria-pressed": isActive,
-      tooltip: label,
-      shortcutKeys,
-      onClick: handleClick,
-      ...buttonProps,
-      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {})
-    }
-  );
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  TextAlignButton
-});

package/dist/ui/text-align-button/text-align-button.mjs

@@ -1,9 +0,0 @@
-"use client";
-import {
-  TextAlignButton
-} from "../../chunk-GYIYX2JH.mjs";
-import "../../chunk-IQERE7KP.mjs";
-import "../../chunk-P55PLOHR.mjs";
-export {
-  TextAlignButton
-};

package/dist/ui/text-align-button/use-text-align.d.mts

@@ -1,106 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as _kopexa_icons from '@kopexa/icons';
-import { Editor, ChainedCommands } from '@tiptap/react';
-
-type TextAlign = "left" | "center" | "right" | "justify";
-/**
- * Configuration for the text align functionality
- */
-interface UseTextAlignConfig {
-    /**
-     * The Tiptap editor instance.
-     */
-    editor?: Editor | null;
-    /**
-     * The text alignment to apply.
-     */
-    align: TextAlign;
-    /**
-     * Whether the button should hide when alignment is not available.
-     * @default false
-     */
-    hideWhenUnavailable?: boolean;
-    /**
-     * Callback function called after a successful alignment change.
-     */
-    onAligned?: () => void;
-}
-declare const TEXT_ALIGN_SHORTCUT_KEYS: Record<TextAlign, string>;
-declare const textAlignIcons: {
-    left: ({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element;
-    center: ({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element;
-    right: ({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element;
-    justify: ({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element;
-};
-declare const textAlignLabels: Record<TextAlign, string>;
-/**
- * Checks if text alignment can be performed in the current editor state
- */
-declare function canSetTextAlign(editor: Editor | null, align: TextAlign): boolean;
-declare function hasSetTextAlign(commands: ChainedCommands): commands is ChainedCommands & {
-    setTextAlign: (align: TextAlign) => ChainedCommands;
-};
-/**
- * Checks if the text alignment is currently active
- */
-declare function isTextAlignActive(editor: Editor | null, align: TextAlign): boolean;
-/**
- * Sets text alignment in the editor
- */
-declare function setTextAlign(editor: Editor | null, align: TextAlign): boolean;
-/**
- * Determines if the text align button should be shown
- */
-declare function shouldShowButton(props: {
-    editor: Editor | null;
-    hideWhenUnavailable: boolean;
-    align: TextAlign;
-}): boolean;
-/**
- * Custom hook that provides text align functionality for Tiptap editor
- *
- * @example
- * ```tsx
- * // Simple usage
- * function MySimpleAlignButton() {
- *   const { isVisible, handleTextAlign } = useTextAlign({ align: "center" })
- *
- *   if (!isVisible) return null
- *
- *   return <button onClick={handleTextAlign}>Align Center</button>
- * }
- *
- * // Advanced usage with configuration
- * function MyAdvancedAlignButton() {
- *   const { isVisible, handleTextAlign, label, isActive } = useTextAlign({
- *     editor: myEditor,
- *     align: "right",
- *     hideWhenUnavailable: true,
- *     onAligned: () => console.log('Text aligned!')
- *   })
- *
- *   if (!isVisible) return null
- *
- *   return (
- *     <MyButton
- *       onClick={handleTextAlign}
- *       aria-pressed={isActive}
- *       aria-label={label}
- *     >
- *       Align Right
- *     </MyButton>
- *   )
- * }
- * ```
- */
-declare function useTextAlign(config: UseTextAlignConfig): {
-    isVisible: boolean;
-    isActive: boolean;
-    handleTextAlign: () => boolean;
-    canAlign: boolean;
-    label: string;
-    shortcutKeys: string;
-    Icon: (({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element) | (({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element) | (({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element) | (({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element);
-};
-
-export { TEXT_ALIGN_SHORTCUT_KEYS, type TextAlign, type UseTextAlignConfig, canSetTextAlign, hasSetTextAlign, isTextAlignActive, setTextAlign, shouldShowButton, textAlignIcons, textAlignLabels, useTextAlign };