From d56a72ec53e5ebac5a611b9c03904a331a2855cf Mon Sep 17 00:00:00 2001 From: Sam Rizvi Date: Fri, 26 Jan 2024 03:25:38 -0800 Subject: [PATCH] chore: update editor package #659 - moved most dependencies to editor package - left the minimal footprint in ai - ended up adding an alias for #editor for the local package usage - tweaked some tailwind configs - updated some import sorting rules - moved files around to keep tsx together and ts stuff together - moved styled back to ai given the tailwind config setup Closes #659 --- apps/ai/tsconfig.json | 42 ++----------------- packages/editor/package.json | 2 +- .../src/components/ai-image/ai-image-view.tsx | 16 +++---- .../components/ai-writer/ai-writer-view.tsx | 21 +++++----- .../image-block/image-block-menu.tsx | 8 ++-- .../image-upload/image-uploader.tsx | 8 ++-- .../src/components/menus/columns-menu.tsx | 12 +++--- .../components/menus/content-item-menu.tsx | 12 +++--- .../editor/src/components/menus/link-menu.tsx | 8 ++-- .../editor/src/components/menus/text-menu.tsx | 15 +++---- .../menus/text-menu/ai-dropdown.tsx | 10 ++--- .../menus/text-menu/content-type-picker.tsx | 11 +++-- .../menus/text-menu/edit-link-popover.tsx | 6 +-- .../menus/text-menu/font-family-picker.tsx | 11 +++-- .../menus/text-menu/font-size-picker.tsx | 8 ++-- .../src/components/panels/color-picker.tsx | 7 ++-- .../components/panels/link-editor-panel.tsx | 8 ++-- .../components/panels/link-preview-panel.tsx | 8 ++-- .../slash-command/command-button.tsx | 2 +- .../components/slash-command/menu-list.tsx | 8 ++-- .../components/table/table-column-menu.tsx | 12 +++--- .../src/components/table/table-row-menu.tsx | 12 +++--- .../blockquote-figure/blockquote-figure.ts | 3 +- packages/editor/src/extensions/embed-input.ts | 8 ++-- .../editor/src/extensions/emoji-suggestion.ts | 2 +- .../editor/src/extensions/extension-kit.ts | 10 ++--- packages/editor/src/extensions/image-block.ts | 3 +- .../editor/src/extensions/image-upload.ts | 2 +- .../src/extensions/slash-command/groups.ts | 2 +- .../extensions/slash-command/slash-command.ts | 3 +- .../table/menus/table-menu-utils.ts | 4 +- .../hooks.ts => image-upload-hooks.ts} | 2 +- .../use-content-item-actions.ts | 0 .../hooks/{content-item-menu => }/use-data.ts | 0 .../{text-menu => }/use-text-menu-commands.ts | 0 .../use-text-menu-content-types.ts | 3 +- .../{text-menu => }/use-text-menu-states.ts | 7 ++-- packages/editor/src/lib/constants.ts | 2 +- .../src/lib/utils/is-custom-node-selected.ts | 16 +++---- packages/editor/tsconfig.json | 4 ++ tooling/prettier/index.js | 2 + tooling/typescript/base.json | 6 ++- 42 files changed, 155 insertions(+), 171 deletions(-) rename packages/editor/src/hooks/{image-upload/hooks.ts => image-upload-hooks.ts} (98%) rename packages/editor/src/hooks/{content-item-menu => }/use-content-item-actions.ts (100%) rename packages/editor/src/hooks/{content-item-menu => }/use-data.ts (100%) rename packages/editor/src/hooks/{text-menu => }/use-text-menu-commands.ts (100%) rename packages/editor/src/hooks/{text-menu => }/use-text-menu-content-types.ts (97%) rename packages/editor/src/hooks/{text-menu => }/use-text-menu-states.ts (87%) diff --git a/apps/ai/tsconfig.json b/apps/ai/tsconfig.json index a7eda200..d5cb168a 100644 --- a/apps/ai/tsconfig.json +++ b/apps/ai/tsconfig.json @@ -4,6 +4,7 @@ "baseUrl": ".", "paths": { "#/*": ["./src/*"], + "#editor/*": ["../../packages/editor/src/*"], }, "plugins": [{ "name": "next" }], "tsBuildInfoFile": "node_modules/.cache/tsbuildinfo.json", @@ -11,44 +12,9 @@ "include": [ ".", ".next/types/**/*.ts", - "../../packages/editor/src/components/menus", - "../../packages/editor/src/components/panels", - "../../packages/editor/src/components/dropdown.tsx", - "../../packages/editor/src/components/editor-button.tsx", - "../../packages/editor/src/components/icon.tsx", - "../../packages/editor/src/components/loader.tsx", - "../../packages/editor/src/components/panel.tsx", - "../../packages/editor/src/components/popover-menu.tsx", - "../../packages/editor/src/components/spinner.tsx", - "../../packages/editor/src/components/surface.tsx", - "../../packages/editor/src/components/table-of-contents.tsx", - "../../packages/editor/src/components/textarea.tsx", - "../../packages/editor/src/components/toggle.tsx", - "../../packages/editor/src/components/toolbar.tsx", - "../../packages/editor/src/components/tooltip.tsx", - "../../packages/editor/src/extensions/emoji-suggestion", - "../../packages/editor/src/extensions/figcaption", - "../../packages/editor/src/extensions/figure", - "../../packages/editor/src/extensions/font-size", - "../../packages/editor/src/extensions/heading", - "../../packages/editor/src/extensions/horizontal-rule", - "../../packages/editor/src/extensions/image", - "../../packages/editor/src/extensions/image-block", - "../../packages/editor/src/extensions/image-upload", - "../../packages/editor/src/extensions/trailing-node", - "../../packages/editor/src/extensions/extension-kit.ts", - "../../packages/editor/src/extensions/blockquote-figure", - "../../packages/editor/src/extensions/document", - "../../packages/editor/src/extensions/ai-image", - "../../packages/editor/src/extensions/ai-writer", - "../../packages/editor/src/extensions/embed-input", - "../../packages/editor/src/extensions/link", - "../../packages/editor/src/extensions/multi-column", - "../../packages/editor/src/extensions/selection", - "../../packages/editor/src/extensions/slash-command", - "../../packages/editor/src/extensions/table", - "../../packages/editor/src/extensions/table-of-content-node", - "../../packages/editor/src/lib/data", + "../../packages/editor/src/**/*.{ts,tsx}", + "../../packages/email/src/**/*.{ts,tsx}", + "../../packages/utils/src/**/*.{ts,tsx}", ], "exclude": ["node_modules"], } diff --git a/packages/editor/package.json b/packages/editor/package.json index 238895c6..a0ee1c1f 100644 --- a/packages/editor/package.json +++ b/packages/editor/package.json @@ -119,4 +119,4 @@ "y-prosemirror": "^1.2.1", "yjs": "^13.6.10" } -} \ No newline at end of file +} diff --git a/packages/editor/src/components/ai-image/ai-image-view.tsx b/packages/editor/src/components/ai-image/ai-image-view.tsx index 7cfe8168..defabd66 100644 --- a/packages/editor/src/components/ai-image/ai-image-view.tsx +++ b/packages/editor/src/components/ai-image/ai-image-view.tsx @@ -7,14 +7,14 @@ import { NodeViewWrapper } from '@tiptap/react'; import toast from 'react-hot-toast'; import { v4 as uuid } from 'uuid'; -import { DropdownButton } from '../dropdown'; -import { Button } from '../editor-button'; -import { Icon } from '../icon'; -import { Loader } from '../loader'; -import { Panel, PanelHeadline } from '../panel'; -import { Surface } from '../surface'; -import { Textarea } from '../textarea'; -import { Toolbar } from '../toolbar'; +import { DropdownButton } from '#editor/components/dropdown'; +import { Button } from '#editor/components/editor-button'; +import { Icon } from '#editor/components/icon'; +import { Loader } from '#editor/components/loader'; +import { Panel, PanelHeadline } from '#editor/components/panel'; +import { Surface } from '#editor/components/surface'; +import { Textarea } from '#editor/components/textarea'; +import { Toolbar } from '#editor/components/toolbar'; const imageStyles = [ { name: 'photorealistic', label: 'Photorealistic', value: 'photorealistic' }, diff --git a/packages/editor/src/components/ai-writer/ai-writer-view.tsx b/packages/editor/src/components/ai-writer/ai-writer-view.tsx index 88578295..6941077f 100644 --- a/packages/editor/src/components/ai-writer/ai-writer-view.tsx +++ b/packages/editor/src/components/ai-writer/ai-writer-view.tsx @@ -1,5 +1,6 @@ import type { Tone } from '@tiptap-pro/extension-ai'; import type { Extension, NodeViewWrapperProps } from '@tiptap/react'; +import type { AiToneOption } from '#editor/types'; import { useCallback, useMemo, useState } from 'react'; import * as Dropdown from '@radix-ui/react-dropdown-menu'; @@ -7,17 +8,15 @@ import { NodeViewWrapper } from '@tiptap/react'; import toast from 'react-hot-toast'; import { v4 as uuid } from 'uuid'; -import type { AiToneOption } from '../../types'; - -import { tones } from '../../lib/constants'; -import { DropdownButton } from '../dropdown'; -import { Button } from '../editor-button'; -import { Icon } from '../icon'; -import { Loader } from '../loader'; -import { Panel, PanelHeadline } from '../panel'; -import { Surface } from '../surface'; -import { Textarea } from '../textarea'; -import { Toolbar } from '../toolbar'; +import { DropdownButton } from '#editor/components/dropdown'; +import { Button } from '#editor/components/editor-button'; +import { Icon } from '#editor/components/icon'; +import { Loader } from '#editor/components/loader'; +import { Panel, PanelHeadline } from '#editor/components/panel'; +import { Surface } from '#editor/components/surface'; +import { Textarea } from '#editor/components/textarea'; +import { Toolbar } from '#editor/components/toolbar'; +import { tones } from '#editor/lib/constants'; export interface DataProps { text: string; diff --git a/packages/editor/src/components/image-block/image-block-menu.tsx b/packages/editor/src/components/image-block/image-block-menu.tsx index 00148e80..3a0af63c 100644 --- a/packages/editor/src/components/image-block/image-block-menu.tsx +++ b/packages/editor/src/components/image-block/image-block-menu.tsx @@ -1,3 +1,4 @@ +import type { MenuProps } from '#editor/types'; import type { Instance } from 'tippy.js'; import React, { useCallback, useRef } from 'react'; @@ -5,11 +6,10 @@ import { BubbleMenu as BaseBubbleMenu } from '@tiptap/react'; import { sticky } from 'tippy.js'; import { v4 as uuid } from 'uuid'; -import type { MenuProps } from '../../types'; +import { Icon } from '#editor/components/icon'; +import { Toolbar } from '#editor/components/toolbar'; +import { getRenderContainer } from '#editor/lib/utils/get-render-container'; -import { Icon } from '../../components/icon'; -import { Toolbar } from '../../components/toolbar'; -import { getRenderContainer } from '../../lib/utils/get-render-container'; import { ImageBlockWidth } from './image-block-width'; export const ImageBlockMenu = ({ diff --git a/packages/editor/src/components/image-upload/image-uploader.tsx b/packages/editor/src/components/image-upload/image-uploader.tsx index 1f55a9ac..b3e3bbc8 100644 --- a/packages/editor/src/components/image-upload/image-uploader.tsx +++ b/packages/editor/src/components/image-upload/image-uploader.tsx @@ -4,14 +4,14 @@ import { useCallback } from 'react'; import { cn } from '@av/ui'; +import { Button } from '#editor/components/editor-button'; +import { Icon } from '#editor/components/icon'; +import { Spinner } from '#editor/components/spinner'; import { useDropZone, useFileUpload, useUploader, -} from '../../hooks/image-upload/hooks'; -import { Button } from '../editor-button'; -import { Icon } from '../icon'; -import { Spinner } from '../spinner'; +} from '#editor/hooks/image-upload-hooks'; export const ImageUploader = ({ onUpload, diff --git a/packages/editor/src/components/menus/columns-menu.tsx b/packages/editor/src/components/menus/columns-menu.tsx index 104d14b2..6bc107e6 100644 --- a/packages/editor/src/components/menus/columns-menu.tsx +++ b/packages/editor/src/components/menus/columns-menu.tsx @@ -1,14 +1,14 @@ +import type { MenuProps } from '#editor/types'; + import { useCallback } from 'react'; import { BubbleMenu as BaseBubbleMenu } from '@tiptap/react'; import { sticky } from 'tippy.js'; import { v4 as uuid } from 'uuid'; -import type { MenuProps } from '../../types'; - -import { ColumnLayout } from '../../extensions/multi-column/columns'; -import { getRenderContainer } from '../../lib/utils/get-render-container'; -import { Icon } from '../icon'; -import { Toolbar } from '../toolbar'; +import { Icon } from '#editor/components/icon'; +import { Toolbar } from '#editor/components/toolbar'; +import { ColumnLayout } from '#editor/extensions/multi-column/columns'; +import { getRenderContainer } from '#editor/lib/utils/get-render-container'; export const ColumnsMenu = ({ editor, appendTo }: MenuProps) => { const getReferenceClientRect = useCallback(() => { diff --git a/packages/editor/src/components/menus/content-item-menu.tsx b/packages/editor/src/components/menus/content-item-menu.tsx index ad2896e4..9a4e922c 100644 --- a/packages/editor/src/components/menus/content-item-menu.tsx +++ b/packages/editor/src/components/menus/content-item-menu.tsx @@ -4,12 +4,12 @@ import { useEffect, useState } from 'react'; import * as Popover from '@radix-ui/react-popover'; import DragHandle from '@tiptap-pro/extension-drag-handle-react'; -import useContentItemActions from '../../hooks/content-item-menu/use-content-item-actions'; -import { useData } from '../../hooks/content-item-menu/use-data'; -import { DropdownButton } from '../dropdown'; -import { Icon } from '../icon'; -import { Surface } from '../surface'; -import { Toolbar } from '../toolbar'; +import { DropdownButton } from '#editor/components/dropdown'; +import { Icon } from '#editor/components/icon'; +import { Surface } from '#editor/components/surface'; +import { Toolbar } from '#editor/components/toolbar'; +import useContentItemActions from '#editor/hooks/use-content-item-actions'; +import { useData } from '#editor/hooks/use-data'; export interface ContentItemMenuProps { editor: Editor; diff --git a/packages/editor/src/components/menus/link-menu.tsx b/packages/editor/src/components/menus/link-menu.tsx index c8dd93d4..d0643b1f 100644 --- a/packages/editor/src/components/menus/link-menu.tsx +++ b/packages/editor/src/components/menus/link-menu.tsx @@ -1,10 +1,10 @@ +import type { MenuProps } from '#editor/types'; + import React, { useCallback, useState } from 'react'; import { BubbleMenu as BaseBubbleMenu } from '@tiptap/react'; -import type { MenuProps } from '../../types'; - -import { LinkEditorPanel } from '../panels/link-editor-panel'; -import { LinkPreviewPanel } from '../panels/link-preview-panel'; +import { LinkEditorPanel } from '#editor/components/panels/link-editor-panel'; +import { LinkPreviewPanel } from '#editor/components/panels/link-preview-panel'; export const LinkMenu = ({ editor, appendTo }: MenuProps): JSX.Element => { const [showEdit, setShowEdit] = useState(false); diff --git a/packages/editor/src/components/menus/text-menu.tsx b/packages/editor/src/components/menus/text-menu.tsx index 117401ee..ec03a214 100644 --- a/packages/editor/src/components/menus/text-menu.tsx +++ b/packages/editor/src/components/menus/text-menu.tsx @@ -4,13 +4,14 @@ import { memo } from 'react'; import * as Popover from '@radix-ui/react-popover'; import { BubbleMenu } from '@tiptap/react'; -import { useTextmenuCommands } from '../../hooks/text-menu/use-text-menu-commands'; -import { useTextmenuContentTypes } from '../../hooks/text-menu/use-text-menu-content-types'; -import { useTextmenuStates } from '../../hooks/text-menu/use-text-menu-states'; -import { Icon } from '../icon'; -import { ColorPicker } from '../panels/color-picker'; -import { Surface } from '../surface'; -import { Toolbar } from '../toolbar'; +import { Icon } from '#editor/components/icon'; +import { ColorPicker } from '#editor/components/panels/color-picker'; +import { Surface } from '#editor/components/surface'; +import { Toolbar } from '#editor/components/toolbar'; +import { useTextmenuCommands } from '#editor/hooks/use-text-menu-commands'; +import { useTextmenuContentTypes } from '#editor/hooks/use-text-menu-content-types'; +import { useTextmenuStates } from '#editor/hooks/use-text-menu-states'; + import { AIDropdown } from './text-menu/ai-dropdown'; import { ContentTypePicker } from './text-menu/content-type-picker'; import { EditLinkPopover } from './text-menu/edit-link-popover'; diff --git a/packages/editor/src/components/menus/text-menu/ai-dropdown.tsx b/packages/editor/src/components/menus/text-menu/ai-dropdown.tsx index e537eea5..94811733 100644 --- a/packages/editor/src/components/menus/text-menu/ai-dropdown.tsx +++ b/packages/editor/src/components/menus/text-menu/ai-dropdown.tsx @@ -3,11 +3,11 @@ import type { Tone } from '@tiptap-pro/extension-ai'; import { useCallback } from 'react'; import * as Dropdown from '@radix-ui/react-dropdown-menu'; -import { languages, tones } from '../../../lib/constants'; -import { DropdownButton } from '../../dropdown'; -import { Icon } from '../../icon'; -import { Surface } from '../../surface'; -import { Toolbar } from '../../toolbar'; +import { DropdownButton } from '#editor/components/dropdown'; +import { Icon } from '#editor/components/icon'; +import { Surface } from '#editor/components/surface'; +import { Toolbar } from '#editor/components/toolbar'; +import { languages, tones } from '#editor/lib/constants'; export interface AIDropdownProps { onSimplify: () => void; diff --git a/packages/editor/src/components/menus/text-menu/content-type-picker.tsx b/packages/editor/src/components/menus/text-menu/content-type-picker.tsx index 6e4e20d9..3d3d5fcd 100644 --- a/packages/editor/src/components/menus/text-menu/content-type-picker.tsx +++ b/packages/editor/src/components/menus/text-menu/content-type-picker.tsx @@ -3,10 +3,13 @@ import type { icons } from 'lucide-react'; import { useMemo } from 'react'; import * as Dropdown from '@radix-ui/react-dropdown-menu'; -import { DropdownButton, DropdownCategoryTitle } from '../../dropdown'; -import { Icon } from '../../icon'; -import { Surface } from '../../surface'; -import { Toolbar } from '../../toolbar'; +import { + DropdownButton, + DropdownCategoryTitle, +} from '#editor/components/dropdown'; +import { Icon } from '#editor/components/icon'; +import { Surface } from '#editor/components/surface'; +import { Toolbar } from '#editor/components/toolbar'; export interface ContentTypePickerOption { label: string; diff --git a/packages/editor/src/components/menus/text-menu/edit-link-popover.tsx b/packages/editor/src/components/menus/text-menu/edit-link-popover.tsx index 8fe80d86..694d7b63 100644 --- a/packages/editor/src/components/menus/text-menu/edit-link-popover.tsx +++ b/packages/editor/src/components/menus/text-menu/edit-link-popover.tsx @@ -1,8 +1,8 @@ import * as Popover from '@radix-ui/react-popover'; -import { Icon } from '../../icon'; -import { LinkEditorPanel } from '../../panels/link-editor-panel'; -import { Toolbar } from '../../toolbar'; +import { Icon } from '#editor/components/icon'; +import { LinkEditorPanel } from '#editor/components/panels/link-editor-panel'; +import { Toolbar } from '#editor/components/toolbar'; export interface EditLinkPopoverProps { onSetLink: (link: string, openInNewTab?: boolean) => void; diff --git a/packages/editor/src/components/menus/text-menu/font-family-picker.tsx b/packages/editor/src/components/menus/text-menu/font-family-picker.tsx index 897be238..93dc826e 100644 --- a/packages/editor/src/components/menus/text-menu/font-family-picker.tsx +++ b/packages/editor/src/components/menus/text-menu/font-family-picker.tsx @@ -1,10 +1,13 @@ import { useCallback } from 'react'; import * as Dropdown from '@radix-ui/react-dropdown-menu'; -import { DropdownButton, DropdownCategoryTitle } from '../../dropdown'; -import { Icon } from '../../icon'; -import { Surface } from '../../surface'; -import { Toolbar } from '../../toolbar'; +import { + DropdownButton, + DropdownCategoryTitle, +} from '#editor/components/dropdown'; +import { Icon } from '#editor/components/icon'; +import { Surface } from '#editor/components/surface'; +import { Toolbar } from '#editor/components/toolbar'; const FONT_FAMILY_GROUPS = [ { diff --git a/packages/editor/src/components/menus/text-menu/font-size-picker.tsx b/packages/editor/src/components/menus/text-menu/font-size-picker.tsx index 02e29f40..0aee8f5f 100644 --- a/packages/editor/src/components/menus/text-menu/font-size-picker.tsx +++ b/packages/editor/src/components/menus/text-menu/font-size-picker.tsx @@ -4,10 +4,10 @@ import * as Dropdown from '@radix-ui/react-dropdown-menu'; import { DropdownButton, // DropdownCategoryTitle, -} from '../../dropdown'; -import { Icon } from '../../icon'; -import { Surface } from '../../surface'; -import { Toolbar } from '../../toolbar'; +} from '#editor/components/dropdown'; +import { Icon } from '#editor/components/icon'; +import { Surface } from '#editor/components/surface'; +import { Toolbar } from '#editor/components/toolbar'; const FONT_SIZES = [ { label: 'Smaller', value: '12px' }, diff --git a/packages/editor/src/components/panels/color-picker.tsx b/packages/editor/src/components/panels/color-picker.tsx index 981803c9..5100b5ef 100644 --- a/packages/editor/src/components/panels/color-picker.tsx +++ b/packages/editor/src/components/panels/color-picker.tsx @@ -1,9 +1,10 @@ import { useCallback, useState } from 'react'; import { HexColorPicker } from 'react-colorful'; -import { themeColors } from '../../lib/constants'; -import { Icon } from '../icon'; -import { Toolbar } from '../toolbar'; +import { Icon } from '#editor/components/icon'; +import { Toolbar } from '#editor/components/toolbar'; +import { themeColors } from '#editor/lib/constants'; + import { ColorButton } from './color-button'; export interface ColorPickerProps { diff --git a/packages/editor/src/components/panels/link-editor-panel.tsx b/packages/editor/src/components/panels/link-editor-panel.tsx index fde93271..595f04e8 100644 --- a/packages/editor/src/components/panels/link-editor-panel.tsx +++ b/packages/editor/src/components/panels/link-editor-panel.tsx @@ -1,9 +1,9 @@ import { useCallback, useMemo, useState } from 'react'; -import { Button } from '../editor-button'; -import { Icon } from '../icon'; -import { Surface } from '../surface'; -import { Toggle } from '../toggle'; +import { Button } from '#editor/components/editor-button'; +import { Icon } from '#editor/components/icon'; +import { Surface } from '#editor/components/surface'; +import { Toggle } from '#editor/components/toggle'; export interface LinkEditorPanelProps { initialUrl?: string; diff --git a/packages/editor/src/components/panels/link-preview-panel.tsx b/packages/editor/src/components/panels/link-preview-panel.tsx index f07d5229..130e7665 100644 --- a/packages/editor/src/components/panels/link-preview-panel.tsx +++ b/packages/editor/src/components/panels/link-preview-panel.tsx @@ -1,7 +1,7 @@ -import { Icon } from '../icon'; -import { Surface } from '../surface'; -import { Toolbar } from '../toolbar'; -import Tooltip from '../tooltip'; +import { Icon } from '#editor/components/icon'; +import { Surface } from '#editor/components/surface'; +import { Toolbar } from '#editor/components/toolbar'; +import Tooltip from '#editor/components/tooltip'; export interface LinkPreviewPanelProps { url: string; diff --git a/packages/editor/src/components/slash-command/command-button.tsx b/packages/editor/src/components/slash-command/command-button.tsx index b7cbbfe7..e0c5614f 100644 --- a/packages/editor/src/components/slash-command/command-button.tsx +++ b/packages/editor/src/components/slash-command/command-button.tsx @@ -4,7 +4,7 @@ import { forwardRef } from 'react'; import { cn } from '@av/ui'; -import { Icon } from '../../components/icon'; +import { Icon } from '#editor/components/icon'; export interface CommandButtonProps { active?: boolean; diff --git a/packages/editor/src/components/slash-command/menu-list.tsx b/packages/editor/src/components/slash-command/menu-list.tsx index e32b9e1b..f9cec1f4 100644 --- a/packages/editor/src/components/slash-command/menu-list.tsx +++ b/packages/editor/src/components/slash-command/menu-list.tsx @@ -1,13 +1,13 @@ import type { Editor } from '@tiptap/core'; +import type { Group } from '#editor/extensions/slash-command/groups'; import type { icons } from 'lucide-react'; import React, { useCallback, useEffect, useRef, useState } from 'react'; -import type { Group } from '../../extensions/slash-command/groups'; +import { DropdownButton } from '#editor/components/dropdown'; +import { Icon } from '#editor/components/icon'; +import { Surface } from '#editor/components/surface'; -import { DropdownButton } from '../../components/dropdown'; -import { Icon } from '../../components/icon'; -import { Surface } from '../../components/surface'; // TODO: // eslint-disable-next-line @typescript-eslint/no-unused-vars import { CommandButton } from './command-button'; diff --git a/packages/editor/src/components/table/table-column-menu.tsx b/packages/editor/src/components/table/table-column-menu.tsx index 749508dc..9c3b5e4a 100644 --- a/packages/editor/src/components/table/table-column-menu.tsx +++ b/packages/editor/src/components/table/table-column-menu.tsx @@ -1,12 +1,12 @@ +import type { MenuProps, ShouldShowProps } from '#editor/types'; + import React, { useCallback } from 'react'; import { BubbleMenu as BaseBubbleMenu } from '@tiptap/react'; -import type { MenuProps, ShouldShowProps } from '../../types'; - -import { Icon } from '../../components/icon'; -import * as PopoverMenu from '../../components/popover-menu'; -import { Toolbar } from '../../components/toolbar'; -import { isColumnGripSelected } from '../../extensions/table/menus/table-menu-utils'; +import { Icon } from '#editor/components/icon'; +import * as PopoverMenu from '#editor/components/popover-menu'; +import { Toolbar } from '#editor/components/toolbar'; +import { isColumnGripSelected } from '#editor/extensions/table/menus/table-menu-utils'; export const TableColumnMenu = React.memo( ({ editor, appendTo }: MenuProps): JSX.Element => { diff --git a/packages/editor/src/components/table/table-row-menu.tsx b/packages/editor/src/components/table/table-row-menu.tsx index 8eef32d0..88a925ca 100644 --- a/packages/editor/src/components/table/table-row-menu.tsx +++ b/packages/editor/src/components/table/table-row-menu.tsx @@ -1,12 +1,12 @@ +import type { MenuProps, ShouldShowProps } from '#editor/types'; + import React, { useCallback } from 'react'; import { BubbleMenu as BaseBubbleMenu } from '@tiptap/react'; -import type { MenuProps, ShouldShowProps } from '../../types'; - -import { Icon } from '../../components/icon'; -import * as PopoverMenu from '../../components/popover-menu'; -import { Toolbar } from '../../components/toolbar'; -import { isRowGripSelected } from '../../extensions/table/menus/table-menu-utils'; +import { Icon } from '#editor/components/icon'; +import * as PopoverMenu from '#editor/components/popover-menu'; +import { Toolbar } from '#editor/components/toolbar'; +import { isRowGripSelected } from '#editor/extensions/table/menus/table-menu-utils'; export const TableRowMenu = React.memo( ({ editor, appendTo }: MenuProps): JSX.Element => { diff --git a/packages/editor/src/extensions/blockquote-figure/blockquote-figure.ts b/packages/editor/src/extensions/blockquote-figure/blockquote-figure.ts index 610c3235..108ec209 100644 --- a/packages/editor/src/extensions/blockquote-figure/blockquote-figure.ts +++ b/packages/editor/src/extensions/blockquote-figure/blockquote-figure.ts @@ -1,6 +1,7 @@ import { mergeAttributes } from '@tiptap/core'; -import { Figure } from '../figure'; +import { Figure } from '#editor/extensions/figure'; + import { Quote } from './quote'; import { QuoteCaption } from './quote-caption'; diff --git a/packages/editor/src/extensions/embed-input.ts b/packages/editor/src/extensions/embed-input.ts index 13efd3fb..68a0731f 100644 --- a/packages/editor/src/extensions/embed-input.ts +++ b/packages/editor/src/extensions/embed-input.ts @@ -1,13 +1,13 @@ // TODO: +import type { EmbedService } from '#editor/lib/constants'; + import { getText, mergeAttributes, Node } from '@tiptap/core'; import { ReactNodeViewRenderer } from '@tiptap/react'; -import type { EmbedService } from '../lib/constants'; - -import { EmbedInputView } from '../components/embed-input-view'; +import { EmbedInputView } from '#editor/components/embed-input-view'; // eslint-disable-next-line @typescript-eslint/no-unused-vars -import { embeds as services } from '../lib/constants'; +import { embeds as services } from '#editor/lib/constants'; declare module '@tiptap/core' { interface Commands { diff --git a/packages/editor/src/extensions/emoji-suggestion.ts b/packages/editor/src/extensions/emoji-suggestion.ts index 2dc80477..5fb32b34 100644 --- a/packages/editor/src/extensions/emoji-suggestion.ts +++ b/packages/editor/src/extensions/emoji-suggestion.ts @@ -8,7 +8,7 @@ import type { Instance } from 'tippy.js'; import { ReactRenderer } from '@tiptap/react'; import tippy from 'tippy.js'; -import EmojiList from '../components/emoji-list'; +import EmojiList from '#editor/components/emoji-list'; export const emojiSuggestion = { items: ({ editor, query }: { editor: Editor; query: string }) => diff --git a/packages/editor/src/extensions/extension-kit.ts b/packages/editor/src/extensions/extension-kit.ts index 0aad18f6..a6aa4f13 100644 --- a/packages/editor/src/extensions/extension-kit.ts +++ b/packages/editor/src/extensions/extension-kit.ts @@ -1,6 +1,7 @@ 'use client'; import type { HocuspocusProvider } from '@hocuspocus/provider'; +import type { EditorUser } from '#editor/types'; import { Emoji } from '@tiptap-pro/extension-emoji'; import { FileHandler } from '@tiptap-pro/extension-file-handler'; @@ -24,12 +25,11 @@ import { Underline } from '@tiptap/extension-underline'; import { StarterKit } from '@tiptap/starter-kit'; import { common, createLowlight } from 'lowlight'; -import type { EditorUser } from '../types'; +import { AiImage } from '#editor/components/ai-image/ai-image'; +import { AiWriter } from '#editor/components/ai-writer/ai-writer'; +import { TableOfContentNode } from '#editor/components/table-of-content-node'; +import { API } from '#editor/lib/api'; -import { AiImage } from '../components/ai-image/ai-image'; -import { AiWriter } from '../components/ai-writer/ai-writer'; -import { TableOfContentNode } from '../components/table-of-content-node'; -import { API } from '../lib/api'; import { BlockquoteFigure } from './blockquote-figure/blockquote-figure'; // import { PasteFromGoogleDoc } from './PasteFromGoogleDoc' import { Document } from './document'; diff --git a/packages/editor/src/extensions/image-block.ts b/packages/editor/src/extensions/image-block.ts index 740444e4..c2d3b5e6 100644 --- a/packages/editor/src/extensions/image-block.ts +++ b/packages/editor/src/extensions/image-block.ts @@ -3,7 +3,8 @@ import type { Range } from '@tiptap/core'; import { mergeAttributes } from '@tiptap/core'; import { ReactNodeViewRenderer } from '@tiptap/react'; -import { ImageBlockView } from '../components/image-block/image-block-view'; +import { ImageBlockView } from '#editor/components/image-block/image-block-view'; + import Image from './image'; declare module '@tiptap/core' { diff --git a/packages/editor/src/extensions/image-upload.ts b/packages/editor/src/extensions/image-upload.ts index 395e877c..6af2575b 100644 --- a/packages/editor/src/extensions/image-upload.ts +++ b/packages/editor/src/extensions/image-upload.ts @@ -1,6 +1,6 @@ import { Node, ReactNodeViewRenderer } from '@tiptap/react'; -import { ImageUpload as ImageUploadComponent } from '../components/image-upload/image-upload'; +import { ImageUpload as ImageUploadComponent } from '#editor/components/image-upload/image-upload'; declare module '@tiptap/core' { interface Commands { diff --git a/packages/editor/src/extensions/slash-command/groups.ts b/packages/editor/src/extensions/slash-command/groups.ts index a541de90..ce17f799 100644 --- a/packages/editor/src/extensions/slash-command/groups.ts +++ b/packages/editor/src/extensions/slash-command/groups.ts @@ -1,4 +1,4 @@ -import type { Command } from '../../components/slash-command/menu-list'; +import type { Command } from '#editor/components/slash-command/menu-list'; // import { EmbedService } from '#/lib/constants' diff --git a/packages/editor/src/extensions/slash-command/slash-command.ts b/packages/editor/src/extensions/slash-command/slash-command.ts index 7c89f2b6..5e5445bb 100644 --- a/packages/editor/src/extensions/slash-command/slash-command.ts +++ b/packages/editor/src/extensions/slash-command/slash-command.ts @@ -10,7 +10,8 @@ import { ReactRenderer } from '@tiptap/react'; import Suggestion from '@tiptap/suggestion'; import tippy from 'tippy.js'; -import { MenuList } from '../../components/slash-command/menu-list'; +import { MenuList } from '#editor/components/slash-command/menu-list'; + import { GROUPS } from './groups'; const extensionName = 'slashCommand'; diff --git a/packages/editor/src/extensions/table/menus/table-menu-utils.ts b/packages/editor/src/extensions/table/menus/table-menu-utils.ts index c2f3a989..19d8337a 100644 --- a/packages/editor/src/extensions/table/menus/table-menu-utils.ts +++ b/packages/editor/src/extensions/table/menus/table-menu-utils.ts @@ -2,8 +2,8 @@ import type { EditorState } from '@tiptap/pm/state'; import type { EditorView } from '@tiptap/pm/view'; import type { Editor } from '@tiptap/react'; -import { Table } from '../table'; -import { isTableSelected } from '../utils'; +import { Table } from '#editor/extensions/table/table'; +import { isTableSelected } from '#editor/extensions/table/utils'; export const isColumnGripSelected = ({ editor, diff --git a/packages/editor/src/hooks/image-upload/hooks.ts b/packages/editor/src/hooks/image-upload-hooks.ts similarity index 98% rename from packages/editor/src/hooks/image-upload/hooks.ts rename to packages/editor/src/hooks/image-upload-hooks.ts index b003da40..f5c048a3 100644 --- a/packages/editor/src/hooks/image-upload/hooks.ts +++ b/packages/editor/src/hooks/image-upload-hooks.ts @@ -3,7 +3,7 @@ import type { DragEvent } from 'react'; import { useCallback, useEffect, useRef, useState } from 'react'; import toast from 'react-hot-toast'; -import { API } from '../../lib/api'; +import { API } from '#editor/lib/api'; export const useUploader = ({ onUpload, diff --git a/packages/editor/src/hooks/content-item-menu/use-content-item-actions.ts b/packages/editor/src/hooks/use-content-item-actions.ts similarity index 100% rename from packages/editor/src/hooks/content-item-menu/use-content-item-actions.ts rename to packages/editor/src/hooks/use-content-item-actions.ts diff --git a/packages/editor/src/hooks/content-item-menu/use-data.ts b/packages/editor/src/hooks/use-data.ts similarity index 100% rename from packages/editor/src/hooks/content-item-menu/use-data.ts rename to packages/editor/src/hooks/use-data.ts diff --git a/packages/editor/src/hooks/text-menu/use-text-menu-commands.ts b/packages/editor/src/hooks/use-text-menu-commands.ts similarity index 100% rename from packages/editor/src/hooks/text-menu/use-text-menu-commands.ts rename to packages/editor/src/hooks/use-text-menu-commands.ts diff --git a/packages/editor/src/hooks/text-menu/use-text-menu-content-types.ts b/packages/editor/src/hooks/use-text-menu-content-types.ts similarity index 97% rename from packages/editor/src/hooks/text-menu/use-text-menu-content-types.ts rename to packages/editor/src/hooks/use-text-menu-content-types.ts index a3f6099d..8fa89e03 100644 --- a/packages/editor/src/hooks/text-menu/use-text-menu-content-types.ts +++ b/packages/editor/src/hooks/use-text-menu-content-types.ts @@ -1,9 +1,8 @@ import type { Editor } from '@tiptap/react'; +import type { ContentPickerOptions } from '#editor/components/menus/text-menu/content-type-picker'; import { useMemo } from 'react'; -import type { ContentPickerOptions } from '../../components/menus/text-menu/content-type-picker'; - export const useTextmenuContentTypes = (editor: Editor) => { const options = useMemo(() => { return [ diff --git a/packages/editor/src/hooks/text-menu/use-text-menu-states.ts b/packages/editor/src/hooks/use-text-menu-states.ts similarity index 87% rename from packages/editor/src/hooks/text-menu/use-text-menu-states.ts rename to packages/editor/src/hooks/use-text-menu-states.ts index e007195a..df2cdf21 100644 --- a/packages/editor/src/hooks/text-menu/use-text-menu-states.ts +++ b/packages/editor/src/hooks/use-text-menu-states.ts @@ -1,11 +1,10 @@ import type { Editor } from '@tiptap/react'; +import type { ShouldShowProps } from '#editor/types'; import { useCallback } from 'react'; -import type { ShouldShowProps } from '../../types'; - -import { isCustomNodeSelected } from '../../lib/utils/is-custom-node-selected'; -import { isTextSelected } from '../../lib/utils/is-text-selected'; +import { isCustomNodeSelected } from '#editor/lib/utils/is-custom-node-selected'; +import { isTextSelected } from '#editor/lib/utils/is-text-selected'; export const useTextmenuStates = (editor: Editor) => { const shouldShow = useCallback( diff --git a/packages/editor/src/lib/constants.ts b/packages/editor/src/lib/constants.ts index f2624d51..ec9a3166 100644 --- a/packages/editor/src/lib/constants.ts +++ b/packages/editor/src/lib/constants.ts @@ -1,4 +1,4 @@ -import type { AiToneOption, LanguageOption } from '../types'; +import type { AiToneOption, LanguageOption } from '#editor/types'; export const languages: LanguageOption[] = [ { name: 'arabic', label: 'Arabic', value: 'ar' as LanguageOption['value'] }, diff --git a/packages/editor/src/lib/utils/is-custom-node-selected.ts b/packages/editor/src/lib/utils/is-custom-node-selected.ts index 27b34c5a..75509e48 100644 --- a/packages/editor/src/lib/utils/is-custom-node-selected.ts +++ b/packages/editor/src/lib/utils/is-custom-node-selected.ts @@ -2,14 +2,14 @@ import type { Editor } from '@tiptap/react'; import CodeBlock from '@tiptap/extension-code-block'; -import AiImage from '../../components/ai-image/ai-image'; -import AiWriter from '../../components/ai-writer/ai-writer'; -import { TableOfContentNode } from '../../components/table-of-content-node'; -import Figcaption from '../../extensions/figcaption'; -import HorizontalRule from '../../extensions/horizontal-rule'; -import ImageBlock from '../../extensions/image-block'; -import ImageUpload from '../../extensions/image-upload'; -import Link from '../../extensions/link'; +import AiImage from '#editor/components/ai-image/ai-image'; +import AiWriter from '#editor/components/ai-writer/ai-writer'; +import { TableOfContentNode } from '#editor/components/table-of-content-node'; +import Figcaption from '#editor/extensions/figcaption'; +import HorizontalRule from '#editor/extensions/horizontal-rule'; +import ImageBlock from '#editor/extensions/image-block'; +import ImageUpload from '#editor/extensions/image-upload'; +import Link from '#editor/extensions/link'; export const isTableGripSelected = (node: HTMLElement) => { let container = node; diff --git a/packages/editor/tsconfig.json b/packages/editor/tsconfig.json index 58769f50..f7db1806 100644 --- a/packages/editor/tsconfig.json +++ b/packages/editor/tsconfig.json @@ -1,6 +1,10 @@ { "extends": "@av/tsconfig/base.json", "compilerOptions": { + "baseUrl": ".", + "paths": { + "#editor/*": ["./src/*"], + }, "tsBuildInfoFile": "node_modules/.cache/tsbuildinfo.json", }, "include": ["*.ts", "src"], diff --git a/tooling/prettier/index.js b/tooling/prettier/index.js index 1d8ff619..497df12c 100644 --- a/tooling/prettier/index.js +++ b/tooling/prettier/index.js @@ -36,6 +36,8 @@ const config = { '^@av', '^@av/(.*)$', '', + '^#editor/(.*)$', + '', '^[.|..|~]', '', '^#/config/(.*)$', diff --git a/tooling/typescript/base.json b/tooling/typescript/base.json index d3597bdd..018fca4d 100644 --- a/tooling/typescript/base.json +++ b/tooling/typescript/base.json @@ -17,7 +17,11 @@ "resolveJsonModule": true, "skipLibCheck": true, "strict": true, - "strictNullChecks": true + "strictNullChecks": true, + "baseUrl": ".", + "paths": { + "#editor/*": ["../../packages/editor/src/*"] + } }, "exclude": ["node_modules", "build", "dist", ".next", "cursor"] }