@kopexa/tiptap 17.6.17 → 17.7.0

package/dist/ui/link-popover/use-link-popover.d.ts

@@ -1,123 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as _kopexa_icons from '@kopexa/icons';
-import { Editor } from '@tiptap/react';
-import * as React from 'react';
-
-/**
- * Configuration for the link popover functionality
- */
-interface UseLinkPopoverConfig {
-    /**
-     * The Tiptap editor instance.
-     */
-    editor?: Editor | null;
-    /**
-     * Whether to hide the link popover when not available.
-     * @default false
-     */
-    hideWhenUnavailable?: boolean;
-    /**
-     * Callback function called when the link is set.
-     */
-    onSetLink?: () => void;
-}
-/**
- * Configuration for the link handler functionality
- */
-interface LinkHandlerProps {
-    /**
-     * The Tiptap editor instance.
-     */
-    editor: Editor | null;
-    /**
-     * Callback function called when the link is set.
-     */
-    onSetLink?: () => void;
-}
-/**
- * Checks if a link can be set in the current editor state
- */
-declare function canSetLink(editor: Editor | null): boolean;
-/**
- * Checks if a link is currently active in the editor
- */
-declare function isLinkActive(editor: Editor | null): boolean;
-/**
- * Determines if the link button should be shown
- */
-declare function shouldShowLinkButton(props: {
-    editor: Editor | null;
-    hideWhenUnavailable: boolean;
-}): boolean;
-/**
- * Custom hook for handling link operations in a Tiptap editor
- */
-declare function useLinkHandler(props: LinkHandlerProps): {
-    url: string;
-    setUrl: React.Dispatch<React.SetStateAction<string | null>>;
-    setLink: () => void;
-    removeLink: () => void;
-    openLink: (target?: string, features?: string) => void;
-};
-/**
- * Custom hook for link popover state management
- */
-declare function useLinkState(props: {
-    editor: Editor | null;
-    hideWhenUnavailable: boolean;
-}): {
-    isVisible: boolean;
-    canSet: boolean;
-    isActive: boolean;
-};
-/**
- * Main hook that provides link popover functionality for Tiptap editor
- *
- * @example
- * ```tsx
- * // Simple usage
- * function MyLinkButton() {
- *   const { isVisible, canSet, isActive, Icon, label } = useLinkPopover()
- *
- *   if (!isVisible) return null
- *
- *   return <button disabled={!canSet}>Link</button>
- * }
- *
- * // Advanced usage with configuration
- * function MyAdvancedLinkButton() {
- *   const { isVisible, canSet, isActive, Icon, label } = useLinkPopover({
- *     editor: myEditor,
- *     hideWhenUnavailable: true,
- *     onSetLink: () => console.log('Link set!')
- *   })
- *
- *   if (!isVisible) return null
- *
- *   return (
- *     <MyButton
- *       disabled={!canSet}
- *       aria-label={label}
- *       aria-pressed={isActive}
- *     >
- *       <Icon />
- *       {label}
- *     </MyButton>
- *   )
- * }
- * ```
- */
-declare function useLinkPopover(config?: UseLinkPopoverConfig): {
-    url: string;
-    setUrl: React.Dispatch<React.SetStateAction<string | null>>;
-    setLink: () => void;
-    removeLink: () => void;
-    openLink: (target?: string, features?: string) => void;
-    isVisible: boolean;
-    canSet: boolean;
-    isActive: boolean;
-    label: string;
-    Icon: ({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element;
-};
-
-export { type LinkHandlerProps, type UseLinkPopoverConfig, canSetLink, isLinkActive, shouldShowLinkButton, useLinkHandler, useLinkPopover, useLinkState };

package/dist/ui/link-popover/use-link-popover.js

@@ -1,259 +0,0 @@
-"use client";
-"use strict";
-"use client";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/ui/link-popover/use-link-popover.ts
-var use_link_popover_exports = {};
-__export(use_link_popover_exports, {
-  canSetLink: () => canSetLink,
-  isLinkActive: () => isLinkActive,
-  shouldShowLinkButton: () => shouldShowLinkButton,
-  useLinkHandler: () => useLinkHandler,
-  useLinkPopover: () => useLinkPopover,
-  useLinkState: () => useLinkState
-});
-module.exports = __toCommonJS(use_link_popover_exports);
-var import_editor_utils = require("@kopexa/editor-utils");
-var import_icons = require("@kopexa/icons");
-var React = __toESM(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/utils/index.ts
-var MAX_FILE_SIZE = 5 * 1024 * 1024;
-var ATTR_WHITESPACE = (
-  // eslint-disable-next-line no-control-regex
-  // biome-ignore lint/suspicious/noControlCharactersInRegex: we can do this yay
-  /[\u0000-\u0020\u00A0\u1680\u180E\u2000-\u2029\u205F\u3000]/g
-);
-function isAllowedUri(uri, protocols) {
-  const allowedProtocols = [
-    "http",
-    "https",
-    "ftp",
-    "ftps",
-    "mailto",
-    "tel",
-    "callto",
-    "sms",
-    "cid",
-    "xmpp"
-  ];
-  if (protocols) {
-    for (const protocol of protocols) {
-      const nextProtocol = typeof protocol === "string" ? protocol : protocol.scheme;
-      if (nextProtocol) {
-        allowedProtocols.push(nextProtocol);
-      }
-    }
-  }
-  return !uri || uri.replace(ATTR_WHITESPACE, "").match(
-    new RegExp(
-      // eslint-disable-next-line no-useless-escape
-      `^(?:(?:${allowedProtocols.join("|")}):|[^a-z]|[a-z0-9+.-]+(?:[^a-z+.-:]|$))`,
-      "i"
-    )
-  );
-}
-function sanitizeUrl(inputUrl, baseUrl, protocols) {
-  try {
-    const url = new URL(inputUrl, baseUrl);
-    if (isAllowedUri(url.href, protocols)) {
-      return url.href;
-    }
-  } catch {
-  }
-  return "#";
-}
-
-// src/ui/link-popover/use-link-popover.ts
-function canSetLink(editor) {
-  if (!editor || !editor.isEditable) return false;
-  return editor.can().setMark("link");
-}
-function isLinkActive(editor) {
-  if (!editor || !editor.isEditable) return false;
-  return editor.isActive("link");
-}
-function shouldShowLinkButton(props) {
-  const { editor, hideWhenUnavailable } = props;
-  const linkInSchema = (0, import_editor_utils.isMarkInSchema)("link", editor);
-  if (!linkInSchema || !editor) {
-    return false;
-  }
-  if (hideWhenUnavailable && !editor.isActive("code")) {
-    return canSetLink(editor);
-  }
-  return true;
-}
-function useLinkHandler(props) {
-  const { editor, onSetLink } = props;
-  const [url, setUrl] = React.useState(null);
-  React.useEffect(() => {
-    if (!editor) return;
-    const { href } = editor.getAttributes("link");
-    if (isLinkActive(editor) && url === null) {
-      setUrl(href || "");
-    }
-  }, [editor, url]);
-  React.useEffect(() => {
-    if (!editor) return;
-    const updateLinkState = () => {
-      const { href } = editor.getAttributes("link");
-      setUrl(href || "");
-    };
-    editor.on("selectionUpdate", updateLinkState);
-    return () => {
-      editor.off("selectionUpdate", updateLinkState);
-    };
-  }, [editor]);
-  const setLink = React.useCallback(() => {
-    if (!url || !editor) return;
-    const { selection } = editor.state;
-    const isEmpty = selection.empty;
-    let chain = editor.chain().focus();
-    chain = chain.extendMarkRange("link").setLink({ href: url });
-    if (isEmpty) {
-      chain = chain.insertContent({ type: "text", text: url });
-    }
-    chain.run();
-    setUrl(null);
-    onSetLink == null ? void 0 : onSetLink();
-  }, [editor, onSetLink, url]);
-  const removeLink = React.useCallback(() => {
-    if (!editor) return;
-    editor.chain().focus().extendMarkRange("link").unsetLink().setMeta("preventAutolink", true).run();
-    setUrl("");
-  }, [editor]);
-  const openLink = React.useCallback(
-    (target = "_blank", features = "noopener,noreferrer") => {
-      if (!url) return;
-      const safeUrl = sanitizeUrl(url, window.location.href);
-      if (safeUrl !== "#") {
-        window.open(safeUrl, target, features);
-      }
-    },
-    [url]
-  );
-  return {
-    url: url || "",
-    setUrl,
-    setLink,
-    removeLink,
-    openLink
-  };
-}
-function useLinkState(props) {
-  const { editor, hideWhenUnavailable = false } = props;
-  const canSet = canSetLink(editor);
-  const isActive = isLinkActive(editor);
-  const [isVisible, setIsVisible] = React.useState(false);
-  React.useEffect(() => {
-    if (!editor) return;
-    const handleSelectionUpdate = () => {
-      setIsVisible(
-        shouldShowLinkButton({
-          editor,
-          hideWhenUnavailable
-        })
-      );
-    };
-    handleSelectionUpdate();
-    editor.on("selectionUpdate", handleSelectionUpdate);
-    return () => {
-      editor.off("selectionUpdate", handleSelectionUpdate);
-    };
-  }, [editor, hideWhenUnavailable]);
-  return {
-    isVisible,
-    canSet,
-    isActive
-  };
-}
-function useLinkPopover(config) {
-  const {
-    editor: providedEditor,
-    hideWhenUnavailable = false,
-    onSetLink
-  } = config || {};
-  const { editor } = useTiptapEditor(providedEditor);
-  const { isVisible, canSet, isActive } = useLinkState({
-    editor,
-    hideWhenUnavailable
-  });
-  const linkHandler = useLinkHandler({
-    editor,
-    onSetLink
-  });
-  return {
-    isVisible,
-    canSet,
-    isActive,
-    label: "Link",
-    Icon: import_icons.LinkIcon,
-    ...linkHandler
-  };
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  canSetLink,
-  isLinkActive,
-  shouldShowLinkButton,
-  useLinkHandler,
-  useLinkPopover,
-  useLinkState
-});

package/dist/ui/link-popover/use-link-popover.mjs

@@ -1,20 +0,0 @@
-"use client";
-"use client";
-import {
-  canSetLink,
-  isLinkActive,
-  shouldShowLinkButton,
-  useLinkHandler,
-  useLinkPopover,
-  useLinkState
-} from "../../chunk-VTKJPVNM.mjs";
-import "../../chunk-P55PLOHR.mjs";
-import "../../chunk-TZQQ6C2Q.mjs";
-export {
-  canSetLink,
-  isLinkActive,
-  shouldShowLinkButton,
-  useLinkHandler,
-  useLinkPopover,
-  useLinkState
-};

package/dist/ui/list-button/index.d.mts

@@ -1,50 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ButtonProps } from '@kopexa/button';
-import { Editor } from '@tiptap/react';
-
-type ListType = "bulletList" | "orderedList" | "taskList";
-interface ListOption {
-    label: string;
-    type: ListType;
-    icon: React.ElementType;
-}
-interface ListButtonProps extends Omit<ButtonProps, "type"> {
-    /**
-     * The TipTap editor instance.
-     */
-    editor?: Editor | null;
-    /**
-     * The type of list to toggle.
-     */
-    type: ListType;
-    /**
-     * Optional text to display alongside the icon.
-     */
-    text?: string;
-    /**
-     * Whether the button should hide when the list is not available.
-     * @default false
-     */
-    hideWhenUnavailable?: boolean;
-}
-declare const listOptions: ListOption[];
-declare const listShortcutKeys: Record<ListType, string>;
-declare function canToggleList(editor: Editor | null, type: ListType): boolean;
-declare function isListActive(editor: Editor | null, type: ListType): boolean;
-declare function toggleList(editor: Editor | null, type: ListType): void;
-declare function getListOption(type: ListType): ListOption | undefined;
-declare function shouldShowListButton(params: {
-    editor: Editor | null;
-    type: ListType;
-    hideWhenUnavailable: boolean;
-    listInSchema: boolean;
-}): boolean;
-declare function useListState(editor: Editor | null, type: ListType): {
-    listInSchema: boolean;
-    listOption: ListOption | undefined;
-    isActive: boolean;
-    shortcutKey: string;
-};
-declare const ListButton: ({ editor: providedEditor, type, hideWhenUnavailable, className, onClick, text, children, ref, ...buttonProps }: ListButtonProps) => react_jsx_runtime.JSX.Element | null;
-
-export { ListButton, type ListButtonProps, type ListOption, type ListType, canToggleList, getListOption, isListActive, listOptions, listShortcutKeys, shouldShowListButton, toggleList, useListState };

package/dist/ui/list-button/index.d.ts

@@ -1,50 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ButtonProps } from '@kopexa/button';
-import { Editor } from '@tiptap/react';
-
-type ListType = "bulletList" | "orderedList" | "taskList";
-interface ListOption {
-    label: string;
-    type: ListType;
-    icon: React.ElementType;
-}
-interface ListButtonProps extends Omit<ButtonProps, "type"> {
-    /**
-     * The TipTap editor instance.
-     */
-    editor?: Editor | null;
-    /**
-     * The type of list to toggle.
-     */
-    type: ListType;
-    /**
-     * Optional text to display alongside the icon.
-     */
-    text?: string;
-    /**
-     * Whether the button should hide when the list is not available.
-     * @default false
-     */
-    hideWhenUnavailable?: boolean;
-}
-declare const listOptions: ListOption[];
-declare const listShortcutKeys: Record<ListType, string>;
-declare function canToggleList(editor: Editor | null, type: ListType): boolean;
-declare function isListActive(editor: Editor | null, type: ListType): boolean;
-declare function toggleList(editor: Editor | null, type: ListType): void;
-declare function getListOption(type: ListType): ListOption | undefined;
-declare function shouldShowListButton(params: {
-    editor: Editor | null;
-    type: ListType;
-    hideWhenUnavailable: boolean;
-    listInSchema: boolean;
-}): boolean;
-declare function useListState(editor: Editor | null, type: ListType): {
-    listInSchema: boolean;
-    listOption: ListOption | undefined;
-    isActive: boolean;
-    shortcutKey: string;
-};
-declare const ListButton: ({ editor: providedEditor, type, hideWhenUnavailable, className, onClick, text, children, ref, ...buttonProps }: ListButtonProps) => react_jsx_runtime.JSX.Element | null;
-
-export { ListButton, type ListButtonProps, type ListOption, type ListType, canToggleList, getListOption, isListActive, listOptions, listShortcutKeys, shouldShowListButton, toggleList, useListState };