@particle-academy/react-fancy 4.14.0 → 4.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -2244,6 +2244,47 @@ interface EditorContextValue {
2244
2244
  }
2245
2245
  declare function useEditor(): EditorContextValue;
2246
2246
 
2247
+ interface CodeViewProps {
2248
+ /** Source text to display / edit. Controlled. */
2249
+ value: string;
2250
+ /**
2251
+ * Called on edit. Omit (or set `readOnly`) for a read-only view. When
2252
+ * provided, the view is an editable source surface (transparent textarea over
2253
+ * the highlight overlay).
2254
+ */
2255
+ onChange?: (value: string) => void;
2256
+ /**
2257
+ * Language id for syntax highlighting. Only `"html"` is highlighted (the one
2258
+ * grammar shipped by `fancy-file-commons`); everything else — including
2259
+ * `"markdown"` and `"plaintext"` — renders un-highlighted. For richer language
2260
+ * highlighting use `@particle-academy/fancy-code`'s `CodeEditor`.
2261
+ * @default "plaintext"
2262
+ */
2263
+ language?: "html" | "markdown" | "plaintext" | (string & {});
2264
+ /** Read-only mode (no editing even if `onChange` is passed). @default false */
2265
+ readOnly?: boolean;
2266
+ /** Placeholder shown when empty. */
2267
+ placeholder?: string;
2268
+ /** Min height in px before the view grows with content. @default 120 */
2269
+ minHeight?: number;
2270
+ /** Max height in px before the view scrolls internally. */
2271
+ maxHeight?: number;
2272
+ /** Additional classes on the scroll container (e.g. `h-full`, `flex-auto`). */
2273
+ className?: string;
2274
+ }
2275
+
2276
+ /**
2277
+ * A lightweight, syntax-highlighted source view built on the pure highlight
2278
+ * primitives in `@particle-academy/fancy-file-commons` — a highlight overlay
2279
+ * with a transparent, auto-growing textarea on top; the container scrolls both
2280
+ * together. Fills its parent's height (`h-full`) and grows with content down to
2281
+ * `minHeight`. Only HTML is highlighted; other languages render as plain text.
2282
+ */
2283
+ declare function CodeView({ value, onChange, language, readOnly, placeholder, minHeight, maxHeight, className, }: CodeViewProps): react.JSX.Element;
2284
+ declare namespace CodeView {
2285
+ var displayName: string;
2286
+ }
2287
+
2247
2288
  interface ContentRendererProps {
2248
2289
  value: string;
2249
2290
  format?: "html" | "markdown" | "auto";
@@ -2638,6 +2679,17 @@ interface TreeNavProps {
2638
2679
  indentSize?: number;
2639
2680
  /** Show file/folder icons (default: true) */
2640
2681
  showIcons?: boolean;
2682
+ /**
2683
+ * Cursor shown on hover over a draggable node.
2684
+ * - `"none"` (default): the normal clickable cursor — no move affordance on
2685
+ * mere hover. A closed-hand `grabbing` cursor still appears while a drag is
2686
+ * actually happening. This suits click-to-select/open trees (file/nav
2687
+ * trees), where an always-on grab cursor wrongly implies move-first intent.
2688
+ * - `"grab"`: show the open-hand `grab` cursor on hover. Opt in when the whole
2689
+ * row is genuinely a drag handle and reordering is the primary interaction.
2690
+ * @default "none"
2691
+ */
2692
+ dragCursor?: "grab" | "none";
2641
2693
  /** Custom className */
2642
2694
  className?: string;
2643
2695
  }
@@ -2650,6 +2702,7 @@ interface TreeNavContextValue {
2650
2702
  indentSize: number;
2651
2703
  showIcons: boolean;
2652
2704
  draggable: boolean;
2705
+ dragCursor: "grab" | "none";
2653
2706
  dragState: DragState;
2654
2707
  setDragState: (state: DragState) => void;
2655
2708
  onNodeMove?: (sourceId: string, targetId: string, position: DropPosition) => void;
@@ -2669,7 +2722,7 @@ declare namespace TreeNode {
2669
2722
  var displayName: string;
2670
2723
  }
2671
2724
 
2672
- declare function TreeNavRoot({ nodes, selectedId, onSelect, onNodeContextMenu, draggable, onNodeMove, acceptExternalDrops, onExternalDrop, expandedIds: controlledExpanded, defaultExpandedIds, onExpandedChange, defaultExpandAll, indentSize, showIcons, className, }: TreeNavProps): react.JSX.Element;
2725
+ declare function TreeNavRoot({ nodes, selectedId, onSelect, onNodeContextMenu, draggable, onNodeMove, acceptExternalDrops, onExternalDrop, expandedIds: controlledExpanded, defaultExpandedIds, onExpandedChange, defaultExpandAll, indentSize, showIcons, dragCursor, className, }: TreeNavProps): react.JSX.Element;
2673
2726
  declare namespace TreeNavRoot {
2674
2727
  var displayName: string;
2675
2728
  }
@@ -3697,4 +3750,4 @@ declare const AudioViewer: react.ForwardRefExoticComponent<AudioViewerProps & re
3697
3750
  */
3698
3751
  declare const PdfViewer: react.ForwardRefExoticComponent<PdfViewerProps & react.RefAttributes<HTMLDivElement>>;
3699
3752
 
3700
- export { Accordion, type AccordionContentProps, type AccordionContextValue, type AccordionItemProps, type AccordionOrientation, AccordionPanel, AccordionPanelContent, type AccordionPanelContentProps, type AccordionPanelProps, AccordionPanelSection, type AccordionPanelSectionProps, AccordionPanelTrigger, type AccordionPanelTriggerProps, type AccordionProps, type AccordionTriggerProps, Action, type ActionColor, type ActionProps, type AffixPosition, AudioViewer, type AudioViewerProps, Autocomplete, type AutocompleteOption, type AutocompleteProps, Avatar, type AvatarProps, Badge, type BadgeProps, Brand, type BrandProps, Breadcrumbs, type BreadcrumbsItemProps, type BreadcrumbsProps, Button, type ButtonColor, type ButtonProps, Calendar, type CalendarMode, type CalendarProps, Callout, type CalloutProps, Card, type CardBodyProps, type CardFooterProps, type CardHeaderProps, type CardProps, Carousel, type CarouselContextValue, type CarouselControlsProps, type CarouselPanelsProps, type CarouselProps, type CarouselSlideProps, type CarouselStepsProps, type CarouselVariant, Chart, type ChartAreaProps, type ChartBarData, type ChartBarProps, type ChartCommonProps, type ChartDonutData, type ChartDonutProps, type ChartHorizontalBarProps, type ChartLineProps, type ChartPieData, type ChartPieProps, type ChartSeries, type ChartSparklineProps, type ChartStackedBarProps, ChatDrawer, type ChatDrawerProps, type ChatDrawerTab, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type Color, ColorPicker, type ColorPickerProps, Command, type CommandContextValue, type CommandEmptyProps, type CommandGroupProps, type CommandInputProps, type CommandItemProps, type CommandListProps, type CommandProps, Composer, type ComposerProps, ContentRenderer, type ContentRendererProps, ContextMenu, type ContextMenuContentProps, type ContextMenuContextValue, type ContextMenuItemProps, type ContextMenuProps, type ContextMenuSeparatorProps, type ContextMenuTriggerProps, type ControlledAdapterHandle, DatePicker, type DatePickerProps, type DateRange, DisplayValue, type DisplayValueProps, type DropPosition, Dropdown, type DropdownContextValue, type DropdownItemProps, type DropdownItemsProps, type DropdownProps, type DropdownSeparatorProps, type DropdownTriggerProps, EMOJI_CATEGORY_ORDER, EMOJI_DATA, EMOJI_ENTRIES, Editor, type EditorAction, type EditorContentProps, type EditorContextValue, type EditorProps, type EditorSourceToggleProps, type EditorToolbarProps, Emoji, type EmojiCategory, type EmojiCategoryKey, type EmojiEntry, type EmojiFlatEntry, type EmojiProps, EmojiSelect, type EmojiSelectProps, FauxClient, type FauxClientProps, Field, type FieldMode, FieldModeContext, type FieldModeContextValue, type FieldProps, FileBrowser, type FileBrowserContextValue, type FileBrowserNodeProps, type FileBrowserPathBarProps, type FileBrowserProps, type FileBrowserProvider, type FileBrowserRow, type FileBrowserToolbarProps, type FileBrowserTreeProps, type FileEntry, type FileKind, type FileLoadStatus, type FileSelectMode, type FileSnapshotNode, type FileSort, type FileSortDirection, type FileSortField, FileUpload, type FileUploadContextValue, type FileUploadDropzoneProps, type FileUploadListProps, type FileUploadProps, Form, type FormProps, FormProvider, type FormProviderProps, Heading, type HeadingProps, Icon, type IconProps, type IconSet, ImageViewer, type ImageViewerProps, type ImageViewerViewport, Input, type InputAffixProps, type InputBaseProps, type InputOption, type InputOptionGroup, type InputProps, InputTag, type InputTagAdapter, type InputTagAdapterState, type InputTagProps, type InputTagTrigger, type InputTagTriggers, Kanban, type KanbanCardMoveHandler, type KanbanCardProps, type KanbanColumnHandleProps, type KanbanColumnMoveHandler, type KanbanColumnProps, type KanbanContextValue, type KanbanProps, MagicWand, type MagicWandAction, type MagicWandAppearance, type MagicWandProps, type MagicWandSelection, Marquee, type MarqueeDirection, type MarqueeProps, type MediaKind, MediaViewer, type MediaViewerProps, Menu, type MenuContextValue, type MenuGroupProps, type MenuItemProps, type MenuOrientation, type MenuProps, type MenuSubmenuProps, MobileMenu, type MobileMenuBottomBarProps, type MobileMenuContextValue, type MobileMenuFlyoutProps, type MobileMenuItemProps, type MobileMenuSide, type MobileMenuVariant, Modal, type ModalBodyProps, type ModalContextValue, type ModalFooterProps, type ModalHeaderProps, type ModalProps, MoodMeter, type MoodMeterProps, MultiSwitch, type MultiSwitchProps, Navbar, type NavbarBrandProps, type NavbarContextValue, type NavbarItemProps, type NavbarItemsProps, type NavbarProps, type NavbarToggleProps, type NodeRect, OtpInput, type OtpInputProps, Pagination, type PaginationProps, PdfViewer, type PdfViewerProps, Pillbox, type PillboxProps, type Placement, Popover, type PopoverContentProps, type PopoverContextValue, type PopoverProps, type PopoverTriggerProps, Portal, type PortalProps, Profile, type ProfileProps, Progress, type ProgressProps, type PromptAttachment, type PromptCmd, PromptInput, type PromptInputProps, type PromptMention, RadioGroup, type RadioGroupProps, ReasonTag, type ReasonTagProps, type ReasonTagSource, type ReasonTagTheme, type RenderExtension, type RenderExtensionProps, type ResolveMediaTypeInput, SKIN_TONES, type SectionRenderState, type SectionRenderable, Select, type SelectProps, Separator, type SeparatorProps, Sidebar, type SidebarCollapseMode, type SidebarContextValue, type SidebarGroupProps, type SidebarItemProps, type SidebarProps, type SidebarSubmenuProps, type SidebarToggleProps, type Size, Skeleton, type SkeletonProps, type SkinTone, Slider, type SliderProps, StickyNote, type StickyNoteColor, type StickyNoteProps, Switch, type SwitchProps, Table, type TableBodyProps, type TableCellProps, type TableColumnProps, type TableHeadProps, type TablePaginationProps, type TableProps, type TableRowProps, type TableRowTrayProps, type TableSearchProps, type TableTrayProps, Tabs, type TabsContextValue, type TabsListProps, type TabsPanelProps, type TabsPanelsProps, type TabsProps, type TabsTabProps, type TabsVariant, Text, type TextProps, Textarea, type TextareaProps, TimeGrid, type TimeGridProps, type TimeGridTone, TimePicker, type TimePickerProps, Timeline, type TimelineBlockProps, type TimelineEvent, type TimelineItemProps, type TimelineOrientation, type TimelineProps, type TimelineVariant, Toast, type ToastContextValue, type ToastData, type ToastPosition, type ToastProviderProps, type ToastVariant, Tooltip, type TooltipProps, TreeNav, type TreeNavContextValue, type TreeNavProps, type TreeNodeData, type TreeNodeProps, type Variant, VideoViewer, type VideoViewerProps, applyTone, cn, configureIcons, contentEditableAdapter, controlledAdapter, find, hasSkinTones, inputAdapter, registerExtension, registerExtensions, registerIconAddendum, registerIconSet, registerIcons, resolve, resolveMediaType, sanitizeHref, sanitizeHtml, search, skinTones, textareaAdapter, useAccordion, useAccordionPanel, useAccordionSection, useAnimation, useCarousel, useCommand, useContextMenu, useControllableState, useDropdown, useEditor, useEscapeKey, useFieldMode, useFileBrowser, useFileUpload, useFloatingPosition, useFocusTrap, useId, useKanban, useMenu, useMobileMenu, useModal, useNavbar, useNodeRegistry, useOutsideClick, usePanZoom, usePopover, useSidebar, useTabs, useToast, useTreeNav };
3753
+ export { Accordion, type AccordionContentProps, type AccordionContextValue, type AccordionItemProps, type AccordionOrientation, AccordionPanel, AccordionPanelContent, type AccordionPanelContentProps, type AccordionPanelProps, AccordionPanelSection, type AccordionPanelSectionProps, AccordionPanelTrigger, type AccordionPanelTriggerProps, type AccordionProps, type AccordionTriggerProps, Action, type ActionColor, type ActionProps, type AffixPosition, AudioViewer, type AudioViewerProps, Autocomplete, type AutocompleteOption, type AutocompleteProps, Avatar, type AvatarProps, Badge, type BadgeProps, Brand, type BrandProps, Breadcrumbs, type BreadcrumbsItemProps, type BreadcrumbsProps, Button, type ButtonColor, type ButtonProps, Calendar, type CalendarMode, type CalendarProps, Callout, type CalloutProps, Card, type CardBodyProps, type CardFooterProps, type CardHeaderProps, type CardProps, Carousel, type CarouselContextValue, type CarouselControlsProps, type CarouselPanelsProps, type CarouselProps, type CarouselSlideProps, type CarouselStepsProps, type CarouselVariant, Chart, type ChartAreaProps, type ChartBarData, type ChartBarProps, type ChartCommonProps, type ChartDonutData, type ChartDonutProps, type ChartHorizontalBarProps, type ChartLineProps, type ChartPieData, type ChartPieProps, type ChartSeries, type ChartSparklineProps, type ChartStackedBarProps, ChatDrawer, type ChatDrawerProps, type ChatDrawerTab, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, CodeView, type CodeViewProps, type Color, ColorPicker, type ColorPickerProps, Command, type CommandContextValue, type CommandEmptyProps, type CommandGroupProps, type CommandInputProps, type CommandItemProps, type CommandListProps, type CommandProps, Composer, type ComposerProps, ContentRenderer, type ContentRendererProps, ContextMenu, type ContextMenuContentProps, type ContextMenuContextValue, type ContextMenuItemProps, type ContextMenuProps, type ContextMenuSeparatorProps, type ContextMenuTriggerProps, type ControlledAdapterHandle, DatePicker, type DatePickerProps, type DateRange, DisplayValue, type DisplayValueProps, type DropPosition, Dropdown, type DropdownContextValue, type DropdownItemProps, type DropdownItemsProps, type DropdownProps, type DropdownSeparatorProps, type DropdownTriggerProps, EMOJI_CATEGORY_ORDER, EMOJI_DATA, EMOJI_ENTRIES, Editor, type EditorAction, type EditorContentProps, type EditorContextValue, type EditorProps, type EditorSourceToggleProps, type EditorToolbarProps, Emoji, type EmojiCategory, type EmojiCategoryKey, type EmojiEntry, type EmojiFlatEntry, type EmojiProps, EmojiSelect, type EmojiSelectProps, FauxClient, type FauxClientProps, Field, type FieldMode, FieldModeContext, type FieldModeContextValue, type FieldProps, FileBrowser, type FileBrowserContextValue, type FileBrowserNodeProps, type FileBrowserPathBarProps, type FileBrowserProps, type FileBrowserProvider, type FileBrowserRow, type FileBrowserToolbarProps, type FileBrowserTreeProps, type FileEntry, type FileKind, type FileLoadStatus, type FileSelectMode, type FileSnapshotNode, type FileSort, type FileSortDirection, type FileSortField, FileUpload, type FileUploadContextValue, type FileUploadDropzoneProps, type FileUploadListProps, type FileUploadProps, Form, type FormProps, FormProvider, type FormProviderProps, Heading, type HeadingProps, Icon, type IconProps, type IconSet, ImageViewer, type ImageViewerProps, type ImageViewerViewport, Input, type InputAffixProps, type InputBaseProps, type InputOption, type InputOptionGroup, type InputProps, InputTag, type InputTagAdapter, type InputTagAdapterState, type InputTagProps, type InputTagTrigger, type InputTagTriggers, Kanban, type KanbanCardMoveHandler, type KanbanCardProps, type KanbanColumnHandleProps, type KanbanColumnMoveHandler, type KanbanColumnProps, type KanbanContextValue, type KanbanProps, MagicWand, type MagicWandAction, type MagicWandAppearance, type MagicWandProps, type MagicWandSelection, Marquee, type MarqueeDirection, type MarqueeProps, type MediaKind, MediaViewer, type MediaViewerProps, Menu, type MenuContextValue, type MenuGroupProps, type MenuItemProps, type MenuOrientation, type MenuProps, type MenuSubmenuProps, MobileMenu, type MobileMenuBottomBarProps, type MobileMenuContextValue, type MobileMenuFlyoutProps, type MobileMenuItemProps, type MobileMenuSide, type MobileMenuVariant, Modal, type ModalBodyProps, type ModalContextValue, type ModalFooterProps, type ModalHeaderProps, type ModalProps, MoodMeter, type MoodMeterProps, MultiSwitch, type MultiSwitchProps, Navbar, type NavbarBrandProps, type NavbarContextValue, type NavbarItemProps, type NavbarItemsProps, type NavbarProps, type NavbarToggleProps, type NodeRect, OtpInput, type OtpInputProps, Pagination, type PaginationProps, PdfViewer, type PdfViewerProps, Pillbox, type PillboxProps, type Placement, Popover, type PopoverContentProps, type PopoverContextValue, type PopoverProps, type PopoverTriggerProps, Portal, type PortalProps, Profile, type ProfileProps, Progress, type ProgressProps, type PromptAttachment, type PromptCmd, PromptInput, type PromptInputProps, type PromptMention, RadioGroup, type RadioGroupProps, ReasonTag, type ReasonTagProps, type ReasonTagSource, type ReasonTagTheme, type RenderExtension, type RenderExtensionProps, type ResolveMediaTypeInput, SKIN_TONES, type SectionRenderState, type SectionRenderable, Select, type SelectProps, Separator, type SeparatorProps, Sidebar, type SidebarCollapseMode, type SidebarContextValue, type SidebarGroupProps, type SidebarItemProps, type SidebarProps, type SidebarSubmenuProps, type SidebarToggleProps, type Size, Skeleton, type SkeletonProps, type SkinTone, Slider, type SliderProps, StickyNote, type StickyNoteColor, type StickyNoteProps, Switch, type SwitchProps, Table, type TableBodyProps, type TableCellProps, type TableColumnProps, type TableHeadProps, type TablePaginationProps, type TableProps, type TableRowProps, type TableRowTrayProps, type TableSearchProps, type TableTrayProps, Tabs, type TabsContextValue, type TabsListProps, type TabsPanelProps, type TabsPanelsProps, type TabsProps, type TabsTabProps, type TabsVariant, Text, type TextProps, Textarea, type TextareaProps, TimeGrid, type TimeGridProps, type TimeGridTone, TimePicker, type TimePickerProps, Timeline, type TimelineBlockProps, type TimelineEvent, type TimelineItemProps, type TimelineOrientation, type TimelineProps, type TimelineVariant, Toast, type ToastContextValue, type ToastData, type ToastPosition, type ToastProviderProps, type ToastVariant, Tooltip, type TooltipProps, TreeNav, type TreeNavContextValue, type TreeNavProps, type TreeNodeData, type TreeNodeProps, type Variant, VideoViewer, type VideoViewerProps, applyTone, cn, configureIcons, contentEditableAdapter, controlledAdapter, find, hasSkinTones, inputAdapter, registerExtension, registerExtensions, registerIconAddendum, registerIconSet, registerIcons, resolve, resolveMediaType, sanitizeHref, sanitizeHtml, search, skinTones, textareaAdapter, useAccordion, useAccordionPanel, useAccordionSection, useAnimation, useCarousel, useCommand, useContextMenu, useControllableState, useDropdown, useEditor, useEscapeKey, useFieldMode, useFileBrowser, useFileUpload, useFloatingPosition, useFocusTrap, useId, useKanban, useMenu, useMobileMenu, useModal, useNavbar, useNodeRegistry, useOutsideClick, usePanZoom, usePopover, useSidebar, useTabs, useToast, useTreeNav };
package/dist/index.d.ts CHANGED
@@ -2244,6 +2244,47 @@ interface EditorContextValue {
2244
2244
  }
2245
2245
  declare function useEditor(): EditorContextValue;
2246
2246
 
2247
+ interface CodeViewProps {
2248
+ /** Source text to display / edit. Controlled. */
2249
+ value: string;
2250
+ /**
2251
+ * Called on edit. Omit (or set `readOnly`) for a read-only view. When
2252
+ * provided, the view is an editable source surface (transparent textarea over
2253
+ * the highlight overlay).
2254
+ */
2255
+ onChange?: (value: string) => void;
2256
+ /**
2257
+ * Language id for syntax highlighting. Only `"html"` is highlighted (the one
2258
+ * grammar shipped by `fancy-file-commons`); everything else — including
2259
+ * `"markdown"` and `"plaintext"` — renders un-highlighted. For richer language
2260
+ * highlighting use `@particle-academy/fancy-code`'s `CodeEditor`.
2261
+ * @default "plaintext"
2262
+ */
2263
+ language?: "html" | "markdown" | "plaintext" | (string & {});
2264
+ /** Read-only mode (no editing even if `onChange` is passed). @default false */
2265
+ readOnly?: boolean;
2266
+ /** Placeholder shown when empty. */
2267
+ placeholder?: string;
2268
+ /** Min height in px before the view grows with content. @default 120 */
2269
+ minHeight?: number;
2270
+ /** Max height in px before the view scrolls internally. */
2271
+ maxHeight?: number;
2272
+ /** Additional classes on the scroll container (e.g. `h-full`, `flex-auto`). */
2273
+ className?: string;
2274
+ }
2275
+
2276
+ /**
2277
+ * A lightweight, syntax-highlighted source view built on the pure highlight
2278
+ * primitives in `@particle-academy/fancy-file-commons` — a highlight overlay
2279
+ * with a transparent, auto-growing textarea on top; the container scrolls both
2280
+ * together. Fills its parent's height (`h-full`) and grows with content down to
2281
+ * `minHeight`. Only HTML is highlighted; other languages render as plain text.
2282
+ */
2283
+ declare function CodeView({ value, onChange, language, readOnly, placeholder, minHeight, maxHeight, className, }: CodeViewProps): react.JSX.Element;
2284
+ declare namespace CodeView {
2285
+ var displayName: string;
2286
+ }
2287
+
2247
2288
  interface ContentRendererProps {
2248
2289
  value: string;
2249
2290
  format?: "html" | "markdown" | "auto";
@@ -2638,6 +2679,17 @@ interface TreeNavProps {
2638
2679
  indentSize?: number;
2639
2680
  /** Show file/folder icons (default: true) */
2640
2681
  showIcons?: boolean;
2682
+ /**
2683
+ * Cursor shown on hover over a draggable node.
2684
+ * - `"none"` (default): the normal clickable cursor — no move affordance on
2685
+ * mere hover. A closed-hand `grabbing` cursor still appears while a drag is
2686
+ * actually happening. This suits click-to-select/open trees (file/nav
2687
+ * trees), where an always-on grab cursor wrongly implies move-first intent.
2688
+ * - `"grab"`: show the open-hand `grab` cursor on hover. Opt in when the whole
2689
+ * row is genuinely a drag handle and reordering is the primary interaction.
2690
+ * @default "none"
2691
+ */
2692
+ dragCursor?: "grab" | "none";
2641
2693
  /** Custom className */
2642
2694
  className?: string;
2643
2695
  }
@@ -2650,6 +2702,7 @@ interface TreeNavContextValue {
2650
2702
  indentSize: number;
2651
2703
  showIcons: boolean;
2652
2704
  draggable: boolean;
2705
+ dragCursor: "grab" | "none";
2653
2706
  dragState: DragState;
2654
2707
  setDragState: (state: DragState) => void;
2655
2708
  onNodeMove?: (sourceId: string, targetId: string, position: DropPosition) => void;
@@ -2669,7 +2722,7 @@ declare namespace TreeNode {
2669
2722
  var displayName: string;
2670
2723
  }
2671
2724
 
2672
- declare function TreeNavRoot({ nodes, selectedId, onSelect, onNodeContextMenu, draggable, onNodeMove, acceptExternalDrops, onExternalDrop, expandedIds: controlledExpanded, defaultExpandedIds, onExpandedChange, defaultExpandAll, indentSize, showIcons, className, }: TreeNavProps): react.JSX.Element;
2725
+ declare function TreeNavRoot({ nodes, selectedId, onSelect, onNodeContextMenu, draggable, onNodeMove, acceptExternalDrops, onExternalDrop, expandedIds: controlledExpanded, defaultExpandedIds, onExpandedChange, defaultExpandAll, indentSize, showIcons, dragCursor, className, }: TreeNavProps): react.JSX.Element;
2673
2726
  declare namespace TreeNavRoot {
2674
2727
  var displayName: string;
2675
2728
  }
@@ -3697,4 +3750,4 @@ declare const AudioViewer: react.ForwardRefExoticComponent<AudioViewerProps & re
3697
3750
  */
3698
3751
  declare const PdfViewer: react.ForwardRefExoticComponent<PdfViewerProps & react.RefAttributes<HTMLDivElement>>;
3699
3752
 
3700
- export { Accordion, type AccordionContentProps, type AccordionContextValue, type AccordionItemProps, type AccordionOrientation, AccordionPanel, AccordionPanelContent, type AccordionPanelContentProps, type AccordionPanelProps, AccordionPanelSection, type AccordionPanelSectionProps, AccordionPanelTrigger, type AccordionPanelTriggerProps, type AccordionProps, type AccordionTriggerProps, Action, type ActionColor, type ActionProps, type AffixPosition, AudioViewer, type AudioViewerProps, Autocomplete, type AutocompleteOption, type AutocompleteProps, Avatar, type AvatarProps, Badge, type BadgeProps, Brand, type BrandProps, Breadcrumbs, type BreadcrumbsItemProps, type BreadcrumbsProps, Button, type ButtonColor, type ButtonProps, Calendar, type CalendarMode, type CalendarProps, Callout, type CalloutProps, Card, type CardBodyProps, type CardFooterProps, type CardHeaderProps, type CardProps, Carousel, type CarouselContextValue, type CarouselControlsProps, type CarouselPanelsProps, type CarouselProps, type CarouselSlideProps, type CarouselStepsProps, type CarouselVariant, Chart, type ChartAreaProps, type ChartBarData, type ChartBarProps, type ChartCommonProps, type ChartDonutData, type ChartDonutProps, type ChartHorizontalBarProps, type ChartLineProps, type ChartPieData, type ChartPieProps, type ChartSeries, type ChartSparklineProps, type ChartStackedBarProps, ChatDrawer, type ChatDrawerProps, type ChatDrawerTab, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type Color, ColorPicker, type ColorPickerProps, Command, type CommandContextValue, type CommandEmptyProps, type CommandGroupProps, type CommandInputProps, type CommandItemProps, type CommandListProps, type CommandProps, Composer, type ComposerProps, ContentRenderer, type ContentRendererProps, ContextMenu, type ContextMenuContentProps, type ContextMenuContextValue, type ContextMenuItemProps, type ContextMenuProps, type ContextMenuSeparatorProps, type ContextMenuTriggerProps, type ControlledAdapterHandle, DatePicker, type DatePickerProps, type DateRange, DisplayValue, type DisplayValueProps, type DropPosition, Dropdown, type DropdownContextValue, type DropdownItemProps, type DropdownItemsProps, type DropdownProps, type DropdownSeparatorProps, type DropdownTriggerProps, EMOJI_CATEGORY_ORDER, EMOJI_DATA, EMOJI_ENTRIES, Editor, type EditorAction, type EditorContentProps, type EditorContextValue, type EditorProps, type EditorSourceToggleProps, type EditorToolbarProps, Emoji, type EmojiCategory, type EmojiCategoryKey, type EmojiEntry, type EmojiFlatEntry, type EmojiProps, EmojiSelect, type EmojiSelectProps, FauxClient, type FauxClientProps, Field, type FieldMode, FieldModeContext, type FieldModeContextValue, type FieldProps, FileBrowser, type FileBrowserContextValue, type FileBrowserNodeProps, type FileBrowserPathBarProps, type FileBrowserProps, type FileBrowserProvider, type FileBrowserRow, type FileBrowserToolbarProps, type FileBrowserTreeProps, type FileEntry, type FileKind, type FileLoadStatus, type FileSelectMode, type FileSnapshotNode, type FileSort, type FileSortDirection, type FileSortField, FileUpload, type FileUploadContextValue, type FileUploadDropzoneProps, type FileUploadListProps, type FileUploadProps, Form, type FormProps, FormProvider, type FormProviderProps, Heading, type HeadingProps, Icon, type IconProps, type IconSet, ImageViewer, type ImageViewerProps, type ImageViewerViewport, Input, type InputAffixProps, type InputBaseProps, type InputOption, type InputOptionGroup, type InputProps, InputTag, type InputTagAdapter, type InputTagAdapterState, type InputTagProps, type InputTagTrigger, type InputTagTriggers, Kanban, type KanbanCardMoveHandler, type KanbanCardProps, type KanbanColumnHandleProps, type KanbanColumnMoveHandler, type KanbanColumnProps, type KanbanContextValue, type KanbanProps, MagicWand, type MagicWandAction, type MagicWandAppearance, type MagicWandProps, type MagicWandSelection, Marquee, type MarqueeDirection, type MarqueeProps, type MediaKind, MediaViewer, type MediaViewerProps, Menu, type MenuContextValue, type MenuGroupProps, type MenuItemProps, type MenuOrientation, type MenuProps, type MenuSubmenuProps, MobileMenu, type MobileMenuBottomBarProps, type MobileMenuContextValue, type MobileMenuFlyoutProps, type MobileMenuItemProps, type MobileMenuSide, type MobileMenuVariant, Modal, type ModalBodyProps, type ModalContextValue, type ModalFooterProps, type ModalHeaderProps, type ModalProps, MoodMeter, type MoodMeterProps, MultiSwitch, type MultiSwitchProps, Navbar, type NavbarBrandProps, type NavbarContextValue, type NavbarItemProps, type NavbarItemsProps, type NavbarProps, type NavbarToggleProps, type NodeRect, OtpInput, type OtpInputProps, Pagination, type PaginationProps, PdfViewer, type PdfViewerProps, Pillbox, type PillboxProps, type Placement, Popover, type PopoverContentProps, type PopoverContextValue, type PopoverProps, type PopoverTriggerProps, Portal, type PortalProps, Profile, type ProfileProps, Progress, type ProgressProps, type PromptAttachment, type PromptCmd, PromptInput, type PromptInputProps, type PromptMention, RadioGroup, type RadioGroupProps, ReasonTag, type ReasonTagProps, type ReasonTagSource, type ReasonTagTheme, type RenderExtension, type RenderExtensionProps, type ResolveMediaTypeInput, SKIN_TONES, type SectionRenderState, type SectionRenderable, Select, type SelectProps, Separator, type SeparatorProps, Sidebar, type SidebarCollapseMode, type SidebarContextValue, type SidebarGroupProps, type SidebarItemProps, type SidebarProps, type SidebarSubmenuProps, type SidebarToggleProps, type Size, Skeleton, type SkeletonProps, type SkinTone, Slider, type SliderProps, StickyNote, type StickyNoteColor, type StickyNoteProps, Switch, type SwitchProps, Table, type TableBodyProps, type TableCellProps, type TableColumnProps, type TableHeadProps, type TablePaginationProps, type TableProps, type TableRowProps, type TableRowTrayProps, type TableSearchProps, type TableTrayProps, Tabs, type TabsContextValue, type TabsListProps, type TabsPanelProps, type TabsPanelsProps, type TabsProps, type TabsTabProps, type TabsVariant, Text, type TextProps, Textarea, type TextareaProps, TimeGrid, type TimeGridProps, type TimeGridTone, TimePicker, type TimePickerProps, Timeline, type TimelineBlockProps, type TimelineEvent, type TimelineItemProps, type TimelineOrientation, type TimelineProps, type TimelineVariant, Toast, type ToastContextValue, type ToastData, type ToastPosition, type ToastProviderProps, type ToastVariant, Tooltip, type TooltipProps, TreeNav, type TreeNavContextValue, type TreeNavProps, type TreeNodeData, type TreeNodeProps, type Variant, VideoViewer, type VideoViewerProps, applyTone, cn, configureIcons, contentEditableAdapter, controlledAdapter, find, hasSkinTones, inputAdapter, registerExtension, registerExtensions, registerIconAddendum, registerIconSet, registerIcons, resolve, resolveMediaType, sanitizeHref, sanitizeHtml, search, skinTones, textareaAdapter, useAccordion, useAccordionPanel, useAccordionSection, useAnimation, useCarousel, useCommand, useContextMenu, useControllableState, useDropdown, useEditor, useEscapeKey, useFieldMode, useFileBrowser, useFileUpload, useFloatingPosition, useFocusTrap, useId, useKanban, useMenu, useMobileMenu, useModal, useNavbar, useNodeRegistry, useOutsideClick, usePanZoom, usePopover, useSidebar, useTabs, useToast, useTreeNav };
3753
+ export { Accordion, type AccordionContentProps, type AccordionContextValue, type AccordionItemProps, type AccordionOrientation, AccordionPanel, AccordionPanelContent, type AccordionPanelContentProps, type AccordionPanelProps, AccordionPanelSection, type AccordionPanelSectionProps, AccordionPanelTrigger, type AccordionPanelTriggerProps, type AccordionProps, type AccordionTriggerProps, Action, type ActionColor, type ActionProps, type AffixPosition, AudioViewer, type AudioViewerProps, Autocomplete, type AutocompleteOption, type AutocompleteProps, Avatar, type AvatarProps, Badge, type BadgeProps, Brand, type BrandProps, Breadcrumbs, type BreadcrumbsItemProps, type BreadcrumbsProps, Button, type ButtonColor, type ButtonProps, Calendar, type CalendarMode, type CalendarProps, Callout, type CalloutProps, Card, type CardBodyProps, type CardFooterProps, type CardHeaderProps, type CardProps, Carousel, type CarouselContextValue, type CarouselControlsProps, type CarouselPanelsProps, type CarouselProps, type CarouselSlideProps, type CarouselStepsProps, type CarouselVariant, Chart, type ChartAreaProps, type ChartBarData, type ChartBarProps, type ChartCommonProps, type ChartDonutData, type ChartDonutProps, type ChartHorizontalBarProps, type ChartLineProps, type ChartPieData, type ChartPieProps, type ChartSeries, type ChartSparklineProps, type ChartStackedBarProps, ChatDrawer, type ChatDrawerProps, type ChatDrawerTab, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, CodeView, type CodeViewProps, type Color, ColorPicker, type ColorPickerProps, Command, type CommandContextValue, type CommandEmptyProps, type CommandGroupProps, type CommandInputProps, type CommandItemProps, type CommandListProps, type CommandProps, Composer, type ComposerProps, ContentRenderer, type ContentRendererProps, ContextMenu, type ContextMenuContentProps, type ContextMenuContextValue, type ContextMenuItemProps, type ContextMenuProps, type ContextMenuSeparatorProps, type ContextMenuTriggerProps, type ControlledAdapterHandle, DatePicker, type DatePickerProps, type DateRange, DisplayValue, type DisplayValueProps, type DropPosition, Dropdown, type DropdownContextValue, type DropdownItemProps, type DropdownItemsProps, type DropdownProps, type DropdownSeparatorProps, type DropdownTriggerProps, EMOJI_CATEGORY_ORDER, EMOJI_DATA, EMOJI_ENTRIES, Editor, type EditorAction, type EditorContentProps, type EditorContextValue, type EditorProps, type EditorSourceToggleProps, type EditorToolbarProps, Emoji, type EmojiCategory, type EmojiCategoryKey, type EmojiEntry, type EmojiFlatEntry, type EmojiProps, EmojiSelect, type EmojiSelectProps, FauxClient, type FauxClientProps, Field, type FieldMode, FieldModeContext, type FieldModeContextValue, type FieldProps, FileBrowser, type FileBrowserContextValue, type FileBrowserNodeProps, type FileBrowserPathBarProps, type FileBrowserProps, type FileBrowserProvider, type FileBrowserRow, type FileBrowserToolbarProps, type FileBrowserTreeProps, type FileEntry, type FileKind, type FileLoadStatus, type FileSelectMode, type FileSnapshotNode, type FileSort, type FileSortDirection, type FileSortField, FileUpload, type FileUploadContextValue, type FileUploadDropzoneProps, type FileUploadListProps, type FileUploadProps, Form, type FormProps, FormProvider, type FormProviderProps, Heading, type HeadingProps, Icon, type IconProps, type IconSet, ImageViewer, type ImageViewerProps, type ImageViewerViewport, Input, type InputAffixProps, type InputBaseProps, type InputOption, type InputOptionGroup, type InputProps, InputTag, type InputTagAdapter, type InputTagAdapterState, type InputTagProps, type InputTagTrigger, type InputTagTriggers, Kanban, type KanbanCardMoveHandler, type KanbanCardProps, type KanbanColumnHandleProps, type KanbanColumnMoveHandler, type KanbanColumnProps, type KanbanContextValue, type KanbanProps, MagicWand, type MagicWandAction, type MagicWandAppearance, type MagicWandProps, type MagicWandSelection, Marquee, type MarqueeDirection, type MarqueeProps, type MediaKind, MediaViewer, type MediaViewerProps, Menu, type MenuContextValue, type MenuGroupProps, type MenuItemProps, type MenuOrientation, type MenuProps, type MenuSubmenuProps, MobileMenu, type MobileMenuBottomBarProps, type MobileMenuContextValue, type MobileMenuFlyoutProps, type MobileMenuItemProps, type MobileMenuSide, type MobileMenuVariant, Modal, type ModalBodyProps, type ModalContextValue, type ModalFooterProps, type ModalHeaderProps, type ModalProps, MoodMeter, type MoodMeterProps, MultiSwitch, type MultiSwitchProps, Navbar, type NavbarBrandProps, type NavbarContextValue, type NavbarItemProps, type NavbarItemsProps, type NavbarProps, type NavbarToggleProps, type NodeRect, OtpInput, type OtpInputProps, Pagination, type PaginationProps, PdfViewer, type PdfViewerProps, Pillbox, type PillboxProps, type Placement, Popover, type PopoverContentProps, type PopoverContextValue, type PopoverProps, type PopoverTriggerProps, Portal, type PortalProps, Profile, type ProfileProps, Progress, type ProgressProps, type PromptAttachment, type PromptCmd, PromptInput, type PromptInputProps, type PromptMention, RadioGroup, type RadioGroupProps, ReasonTag, type ReasonTagProps, type ReasonTagSource, type ReasonTagTheme, type RenderExtension, type RenderExtensionProps, type ResolveMediaTypeInput, SKIN_TONES, type SectionRenderState, type SectionRenderable, Select, type SelectProps, Separator, type SeparatorProps, Sidebar, type SidebarCollapseMode, type SidebarContextValue, type SidebarGroupProps, type SidebarItemProps, type SidebarProps, type SidebarSubmenuProps, type SidebarToggleProps, type Size, Skeleton, type SkeletonProps, type SkinTone, Slider, type SliderProps, StickyNote, type StickyNoteColor, type StickyNoteProps, Switch, type SwitchProps, Table, type TableBodyProps, type TableCellProps, type TableColumnProps, type TableHeadProps, type TablePaginationProps, type TableProps, type TableRowProps, type TableRowTrayProps, type TableSearchProps, type TableTrayProps, Tabs, type TabsContextValue, type TabsListProps, type TabsPanelProps, type TabsPanelsProps, type TabsProps, type TabsTabProps, type TabsVariant, Text, type TextProps, Textarea, type TextareaProps, TimeGrid, type TimeGridProps, type TimeGridTone, TimePicker, type TimePickerProps, Timeline, type TimelineBlockProps, type TimelineEvent, type TimelineItemProps, type TimelineOrientation, type TimelineProps, type TimelineVariant, Toast, type ToastContextValue, type ToastData, type ToastPosition, type ToastProviderProps, type ToastVariant, Tooltip, type TooltipProps, TreeNav, type TreeNavContextValue, type TreeNavProps, type TreeNodeData, type TreeNodeProps, type Variant, VideoViewer, type VideoViewerProps, applyTone, cn, configureIcons, contentEditableAdapter, controlledAdapter, find, hasSkinTones, inputAdapter, registerExtension, registerExtensions, registerIconAddendum, registerIconSet, registerIcons, resolve, resolveMediaType, sanitizeHref, sanitizeHtml, search, skinTones, textareaAdapter, useAccordion, useAccordionPanel, useAccordionSection, useAnimation, useCarousel, useCommand, useContextMenu, useControllableState, useDropdown, useEditor, useEscapeKey, useFieldMode, useFileBrowser, useFileUpload, useFloatingPosition, useFocusTrap, useId, useKanban, useMenu, useMobileMenu, useModal, useNavbar, useNodeRegistry, useOutsideClick, usePanZoom, usePopover, useSidebar, useTabs, useToast, useTreeNav };
package/dist/index.js CHANGED
@@ -5,6 +5,7 @@ import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
5
5
  import { createPortal } from 'react-dom';
6
6
  import { X, ChevronUp, ChevronDown, ChevronLeft, ChevronRight, Search, Menu, File, Upload, PanelLeftOpen, PanelLeftClose, Loader2, ArrowUp, ArrowDown, Pencil, CircleAlert, RotateCw, Check, XCircle, AlertTriangle, Info } from 'lucide-react';
7
7
  import { marked } from 'marked';
8
+ import { tokenizeHtml, highlightCode, DARK_COLORS, LIGHT_COLORS } from '@particle-academy/fancy-file-commons';
8
9
 
9
10
  // src/components/Button/Button.tsx
10
11
  function cn(...inputs) {
@@ -11386,7 +11387,7 @@ function EditorToolbar({
11386
11387
  {
11387
11388
  "data-react-fancy-editor-toolbar": "",
11388
11389
  className: cn(
11389
- "flex items-center gap-0.5 border-b border-zinc-200 px-2 py-1.5 dark:border-zinc-700",
11390
+ "flex shrink-0 items-center gap-0.5 border-b border-zinc-200 px-2 py-1.5 dark:border-zinc-700",
11390
11391
  className
11391
11392
  ),
11392
11393
  children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -11428,6 +11429,98 @@ function EditorToolbarSeparator() {
11428
11429
  );
11429
11430
  }
11430
11431
  EditorToolbarSeparator.displayName = "EditorToolbarSeparator";
11432
+ function subscribeDark(callback) {
11433
+ const mq = window.matchMedia("(prefers-color-scheme: dark)");
11434
+ mq.addEventListener("change", callback);
11435
+ const observer = new MutationObserver(callback);
11436
+ observer.observe(document.documentElement, {
11437
+ attributes: true,
11438
+ attributeFilter: ["class"]
11439
+ });
11440
+ return () => {
11441
+ mq.removeEventListener("change", callback);
11442
+ observer.disconnect();
11443
+ };
11444
+ }
11445
+ function darkSnapshot() {
11446
+ return document.documentElement.classList.contains("dark") || window.matchMedia("(prefers-color-scheme: dark)").matches;
11447
+ }
11448
+ function useIsDark() {
11449
+ return useSyncExternalStore(subscribeDark, darkSnapshot, () => false);
11450
+ }
11451
+ var TEXT_METRICS = "m-0 p-3 font-mono text-xs leading-relaxed";
11452
+ function CodeView({
11453
+ value,
11454
+ onChange,
11455
+ language = "plaintext",
11456
+ readOnly = false,
11457
+ placeholder,
11458
+ minHeight = 120,
11459
+ maxHeight,
11460
+ className
11461
+ }) {
11462
+ const textareaRef = useRef(null);
11463
+ const isDark = useIsDark();
11464
+ const colors = isDark ? DARK_COLORS : LIGHT_COLORS;
11465
+ const highlighted = useMemo(() => {
11466
+ const tokens = language === "html" ? tokenizeHtml(value) : [];
11467
+ return highlightCode(value, tokens, colors);
11468
+ }, [value, language, colors]);
11469
+ useEffect(() => {
11470
+ const el = textareaRef.current;
11471
+ if (!el) return;
11472
+ el.style.height = "auto";
11473
+ el.style.height = `${el.scrollHeight}px`;
11474
+ }, [value]);
11475
+ const editable = !readOnly && !!onChange;
11476
+ return /* @__PURE__ */ jsx(
11477
+ "div",
11478
+ {
11479
+ "data-react-fancy-code-view": "",
11480
+ className: cn("relative overflow-auto", className),
11481
+ style: { backgroundColor: colors.background, color: colors.foreground, minHeight, maxHeight },
11482
+ children: /* @__PURE__ */ jsxs("div", { className: "relative min-h-full", children: [
11483
+ /* @__PURE__ */ jsx(
11484
+ "pre",
11485
+ {
11486
+ "aria-hidden": "true",
11487
+ className: cn("pointer-events-none absolute inset-0 overflow-hidden border-none", TEXT_METRICS),
11488
+ style: { whiteSpace: "pre-wrap", overflowWrap: "break-word" },
11489
+ children: /* @__PURE__ */ jsx("code", { dangerouslySetInnerHTML: { __html: highlighted + "\n" } })
11490
+ }
11491
+ ),
11492
+ placeholder && value.length === 0 && /* @__PURE__ */ jsx("div", { className: cn("pointer-events-none absolute left-0 top-0 opacity-40", TEXT_METRICS), children: placeholder }),
11493
+ /* @__PURE__ */ jsx(
11494
+ "textarea",
11495
+ {
11496
+ ref: textareaRef,
11497
+ "data-react-fancy-code-view-input": "",
11498
+ value,
11499
+ onChange: editable ? (e) => onChange(e.target.value) : void 0,
11500
+ readOnly: !editable,
11501
+ spellCheck: false,
11502
+ autoComplete: "off",
11503
+ autoCorrect: "off",
11504
+ autoCapitalize: "off",
11505
+ "aria-label": placeholder,
11506
+ className: cn(
11507
+ "relative block w-full resize-none border-none bg-transparent text-transparent outline-none",
11508
+ TEXT_METRICS
11509
+ ),
11510
+ style: {
11511
+ caretColor: colors.cursorColor,
11512
+ overflow: "hidden",
11513
+ whiteSpace: "pre-wrap",
11514
+ overflowWrap: "break-word",
11515
+ minHeight
11516
+ }
11517
+ }
11518
+ )
11519
+ ] })
11520
+ }
11521
+ );
11522
+ }
11523
+ CodeView.displayName = "CodeView";
11431
11524
 
11432
11525
  // src/components/Editor/editor.utils.ts
11433
11526
  var proseClasses = [
@@ -11650,24 +11743,14 @@ function EditorContent({ className, maxHeight, sourceClassName }) {
11650
11743
  );
11651
11744
  if (showSource) {
11652
11745
  return /* @__PURE__ */ jsx(
11653
- "textarea",
11746
+ CodeView,
11654
11747
  {
11655
- "data-react-fancy-editor-source": "",
11656
11748
  value: _sourceValue,
11657
- onChange: (e) => _onSourceInput(e.target.value),
11658
- spellCheck: false,
11749
+ onChange: _onSourceInput,
11750
+ language: outputFormat === "html" ? "html" : "plaintext",
11659
11751
  placeholder,
11660
- "aria-label": `${outputFormat === "markdown" ? "Markdown" : "HTML"} source`,
11661
- style: {
11662
- maxHeight: maxHeight ? `${maxHeight}px` : void 0
11663
- },
11664
- className: cn(
11665
- "block min-h-[120px] w-full resize-y px-4 py-3 font-mono text-xs leading-relaxed outline-none",
11666
- "bg-zinc-50 text-zinc-800 focus:outline-none dark:bg-zinc-900 dark:text-zinc-200",
11667
- "placeholder:text-zinc-400",
11668
- maxHeight && "overflow-y-auto",
11669
- sourceClassName
11670
- )
11752
+ maxHeight,
11753
+ className: cn("min-h-0 flex-auto", sourceClassName)
11671
11754
  }
11672
11755
  );
11673
11756
  }
@@ -11685,9 +11768,8 @@ function EditorContent({ className, maxHeight, sourceClassName }) {
11685
11768
  maxHeight: maxHeight ? `${maxHeight}px` : void 0
11686
11769
  },
11687
11770
  className: cn(
11688
- "min-h-[120px] px-4 py-3 text-sm outline-none",
11771
+ "min-h-[120px] flex-auto overflow-y-auto px-4 py-3 text-sm outline-none",
11689
11772
  "focus:outline-none",
11690
- maxHeight && "overflow-y-auto",
11691
11773
  proseClasses,
11692
11774
  extClasses,
11693
11775
  "empty:before:content-[attr(data-placeholder)] empty:before:text-zinc-400 empty:before:pointer-events-none",
@@ -11987,7 +12069,7 @@ function EditorRoot({
11987
12069
  "data-react-fancy-editor": "",
11988
12070
  "data-mode": "edit",
11989
12071
  className: cn(
11990
- "overflow-hidden rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900",
12072
+ "flex flex-col overflow-hidden rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900",
11991
12073
  className
11992
12074
  ),
11993
12075
  children
@@ -12961,6 +13043,7 @@ function TreeNode({ node, depth }) {
12961
13043
  indentSize,
12962
13044
  showIcons,
12963
13045
  draggable,
13046
+ dragCursor,
12964
13047
  dragState,
12965
13048
  setDragState,
12966
13049
  onNodeMove,
@@ -13091,7 +13174,12 @@ function TreeNode({ node, depth }) {
13091
13174
  isSelected ? "bg-blue-500/15 text-blue-600 dark:text-blue-400" : "text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800",
13092
13175
  node.disabled && "pointer-events-none opacity-40",
13093
13176
  isDragging && "opacity-50",
13094
- canDrag && "cursor-grab active:cursor-grabbing",
13177
+ // Grab affordance. By default (`dragCursor="none"`) the row keeps its
13178
+ // normal click cursor on hover — no open-hand "move me" cursor before
13179
+ // any drag — and only shows the closed-hand `grabbing` cursor while a
13180
+ // drag is actually underway (mousedown/drag). `dragCursor="grab"` opts
13181
+ // back into the always-on grab cursor for whole-row drag handles (#14).
13182
+ canDrag && (dragCursor === "grab" ? "cursor-grab active:cursor-grabbing" : "active:cursor-grabbing"),
13095
13183
  isDropTarget && dropPosition === "inside" && "bg-blue-500/10 ring-1 ring-blue-500/30 ring-inset"
13096
13184
  ),
13097
13185
  style: { paddingLeft },
@@ -13147,6 +13235,7 @@ function TreeNavRoot({
13147
13235
  defaultExpandAll = false,
13148
13236
  indentSize = 16,
13149
13237
  showIcons = true,
13238
+ dragCursor = "none",
13150
13239
  className
13151
13240
  }) {
13152
13241
  const [internalExpanded, setInternalExpanded] = useState(() => {
@@ -13191,6 +13280,7 @@ function TreeNavRoot({
13191
13280
  indentSize,
13192
13281
  showIcons,
13193
13282
  draggable,
13283
+ dragCursor,
13194
13284
  dragState,
13195
13285
  setDragState,
13196
13286
  onNodeMove,
@@ -13208,6 +13298,7 @@ function TreeNavRoot({
13208
13298
  indentSize,
13209
13299
  showIcons,
13210
13300
  draggable,
13301
+ dragCursor,
13211
13302
  dragState,
13212
13303
  onNodeMove,
13213
13304
  acceptExternalDrops,
@@ -15963,6 +16054,6 @@ var MediaViewer = forwardRef(
15963
16054
  );
15964
16055
  MediaViewer.displayName = "MediaViewer";
15965
16056
 
15966
- export { Accordion, AccordionPanel, AccordionPanelContent, AccordionPanelSection, AccordionPanelTrigger, Action, AudioViewer, Autocomplete, Avatar, Badge, Brand, Breadcrumbs, Button, Calendar, Callout, Card, Carousel, Chart, ChatDrawer, Checkbox, CheckboxGroup, ColorPicker, Command, Composer, ContentRenderer, ContextMenu, DatePicker, DisplayValue, Dropdown, EMOJI_CATEGORY_ORDER, EMOJI_DATA, EMOJI_ENTRIES, Editor, Emoji, EmojiSelect, FauxClient, Field, FieldModeContext, FileBrowser, FileUpload, Form, FormProvider, Heading, Icon, ImageViewer, Input, InputTag, Kanban, MagicWand, Marquee, MediaViewer, Menu2 as Menu, MobileMenu, Modal, MoodMeter, MultiSwitch, Navbar, OtpInput, Pagination, PdfViewer, Pillbox, Popover, Portal, Profile, Progress, PromptInput, RadioGroup, ReasonTag, SKIN_TONES, Select, Separator, Sidebar, Skeleton, Slider, StickyNote, Switch, Table, Tabs, Text, Textarea, TimeGrid, TimePicker, Timeline, Toast, Tooltip, TreeNav, VideoViewer, applyTone, cn, configureIcons, contentEditableAdapter, controlledAdapter, find, hasSkinTones, inputAdapter, registerExtension, registerExtensions, registerIconAddendum, registerIconSet, registerIcons, resolve, resolveMediaType, sanitizeHref, sanitizeHtml, search, skinTones, textareaAdapter, useAccordion, useAccordionPanel, useAccordionSection, useAnimation, useCarousel, useCommand, useContextMenu, useControllableState, useDropdown, useEditor, useEscapeKey, useFieldMode, useFileBrowser, useFileUpload, useFloatingPosition, useFocusTrap, useId12 as useId, useKanban, useMenu, useMobileMenu, useModal, useNavbar, useNodeRegistry, useOutsideClick, usePanZoom, usePopover, useSidebar, useTabs, useToast, useTreeNav };
16057
+ export { Accordion, AccordionPanel, AccordionPanelContent, AccordionPanelSection, AccordionPanelTrigger, Action, AudioViewer, Autocomplete, Avatar, Badge, Brand, Breadcrumbs, Button, Calendar, Callout, Card, Carousel, Chart, ChatDrawer, Checkbox, CheckboxGroup, CodeView, ColorPicker, Command, Composer, ContentRenderer, ContextMenu, DatePicker, DisplayValue, Dropdown, EMOJI_CATEGORY_ORDER, EMOJI_DATA, EMOJI_ENTRIES, Editor, Emoji, EmojiSelect, FauxClient, Field, FieldModeContext, FileBrowser, FileUpload, Form, FormProvider, Heading, Icon, ImageViewer, Input, InputTag, Kanban, MagicWand, Marquee, MediaViewer, Menu2 as Menu, MobileMenu, Modal, MoodMeter, MultiSwitch, Navbar, OtpInput, Pagination, PdfViewer, Pillbox, Popover, Portal, Profile, Progress, PromptInput, RadioGroup, ReasonTag, SKIN_TONES, Select, Separator, Sidebar, Skeleton, Slider, StickyNote, Switch, Table, Tabs, Text, Textarea, TimeGrid, TimePicker, Timeline, Toast, Tooltip, TreeNav, VideoViewer, applyTone, cn, configureIcons, contentEditableAdapter, controlledAdapter, find, hasSkinTones, inputAdapter, registerExtension, registerExtensions, registerIconAddendum, registerIconSet, registerIcons, resolve, resolveMediaType, sanitizeHref, sanitizeHtml, search, skinTones, textareaAdapter, useAccordion, useAccordionPanel, useAccordionSection, useAnimation, useCarousel, useCommand, useContextMenu, useControllableState, useDropdown, useEditor, useEscapeKey, useFieldMode, useFileBrowser, useFileUpload, useFloatingPosition, useFocusTrap, useId12 as useId, useKanban, useMenu, useMobileMenu, useModal, useNavbar, useNodeRegistry, useOutsideClick, usePanZoom, usePopover, useSidebar, useTabs, useToast, useTreeNav };
15967
16058
  //# sourceMappingURL=index.js.map
15968
16059
  //# sourceMappingURL=index.js.map