@noya-app/noya-designsystem 0.1.56 → 0.1.57

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.
@@ -7,12 +7,12 @@
7
7
  CLI Target: esnext
8
8
  CJS Build start
9
9
  ESM Build start
10
- CJS dist/index.js 398.83 KB
11
- CJS dist/index.js.map 782.38 KB
12
- CJS ⚡️ Build success in 86ms
13
- ESM dist/index.mjs 376.55 KB
14
- ESM dist/index.mjs.map 782.53 KB
15
- ESM ⚡️ Build success in 87ms
10
+ CJS dist/index.js 399.23 KB
11
+ CJS dist/index.js.map 783.78 KB
12
+ CJS ⚡️ Build success in 89ms
13
+ ESM dist/index.mjs 376.87 KB
14
+ ESM dist/index.mjs.map 783.92 KB
15
+ ESM ⚡️ Build success in 89ms
16
16
  DTS Build start
17
17
  Browserslist: caniuse-lite is outdated. Please run:
18
18
  npx update-browserslist-db@latest
@@ -20,8 +20,8 @@ Browserslist: caniuse-lite is outdated. Please run:
20
20
 
21
21
  Rebuilding...
22
22
 
23
- Done in 367ms.
23
+ Done in 380ms.
24
24
 
25
- DTS ⚡️ Build success in 6165ms
26
- DTS dist/index.d.ts 96.58 KB
27
- DTS dist/index.d.mts 96.58 KB
25
+ DTS ⚡️ Build success in 6452ms
26
+ DTS dist/index.d.ts 96.88 KB
27
+ DTS dist/index.d.mts 96.88 KB
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @noya-app/noya-designsystem
2
2
 
3
+ ## 0.1.57
4
+
5
+ ### Patch Changes
6
+
7
+ - 9e59d48: Drag improvements
8
+
3
9
  ## 0.1.56
4
10
 
5
11
  ### Patch Changes
package/dist/index.d.mts CHANGED
@@ -5,7 +5,7 @@ import * as Icons from '@noya-app/noya-icons';
5
5
  export { Icons };
6
6
  import tailwindConfig from '@noya-app/noya-tailwind-config';
7
7
  import * as _noya_app_noya_geometry from '@noya-app/noya-geometry';
8
- import { Size, Rect, Point as Point$1 } from '@noya-app/noya-geometry';
8
+ import { Point as Point$1, Size, Rect } from '@noya-app/noya-geometry';
9
9
  import { UniqueIdentifier, Active, Over, CollisionDetection } from '@dnd-kit/core';
10
10
  import { Property } from 'csstype';
11
11
  import * as _noya_app_noya_designsystem from '@noya-app/noya-designsystem';
@@ -717,15 +717,15 @@ type AcceptsFromList = ({ sourceListId, targetListId, }: {
717
717
  targetListId: string;
718
718
  }) => boolean;
719
719
  interface DragItem {
720
- id: UniqueIdentifier;
721
- listId: string;
722
- index: number;
723
- }
724
- interface DropTarget {
725
- id: UniqueIdentifier;
720
+ itemId: UniqueIdentifier;
726
721
  listId: string;
727
722
  index: number;
728
723
  }
724
+ type DragState = {
725
+ source: DragItem | null;
726
+ target: DragItem | null;
727
+ indicator: RelativeDropPosition | null;
728
+ };
729
729
  declare const normalizeListTargetIndex: (index: number, position: "above" | "below") => number;
730
730
  declare const defaultAcceptsDrop: DropValidator;
731
731
  type SortableItemContextProps = {
@@ -753,6 +753,37 @@ type ValidateDropIndicatorParams = {
753
753
  targetListId: string;
754
754
  };
755
755
  declare function validateDropIndicator({ acceptsDrop, keys, activeId, overId, offsetStart, elementStart, elementSize, sourceListId, targetListId, }: ValidateDropIndicatorParams): RelativeDropPosition | undefined;
756
+ declare function createDragItemKey(listId: string, itemId: UniqueIdentifier): string;
757
+ declare function parseDragItemKey(key: string): {
758
+ listId: string;
759
+ itemId: UniqueIdentifier;
760
+ };
761
+
762
+ type GetDropIndicatorParameters = {
763
+ absolutePosition: Point$1;
764
+ active: Active;
765
+ over: Over;
766
+ sourceListId: string;
767
+ targetListId: string;
768
+ };
769
+ interface RegisteredList {
770
+ id: string;
771
+ keys: UniqueIdentifier[];
772
+ onMoveItem: MoveDragItemHandler;
773
+ renderOverlay?: (id: UniqueIdentifier) => React__default.ReactNode;
774
+ acceptsFromList: AcceptsFromList;
775
+ acceptsDrop: AcceptsDrop;
776
+ getDropIndicator: (parameters: GetDropIndicatorParameters) => RelativeDropPosition | undefined;
777
+ }
778
+ interface DragRegistrationContextType {
779
+ registerList: (list: RegisteredList) => void;
780
+ unregisterList: (listId: string) => void;
781
+ }
782
+ type ActiveDragContextType = DragState;
783
+ type SharedDragProps = {
784
+ dragRegistrationContext: React__default.Context<DragRegistrationContextType | null>;
785
+ activeDragContext: React__default.Context<ActiveDragContextType | null>;
786
+ };
756
787
 
757
788
  type ListRowMarginType = "none" | "top" | "bottom" | "vertical";
758
789
  type ListRowPosition = "only" | "first" | "middle" | "last";
@@ -869,6 +900,8 @@ type ListViewRootProps = {
869
900
  onDrop?: React__default.DragEventHandler<HTMLDivElement>;
870
901
  renderEmptyState?: () => ReactNode;
871
902
  getDropTargetParentIndex?: SortableItemContextProps["getDropTargetParentIndex"];
903
+ sharedDragProps?: SharedDragProps;
904
+ sortableId?: string;
872
905
  };
873
906
  declare namespace ListView {
874
907
  const RowTitle: React__default.MemoExoticComponent<({ className, children, ...props }: {
@@ -968,6 +1001,8 @@ interface CollectionProps<T, M extends string = string> {
968
1001
  /** @default false */
969
1002
  sortable?: boolean;
970
1003
  dragIndicatorStyle?: ListViewRowProps<M>["dragIndicatorStyle"];
1004
+ sharedDragProps?: SharedDragProps;
1005
+ sortableId?: string;
971
1006
  }
972
1007
  declare const Collection: <T, M extends string = string>(props: CollectionProps<T, M> & React__default.RefAttributes<CollectionRef>) => React__default.ReactElement | null;
973
1008
  type CollectionItemSize = "xxs" | "xs" | "small" | "medium" | "large" | "xl";
@@ -1784,40 +1819,11 @@ interface Props$4 {
1784
1819
  }
1785
1820
  declare const Slider: React__default.NamedExoticComponent<Props$4>;
1786
1821
 
1787
- type GetDropIndicatorParameters = {
1788
- absolutePosition: Point$1;
1789
- active: Active;
1790
- over: Over;
1791
- sourceListId: string;
1792
- targetListId: string;
1793
- };
1794
- interface RegisteredList {
1795
- id: string;
1796
- keys: UniqueIdentifier[];
1797
- onMoveItem: MoveDragItemHandler;
1798
- renderOverlay?: (id: UniqueIdentifier) => React__default.ReactNode;
1799
- acceptsFromList: AcceptsFromList;
1800
- acceptsDrop: AcceptsDrop;
1801
- getDropIndicator: (parameters: GetDropIndicatorParameters) => RelativeDropPosition | undefined;
1802
- }
1803
- interface DragRegistrationContextType {
1804
- registerList: (list: RegisteredList) => void;
1805
- unregisterList: (listId: string) => void;
1806
- }
1807
- type ActiveDragContextType = {
1808
- activeItem: DragItem | null;
1809
- delta: Point$1;
1810
- };
1811
- type SharedDragProviderContexts = {
1812
- dragRegistrationContext: React__default.Context<DragRegistrationContextType | null>;
1813
- activeDragContext: React__default.Context<ActiveDragContextType | null>;
1814
- };
1815
-
1816
1822
  type SharedDragProviderProps = {
1817
1823
  children: React$1.ReactNode;
1818
- contexts?: SharedDragProviderContexts;
1824
+ sharedDragProps?: SharedDragProps;
1819
1825
  };
1820
- declare function SharedDragProvider({ children, contexts, }: SharedDragProviderProps): React$1.JSX.Element;
1826
+ declare function SharedDragProvider({ children, sharedDragProps, }: SharedDragProviderProps): React$1.JSX.Element;
1821
1827
  declare function withDragProvider<T extends object>(Component: React$1.ComponentType<T>): (props: T) => React$1.JSX.Element;
1822
1828
  declare const getItemFirstCollisionDetection: (registeredListIds: string[]) => CollisionDetection;
1823
1829
 
@@ -1837,7 +1843,7 @@ interface RootProps {
1837
1843
  acceptsFromList?: AcceptsFromList;
1838
1844
  acceptsDrop?: DropValidator;
1839
1845
  getDropTargetParentIndex?: (index: number) => number | undefined;
1840
- sharedDragProviderContexts?: SharedDragProviderContexts;
1846
+ sharedDragProps?: SharedDragProps;
1841
1847
  containerRef?: React$1.RefObject<HTMLElement>;
1842
1848
  }
1843
1849
  declare function SortableItem<TElement extends HTMLElement>({ id, disabled, children, }: {
@@ -1845,7 +1851,7 @@ declare function SortableItem<TElement extends HTMLElement>({ id, disabled, chil
1845
1851
  disabled?: boolean;
1846
1852
  children: (props: ItemChildrenProps<TElement>) => React$1.ReactNode;
1847
1853
  }): React$1.ReactNode;
1848
- declare function SortableRoot_({ id: idProp, keys, onMoveItem, renderOverlay, acceptsFromList, acceptsDrop, axis, children, getDropTargetParentIndex, sharedDragProviderContexts, containerRef, }: RootProps): React$1.JSX.Element;
1854
+ declare function SortableRoot_({ id: idProp, keys: keysProp, onMoveItem, renderOverlay, acceptsFromList, acceptsDrop, axis, children, getDropTargetParentIndex, sharedDragProps, containerRef, }: RootProps): React$1.JSX.Element;
1849
1855
  interface SortableProps<TItem, TElement extends HTMLElement> extends Omit<RootProps, "children" | "keys" | "renderOverlay"> {
1850
1856
  items: TItem[];
1851
1857
  keyExtractor: (item: TItem) => UniqueIdentifier;
@@ -1861,8 +1867,8 @@ declare const Sortable: (<TItem, TElement extends HTMLElement>({ items, keyExtra
1861
1867
 
1862
1868
  declare function createSharedDrag(): {
1863
1869
  Provider: typeof SharedDragProvider;
1864
- props: SharedDragProviderContexts;
1865
1870
  Sortable: <TItem, TElement extends HTMLElement>(props: SortableProps<TItem, TElement>) => React$1.ReactNode;
1871
+ props: SharedDragProps;
1866
1872
  };
1867
1873
 
1868
1874
  interface Props$3 {
@@ -2422,4 +2428,4 @@ interface ToolbarProps<T extends string = string> {
2422
2428
  }
2423
2429
  declare function Toolbar<T extends string = string>({ children, logo, leftMenuItems, rightMenuItems, onSelectMenuItem, shouldBindKeyboardShortcuts, }: ToolbarProps<T>): React__default.JSX.Element;
2424
2430
 
2425
- export { AIAssistantInput, AIAssistantLayout, AIAssistantLoadingIndicator, type AcceptsDrop, type AcceptsDropOptions, type AcceptsFromList, ActionMenu, ActivityIndicator, AnimatePresence, type AnimatePresenceProps, Avatar, type AvatarProps, AvatarStack, Banner, type BannerProps, type BaseComboboxProps, BaseToolbar, type BaseToolbarProps, Body, BreadcrumbSlash, BreadcrumbText, Button, type ButtonRootProps, CHECKBOX_INDENT_WIDTH, CHECKBOX_RIGHT_INSET, CHECKBOX_WIDTH, CONTENT_AREA_ID, Checkbox$1 as Checkbox, Chip, type ChipProps, Collection, type CollectionItemSize, type CollectionProps, type CollectionRef, type CollectionRenderActionProps, type CollectionThumbnailProps, type CollectionThumbnailSize, type CollectionViewType, ColorSwatch, ColorSwatchControl, type ColorSwatchSize, Combobox, ComboboxMenu, type ComboboxProps, type ComboboxRef, ComboboxState, type ComboboxStateSnapshot, CommandPalette, ConnectedUsersMenuLayout, ContextMenu, type DesignSystemConfigurationContextValue, DesignSystemConfigurationProvider, type DetectSizeType, Dialog, type DialogContextValue, DialogProvider, DimensionInput, type DimensionValue, Divider, DividerVertical, type DragIndicatorStyleProps, type DragItem, DraggableMenuButton, Drawer, type DrawerProps, type DropTarget, type DropValidator, DropdownMenu, type DropdownRootProps, EDITOR_PANEL_GROUP_ID, type EditableRowProps, EditableText, type EditableTextRef, type ExtractMenuItemType, Fade, type FadeDirection, type FadeProps, FileExplorerCollection, FileExplorerDetail, FileExplorerEmptyState, FileExplorerLayout, FileExplorerUploadButton, FillInputField, FillPreviewBackground, FloatingWindow, FloatingWindowProvider, FullscreenDialog, type GlobalInputBlurContextValue, GlobalInputBlurProvider, GradientPicker, Grid, GridView, Heading1, Heading2, Heading3, Heading4, Heading5, type HoverEvent, type HoverEvents, type HoverProps, type IDialog, INPUT_HEIGHT, type IScoredItem, type ISearchCompletionMenu, type IToken, type IVirtualizedList, IconButton, type IconName, type ImageDataContextValue, ImageDataProvider, IndentContext, InputField, type InputFieldInputProps, type InputFieldProps, type InputFieldSize, InspectorContainer, InspectorPrimitives, Italic, KeyboardShortcut, LEFT_SIDEBAR_ID, Label, LabelContext, type LabelPosition, LabelPositionContext, type LabelPositionContextValue, type LabelProps, LabelWidthContext, type LabelWidthContextValue, LabeledElementView, LabeledField, type LayoutProps, List, type ListRowMarginType, type ListRowPosition, ListView, type ListViewItemInfo, type ListViewRootProps, type ListViewRowProps, Logo, type MatchRange, MediaThumbnail, type MenuComponents, type MenuConfig, type MenuItem, type MenuItemIcon, type MenuItemProps, type MenuItemRole, type MenuProps, MenuViewport, Message, type MessageProps, type MoveDragItemHandler, type MoveTreeItemOptions, type NonSelectableMenuItem, type OpenPortalControlsContextValue, type OpenPortalsContextValue, OpenPortalsProvider, type OptionModeOnlyProps, type OptionModeProps, type Optional, type PanelLayoutState, PatternPreviewBackground, type PercentageSidebarOptions, PipelineResultLayout, PipelineResultLink, Popover, type PortalScopeContextValue, PortalScopeProvider, Progress, RIGHT_SIDEBAR_ID, type RelativeDropPosition, SUPPORTED_CANVAS_UPLOAD_TYPES, SUPPORTED_IMAGE_UPLOAD_TYPES, type ScoredMenuItem, ScrollArea, SearchCompletionMenu, Section$1 as Section, SectionHeader$1 as SectionHeader, type SectionHeaderMenuItem, type SectionProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlProps, SelectMenu, type SelectableMenuItem, SelectionToolbarContainer, type SeparatorItem, type SetNumberMode, SharedDragProvider, type SideOptions, type SideType, type SidebarRef, type SketchPattern, Slider, Small, Sortable, SortableItemContext, type SortableItemContextProps, type SortableProps, Spacer, type StringModeOnlyProps, type StringModeProps, type SubMenuItem, type SupportedCanvasUploadType, type SupportedImageUploadType, Switch, Text$1 as Text, TextArea, TextAreaRow, type TextProps, type Theme, type ThemeColor, Toast, ToastProvider, type TokenValue, Toolbar, ToolbarMenu, ToolbarMenuButton, ToolbarMenuDropdown, ToolbarMenuItem, type ToolbarProps, Tooltip, TreeView, type UseThemeReturnType, UserAvatar, UserPointer, type UserPointerProps, type ValidateDropIndicatorParams, WorkspaceLayout, type WorkspaceLayoutProps, type WorkspaceLayoutRef, acceptsDrop, colorForStringValues, colorFromString, colorSwatchSizeMap, createSectionedMenu, createSharedDrag, cssVarNames, cssVars, cx, defaultAcceptsDrop, filterWithGroupedSections, fuzzyFilter, fuzzyScore, fuzzyTokenize, getClosestPortalScope, getFieldSpacing, getGradientBackground, getGridSize, getItemFirstCollisionDetection, getKeyboardShortcutsForMenuItems, getMenuItemKey, getNewValue, getNextIndex, getPipelineResultLink, getThumbnailColors, isMenuItemSectionHeader, isNonSelectableMenuItem, isSelectableMenuItem, isSelectableMenuItemWithScore, labeledFieldStyles, mediaQuery, mergeConflictingClassNames, moveTreeItem, normalizeListTargetIndex, popoverStyle, portalScopeDataSetName, portalScopePropName, portalScopeProps, renderIcon, rgbaToSketchColor, separator, size, sketchColorToHex, sketchColorToRgba, sketchColorToRgbaString, styles, textStyles, updateSelection, useAutoResize, useComboboxState, useCurrentFloatingWindowInternal, useDesignSystemConfiguration, useDialogContainsElement, useDialogContext, useFloatingWindowManager, useGlobalInputBlur, useGlobalInputBlurListener, useGlobalInputBlurTrigger, useHasOpenPortals, useHover, useImageData, useIndent, useInputFieldContext, useLabel, useLabelPosition, useLabelWidth, useOpenConfirmationDialog, useOpenDialog, useOpenInputDialog, useOpenPortalsControls, usePlatform, usePlatformModKey, usePortalScopeId, usePreservePanelSize, useTheme, validateDropIndicator, withDragProvider, withSeparatorElements };
2431
+ export { AIAssistantInput, AIAssistantLayout, AIAssistantLoadingIndicator, type AcceptsDrop, type AcceptsDropOptions, type AcceptsFromList, ActionMenu, ActivityIndicator, AnimatePresence, type AnimatePresenceProps, Avatar, type AvatarProps, AvatarStack, Banner, type BannerProps, type BaseComboboxProps, BaseToolbar, type BaseToolbarProps, Body, BreadcrumbSlash, BreadcrumbText, Button, type ButtonRootProps, CHECKBOX_INDENT_WIDTH, CHECKBOX_RIGHT_INSET, CHECKBOX_WIDTH, CONTENT_AREA_ID, Checkbox$1 as Checkbox, Chip, type ChipProps, Collection, type CollectionItemSize, type CollectionProps, type CollectionRef, type CollectionRenderActionProps, type CollectionThumbnailProps, type CollectionThumbnailSize, type CollectionViewType, ColorSwatch, ColorSwatchControl, type ColorSwatchSize, Combobox, ComboboxMenu, type ComboboxProps, type ComboboxRef, ComboboxState, type ComboboxStateSnapshot, CommandPalette, ConnectedUsersMenuLayout, ContextMenu, type DesignSystemConfigurationContextValue, DesignSystemConfigurationProvider, type DetectSizeType, Dialog, type DialogContextValue, DialogProvider, DimensionInput, type DimensionValue, Divider, DividerVertical, type DragIndicatorStyleProps, type DragItem, type DragState, DraggableMenuButton, Drawer, type DrawerProps, type DropValidator, DropdownMenu, type DropdownRootProps, EDITOR_PANEL_GROUP_ID, type EditableRowProps, EditableText, type EditableTextRef, type ExtractMenuItemType, Fade, type FadeDirection, type FadeProps, FileExplorerCollection, FileExplorerDetail, FileExplorerEmptyState, FileExplorerLayout, FileExplorerUploadButton, FillInputField, FillPreviewBackground, FloatingWindow, FloatingWindowProvider, FullscreenDialog, type GlobalInputBlurContextValue, GlobalInputBlurProvider, GradientPicker, Grid, GridView, Heading1, Heading2, Heading3, Heading4, Heading5, type HoverEvent, type HoverEvents, type HoverProps, type IDialog, INPUT_HEIGHT, type IScoredItem, type ISearchCompletionMenu, type IToken, type IVirtualizedList, IconButton, type IconName, type ImageDataContextValue, ImageDataProvider, IndentContext, InputField, type InputFieldInputProps, type InputFieldProps, type InputFieldSize, InspectorContainer, InspectorPrimitives, Italic, KeyboardShortcut, LEFT_SIDEBAR_ID, Label, LabelContext, type LabelPosition, LabelPositionContext, type LabelPositionContextValue, type LabelProps, LabelWidthContext, type LabelWidthContextValue, LabeledElementView, LabeledField, type LayoutProps, List, type ListRowMarginType, type ListRowPosition, ListView, type ListViewItemInfo, type ListViewRootProps, type ListViewRowProps, Logo, type MatchRange, MediaThumbnail, type MenuComponents, type MenuConfig, type MenuItem, type MenuItemIcon, type MenuItemProps, type MenuItemRole, type MenuProps, MenuViewport, Message, type MessageProps, type MoveDragItemHandler, type MoveTreeItemOptions, type NonSelectableMenuItem, type OpenPortalControlsContextValue, type OpenPortalsContextValue, OpenPortalsProvider, type OptionModeOnlyProps, type OptionModeProps, type Optional, type PanelLayoutState, PatternPreviewBackground, type PercentageSidebarOptions, PipelineResultLayout, PipelineResultLink, Popover, type PortalScopeContextValue, PortalScopeProvider, Progress, RIGHT_SIDEBAR_ID, type RelativeDropPosition, SUPPORTED_CANVAS_UPLOAD_TYPES, SUPPORTED_IMAGE_UPLOAD_TYPES, type ScoredMenuItem, ScrollArea, SearchCompletionMenu, Section$1 as Section, SectionHeader$1 as SectionHeader, type SectionHeaderMenuItem, type SectionProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlProps, SelectMenu, type SelectableMenuItem, SelectionToolbarContainer, type SeparatorItem, type SetNumberMode, SharedDragProvider, type SideOptions, type SideType, type SidebarRef, type SketchPattern, Slider, Small, Sortable, SortableItemContext, type SortableItemContextProps, type SortableProps, Spacer, type StringModeOnlyProps, type StringModeProps, type SubMenuItem, type SupportedCanvasUploadType, type SupportedImageUploadType, Switch, Text$1 as Text, TextArea, TextAreaRow, type TextProps, type Theme, type ThemeColor, Toast, ToastProvider, type TokenValue, Toolbar, ToolbarMenu, ToolbarMenuButton, ToolbarMenuDropdown, ToolbarMenuItem, type ToolbarProps, Tooltip, TreeView, type UseThemeReturnType, UserAvatar, UserPointer, type UserPointerProps, type ValidateDropIndicatorParams, WorkspaceLayout, type WorkspaceLayoutProps, type WorkspaceLayoutRef, acceptsDrop, colorForStringValues, colorFromString, colorSwatchSizeMap, createDragItemKey, createSectionedMenu, createSharedDrag, cssVarNames, cssVars, cx, defaultAcceptsDrop, filterWithGroupedSections, fuzzyFilter, fuzzyScore, fuzzyTokenize, getClosestPortalScope, getFieldSpacing, getGradientBackground, getGridSize, getItemFirstCollisionDetection, getKeyboardShortcutsForMenuItems, getMenuItemKey, getNewValue, getNextIndex, getPipelineResultLink, getThumbnailColors, isMenuItemSectionHeader, isNonSelectableMenuItem, isSelectableMenuItem, isSelectableMenuItemWithScore, labeledFieldStyles, mediaQuery, mergeConflictingClassNames, moveTreeItem, normalizeListTargetIndex, parseDragItemKey, popoverStyle, portalScopeDataSetName, portalScopePropName, portalScopeProps, renderIcon, rgbaToSketchColor, separator, size, sketchColorToHex, sketchColorToRgba, sketchColorToRgbaString, styles, textStyles, updateSelection, useAutoResize, useComboboxState, useCurrentFloatingWindowInternal, useDesignSystemConfiguration, useDialogContainsElement, useDialogContext, useFloatingWindowManager, useGlobalInputBlur, useGlobalInputBlurListener, useGlobalInputBlurTrigger, useHasOpenPortals, useHover, useImageData, useIndent, useInputFieldContext, useLabel, useLabelPosition, useLabelWidth, useOpenConfirmationDialog, useOpenDialog, useOpenInputDialog, useOpenPortalsControls, usePlatform, usePlatformModKey, usePortalScopeId, usePreservePanelSize, useTheme, validateDropIndicator, withDragProvider, withSeparatorElements };
package/dist/index.d.ts CHANGED
@@ -5,7 +5,7 @@ import * as Icons from '@noya-app/noya-icons';
5
5
  export { Icons };
6
6
  import tailwindConfig from '@noya-app/noya-tailwind-config';
7
7
  import * as _noya_app_noya_geometry from '@noya-app/noya-geometry';
8
- import { Size, Rect, Point as Point$1 } from '@noya-app/noya-geometry';
8
+ import { Point as Point$1, Size, Rect } from '@noya-app/noya-geometry';
9
9
  import { UniqueIdentifier, Active, Over, CollisionDetection } from '@dnd-kit/core';
10
10
  import { Property } from 'csstype';
11
11
  import * as _noya_app_noya_designsystem from '@noya-app/noya-designsystem';
@@ -717,15 +717,15 @@ type AcceptsFromList = ({ sourceListId, targetListId, }: {
717
717
  targetListId: string;
718
718
  }) => boolean;
719
719
  interface DragItem {
720
- id: UniqueIdentifier;
721
- listId: string;
722
- index: number;
723
- }
724
- interface DropTarget {
725
- id: UniqueIdentifier;
720
+ itemId: UniqueIdentifier;
726
721
  listId: string;
727
722
  index: number;
728
723
  }
724
+ type DragState = {
725
+ source: DragItem | null;
726
+ target: DragItem | null;
727
+ indicator: RelativeDropPosition | null;
728
+ };
729
729
  declare const normalizeListTargetIndex: (index: number, position: "above" | "below") => number;
730
730
  declare const defaultAcceptsDrop: DropValidator;
731
731
  type SortableItemContextProps = {
@@ -753,6 +753,37 @@ type ValidateDropIndicatorParams = {
753
753
  targetListId: string;
754
754
  };
755
755
  declare function validateDropIndicator({ acceptsDrop, keys, activeId, overId, offsetStart, elementStart, elementSize, sourceListId, targetListId, }: ValidateDropIndicatorParams): RelativeDropPosition | undefined;
756
+ declare function createDragItemKey(listId: string, itemId: UniqueIdentifier): string;
757
+ declare function parseDragItemKey(key: string): {
758
+ listId: string;
759
+ itemId: UniqueIdentifier;
760
+ };
761
+
762
+ type GetDropIndicatorParameters = {
763
+ absolutePosition: Point$1;
764
+ active: Active;
765
+ over: Over;
766
+ sourceListId: string;
767
+ targetListId: string;
768
+ };
769
+ interface RegisteredList {
770
+ id: string;
771
+ keys: UniqueIdentifier[];
772
+ onMoveItem: MoveDragItemHandler;
773
+ renderOverlay?: (id: UniqueIdentifier) => React__default.ReactNode;
774
+ acceptsFromList: AcceptsFromList;
775
+ acceptsDrop: AcceptsDrop;
776
+ getDropIndicator: (parameters: GetDropIndicatorParameters) => RelativeDropPosition | undefined;
777
+ }
778
+ interface DragRegistrationContextType {
779
+ registerList: (list: RegisteredList) => void;
780
+ unregisterList: (listId: string) => void;
781
+ }
782
+ type ActiveDragContextType = DragState;
783
+ type SharedDragProps = {
784
+ dragRegistrationContext: React__default.Context<DragRegistrationContextType | null>;
785
+ activeDragContext: React__default.Context<ActiveDragContextType | null>;
786
+ };
756
787
 
757
788
  type ListRowMarginType = "none" | "top" | "bottom" | "vertical";
758
789
  type ListRowPosition = "only" | "first" | "middle" | "last";
@@ -869,6 +900,8 @@ type ListViewRootProps = {
869
900
  onDrop?: React__default.DragEventHandler<HTMLDivElement>;
870
901
  renderEmptyState?: () => ReactNode;
871
902
  getDropTargetParentIndex?: SortableItemContextProps["getDropTargetParentIndex"];
903
+ sharedDragProps?: SharedDragProps;
904
+ sortableId?: string;
872
905
  };
873
906
  declare namespace ListView {
874
907
  const RowTitle: React__default.MemoExoticComponent<({ className, children, ...props }: {
@@ -968,6 +1001,8 @@ interface CollectionProps<T, M extends string = string> {
968
1001
  /** @default false */
969
1002
  sortable?: boolean;
970
1003
  dragIndicatorStyle?: ListViewRowProps<M>["dragIndicatorStyle"];
1004
+ sharedDragProps?: SharedDragProps;
1005
+ sortableId?: string;
971
1006
  }
972
1007
  declare const Collection: <T, M extends string = string>(props: CollectionProps<T, M> & React__default.RefAttributes<CollectionRef>) => React__default.ReactElement | null;
973
1008
  type CollectionItemSize = "xxs" | "xs" | "small" | "medium" | "large" | "xl";
@@ -1784,40 +1819,11 @@ interface Props$4 {
1784
1819
  }
1785
1820
  declare const Slider: React__default.NamedExoticComponent<Props$4>;
1786
1821
 
1787
- type GetDropIndicatorParameters = {
1788
- absolutePosition: Point$1;
1789
- active: Active;
1790
- over: Over;
1791
- sourceListId: string;
1792
- targetListId: string;
1793
- };
1794
- interface RegisteredList {
1795
- id: string;
1796
- keys: UniqueIdentifier[];
1797
- onMoveItem: MoveDragItemHandler;
1798
- renderOverlay?: (id: UniqueIdentifier) => React__default.ReactNode;
1799
- acceptsFromList: AcceptsFromList;
1800
- acceptsDrop: AcceptsDrop;
1801
- getDropIndicator: (parameters: GetDropIndicatorParameters) => RelativeDropPosition | undefined;
1802
- }
1803
- interface DragRegistrationContextType {
1804
- registerList: (list: RegisteredList) => void;
1805
- unregisterList: (listId: string) => void;
1806
- }
1807
- type ActiveDragContextType = {
1808
- activeItem: DragItem | null;
1809
- delta: Point$1;
1810
- };
1811
- type SharedDragProviderContexts = {
1812
- dragRegistrationContext: React__default.Context<DragRegistrationContextType | null>;
1813
- activeDragContext: React__default.Context<ActiveDragContextType | null>;
1814
- };
1815
-
1816
1822
  type SharedDragProviderProps = {
1817
1823
  children: React$1.ReactNode;
1818
- contexts?: SharedDragProviderContexts;
1824
+ sharedDragProps?: SharedDragProps;
1819
1825
  };
1820
- declare function SharedDragProvider({ children, contexts, }: SharedDragProviderProps): React$1.JSX.Element;
1826
+ declare function SharedDragProvider({ children, sharedDragProps, }: SharedDragProviderProps): React$1.JSX.Element;
1821
1827
  declare function withDragProvider<T extends object>(Component: React$1.ComponentType<T>): (props: T) => React$1.JSX.Element;
1822
1828
  declare const getItemFirstCollisionDetection: (registeredListIds: string[]) => CollisionDetection;
1823
1829
 
@@ -1837,7 +1843,7 @@ interface RootProps {
1837
1843
  acceptsFromList?: AcceptsFromList;
1838
1844
  acceptsDrop?: DropValidator;
1839
1845
  getDropTargetParentIndex?: (index: number) => number | undefined;
1840
- sharedDragProviderContexts?: SharedDragProviderContexts;
1846
+ sharedDragProps?: SharedDragProps;
1841
1847
  containerRef?: React$1.RefObject<HTMLElement>;
1842
1848
  }
1843
1849
  declare function SortableItem<TElement extends HTMLElement>({ id, disabled, children, }: {
@@ -1845,7 +1851,7 @@ declare function SortableItem<TElement extends HTMLElement>({ id, disabled, chil
1845
1851
  disabled?: boolean;
1846
1852
  children: (props: ItemChildrenProps<TElement>) => React$1.ReactNode;
1847
1853
  }): React$1.ReactNode;
1848
- declare function SortableRoot_({ id: idProp, keys, onMoveItem, renderOverlay, acceptsFromList, acceptsDrop, axis, children, getDropTargetParentIndex, sharedDragProviderContexts, containerRef, }: RootProps): React$1.JSX.Element;
1854
+ declare function SortableRoot_({ id: idProp, keys: keysProp, onMoveItem, renderOverlay, acceptsFromList, acceptsDrop, axis, children, getDropTargetParentIndex, sharedDragProps, containerRef, }: RootProps): React$1.JSX.Element;
1849
1855
  interface SortableProps<TItem, TElement extends HTMLElement> extends Omit<RootProps, "children" | "keys" | "renderOverlay"> {
1850
1856
  items: TItem[];
1851
1857
  keyExtractor: (item: TItem) => UniqueIdentifier;
@@ -1861,8 +1867,8 @@ declare const Sortable: (<TItem, TElement extends HTMLElement>({ items, keyExtra
1861
1867
 
1862
1868
  declare function createSharedDrag(): {
1863
1869
  Provider: typeof SharedDragProvider;
1864
- props: SharedDragProviderContexts;
1865
1870
  Sortable: <TItem, TElement extends HTMLElement>(props: SortableProps<TItem, TElement>) => React$1.ReactNode;
1871
+ props: SharedDragProps;
1866
1872
  };
1867
1873
 
1868
1874
  interface Props$3 {
@@ -2422,4 +2428,4 @@ interface ToolbarProps<T extends string = string> {
2422
2428
  }
2423
2429
  declare function Toolbar<T extends string = string>({ children, logo, leftMenuItems, rightMenuItems, onSelectMenuItem, shouldBindKeyboardShortcuts, }: ToolbarProps<T>): React__default.JSX.Element;
2424
2430
 
2425
- export { AIAssistantInput, AIAssistantLayout, AIAssistantLoadingIndicator, type AcceptsDrop, type AcceptsDropOptions, type AcceptsFromList, ActionMenu, ActivityIndicator, AnimatePresence, type AnimatePresenceProps, Avatar, type AvatarProps, AvatarStack, Banner, type BannerProps, type BaseComboboxProps, BaseToolbar, type BaseToolbarProps, Body, BreadcrumbSlash, BreadcrumbText, Button, type ButtonRootProps, CHECKBOX_INDENT_WIDTH, CHECKBOX_RIGHT_INSET, CHECKBOX_WIDTH, CONTENT_AREA_ID, Checkbox$1 as Checkbox, Chip, type ChipProps, Collection, type CollectionItemSize, type CollectionProps, type CollectionRef, type CollectionRenderActionProps, type CollectionThumbnailProps, type CollectionThumbnailSize, type CollectionViewType, ColorSwatch, ColorSwatchControl, type ColorSwatchSize, Combobox, ComboboxMenu, type ComboboxProps, type ComboboxRef, ComboboxState, type ComboboxStateSnapshot, CommandPalette, ConnectedUsersMenuLayout, ContextMenu, type DesignSystemConfigurationContextValue, DesignSystemConfigurationProvider, type DetectSizeType, Dialog, type DialogContextValue, DialogProvider, DimensionInput, type DimensionValue, Divider, DividerVertical, type DragIndicatorStyleProps, type DragItem, DraggableMenuButton, Drawer, type DrawerProps, type DropTarget, type DropValidator, DropdownMenu, type DropdownRootProps, EDITOR_PANEL_GROUP_ID, type EditableRowProps, EditableText, type EditableTextRef, type ExtractMenuItemType, Fade, type FadeDirection, type FadeProps, FileExplorerCollection, FileExplorerDetail, FileExplorerEmptyState, FileExplorerLayout, FileExplorerUploadButton, FillInputField, FillPreviewBackground, FloatingWindow, FloatingWindowProvider, FullscreenDialog, type GlobalInputBlurContextValue, GlobalInputBlurProvider, GradientPicker, Grid, GridView, Heading1, Heading2, Heading3, Heading4, Heading5, type HoverEvent, type HoverEvents, type HoverProps, type IDialog, INPUT_HEIGHT, type IScoredItem, type ISearchCompletionMenu, type IToken, type IVirtualizedList, IconButton, type IconName, type ImageDataContextValue, ImageDataProvider, IndentContext, InputField, type InputFieldInputProps, type InputFieldProps, type InputFieldSize, InspectorContainer, InspectorPrimitives, Italic, KeyboardShortcut, LEFT_SIDEBAR_ID, Label, LabelContext, type LabelPosition, LabelPositionContext, type LabelPositionContextValue, type LabelProps, LabelWidthContext, type LabelWidthContextValue, LabeledElementView, LabeledField, type LayoutProps, List, type ListRowMarginType, type ListRowPosition, ListView, type ListViewItemInfo, type ListViewRootProps, type ListViewRowProps, Logo, type MatchRange, MediaThumbnail, type MenuComponents, type MenuConfig, type MenuItem, type MenuItemIcon, type MenuItemProps, type MenuItemRole, type MenuProps, MenuViewport, Message, type MessageProps, type MoveDragItemHandler, type MoveTreeItemOptions, type NonSelectableMenuItem, type OpenPortalControlsContextValue, type OpenPortalsContextValue, OpenPortalsProvider, type OptionModeOnlyProps, type OptionModeProps, type Optional, type PanelLayoutState, PatternPreviewBackground, type PercentageSidebarOptions, PipelineResultLayout, PipelineResultLink, Popover, type PortalScopeContextValue, PortalScopeProvider, Progress, RIGHT_SIDEBAR_ID, type RelativeDropPosition, SUPPORTED_CANVAS_UPLOAD_TYPES, SUPPORTED_IMAGE_UPLOAD_TYPES, type ScoredMenuItem, ScrollArea, SearchCompletionMenu, Section$1 as Section, SectionHeader$1 as SectionHeader, type SectionHeaderMenuItem, type SectionProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlProps, SelectMenu, type SelectableMenuItem, SelectionToolbarContainer, type SeparatorItem, type SetNumberMode, SharedDragProvider, type SideOptions, type SideType, type SidebarRef, type SketchPattern, Slider, Small, Sortable, SortableItemContext, type SortableItemContextProps, type SortableProps, Spacer, type StringModeOnlyProps, type StringModeProps, type SubMenuItem, type SupportedCanvasUploadType, type SupportedImageUploadType, Switch, Text$1 as Text, TextArea, TextAreaRow, type TextProps, type Theme, type ThemeColor, Toast, ToastProvider, type TokenValue, Toolbar, ToolbarMenu, ToolbarMenuButton, ToolbarMenuDropdown, ToolbarMenuItem, type ToolbarProps, Tooltip, TreeView, type UseThemeReturnType, UserAvatar, UserPointer, type UserPointerProps, type ValidateDropIndicatorParams, WorkspaceLayout, type WorkspaceLayoutProps, type WorkspaceLayoutRef, acceptsDrop, colorForStringValues, colorFromString, colorSwatchSizeMap, createSectionedMenu, createSharedDrag, cssVarNames, cssVars, cx, defaultAcceptsDrop, filterWithGroupedSections, fuzzyFilter, fuzzyScore, fuzzyTokenize, getClosestPortalScope, getFieldSpacing, getGradientBackground, getGridSize, getItemFirstCollisionDetection, getKeyboardShortcutsForMenuItems, getMenuItemKey, getNewValue, getNextIndex, getPipelineResultLink, getThumbnailColors, isMenuItemSectionHeader, isNonSelectableMenuItem, isSelectableMenuItem, isSelectableMenuItemWithScore, labeledFieldStyles, mediaQuery, mergeConflictingClassNames, moveTreeItem, normalizeListTargetIndex, popoverStyle, portalScopeDataSetName, portalScopePropName, portalScopeProps, renderIcon, rgbaToSketchColor, separator, size, sketchColorToHex, sketchColorToRgba, sketchColorToRgbaString, styles, textStyles, updateSelection, useAutoResize, useComboboxState, useCurrentFloatingWindowInternal, useDesignSystemConfiguration, useDialogContainsElement, useDialogContext, useFloatingWindowManager, useGlobalInputBlur, useGlobalInputBlurListener, useGlobalInputBlurTrigger, useHasOpenPortals, useHover, useImageData, useIndent, useInputFieldContext, useLabel, useLabelPosition, useLabelWidth, useOpenConfirmationDialog, useOpenDialog, useOpenInputDialog, useOpenPortalsControls, usePlatform, usePlatformModKey, usePortalScopeId, usePreservePanelSize, useTheme, validateDropIndicator, withDragProvider, withSeparatorElements };
2431
+ export { AIAssistantInput, AIAssistantLayout, AIAssistantLoadingIndicator, type AcceptsDrop, type AcceptsDropOptions, type AcceptsFromList, ActionMenu, ActivityIndicator, AnimatePresence, type AnimatePresenceProps, Avatar, type AvatarProps, AvatarStack, Banner, type BannerProps, type BaseComboboxProps, BaseToolbar, type BaseToolbarProps, Body, BreadcrumbSlash, BreadcrumbText, Button, type ButtonRootProps, CHECKBOX_INDENT_WIDTH, CHECKBOX_RIGHT_INSET, CHECKBOX_WIDTH, CONTENT_AREA_ID, Checkbox$1 as Checkbox, Chip, type ChipProps, Collection, type CollectionItemSize, type CollectionProps, type CollectionRef, type CollectionRenderActionProps, type CollectionThumbnailProps, type CollectionThumbnailSize, type CollectionViewType, ColorSwatch, ColorSwatchControl, type ColorSwatchSize, Combobox, ComboboxMenu, type ComboboxProps, type ComboboxRef, ComboboxState, type ComboboxStateSnapshot, CommandPalette, ConnectedUsersMenuLayout, ContextMenu, type DesignSystemConfigurationContextValue, DesignSystemConfigurationProvider, type DetectSizeType, Dialog, type DialogContextValue, DialogProvider, DimensionInput, type DimensionValue, Divider, DividerVertical, type DragIndicatorStyleProps, type DragItem, type DragState, DraggableMenuButton, Drawer, type DrawerProps, type DropValidator, DropdownMenu, type DropdownRootProps, EDITOR_PANEL_GROUP_ID, type EditableRowProps, EditableText, type EditableTextRef, type ExtractMenuItemType, Fade, type FadeDirection, type FadeProps, FileExplorerCollection, FileExplorerDetail, FileExplorerEmptyState, FileExplorerLayout, FileExplorerUploadButton, FillInputField, FillPreviewBackground, FloatingWindow, FloatingWindowProvider, FullscreenDialog, type GlobalInputBlurContextValue, GlobalInputBlurProvider, GradientPicker, Grid, GridView, Heading1, Heading2, Heading3, Heading4, Heading5, type HoverEvent, type HoverEvents, type HoverProps, type IDialog, INPUT_HEIGHT, type IScoredItem, type ISearchCompletionMenu, type IToken, type IVirtualizedList, IconButton, type IconName, type ImageDataContextValue, ImageDataProvider, IndentContext, InputField, type InputFieldInputProps, type InputFieldProps, type InputFieldSize, InspectorContainer, InspectorPrimitives, Italic, KeyboardShortcut, LEFT_SIDEBAR_ID, Label, LabelContext, type LabelPosition, LabelPositionContext, type LabelPositionContextValue, type LabelProps, LabelWidthContext, type LabelWidthContextValue, LabeledElementView, LabeledField, type LayoutProps, List, type ListRowMarginType, type ListRowPosition, ListView, type ListViewItemInfo, type ListViewRootProps, type ListViewRowProps, Logo, type MatchRange, MediaThumbnail, type MenuComponents, type MenuConfig, type MenuItem, type MenuItemIcon, type MenuItemProps, type MenuItemRole, type MenuProps, MenuViewport, Message, type MessageProps, type MoveDragItemHandler, type MoveTreeItemOptions, type NonSelectableMenuItem, type OpenPortalControlsContextValue, type OpenPortalsContextValue, OpenPortalsProvider, type OptionModeOnlyProps, type OptionModeProps, type Optional, type PanelLayoutState, PatternPreviewBackground, type PercentageSidebarOptions, PipelineResultLayout, PipelineResultLink, Popover, type PortalScopeContextValue, PortalScopeProvider, Progress, RIGHT_SIDEBAR_ID, type RelativeDropPosition, SUPPORTED_CANVAS_UPLOAD_TYPES, SUPPORTED_IMAGE_UPLOAD_TYPES, type ScoredMenuItem, ScrollArea, SearchCompletionMenu, Section$1 as Section, SectionHeader$1 as SectionHeader, type SectionHeaderMenuItem, type SectionProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlProps, SelectMenu, type SelectableMenuItem, SelectionToolbarContainer, type SeparatorItem, type SetNumberMode, SharedDragProvider, type SideOptions, type SideType, type SidebarRef, type SketchPattern, Slider, Small, Sortable, SortableItemContext, type SortableItemContextProps, type SortableProps, Spacer, type StringModeOnlyProps, type StringModeProps, type SubMenuItem, type SupportedCanvasUploadType, type SupportedImageUploadType, Switch, Text$1 as Text, TextArea, TextAreaRow, type TextProps, type Theme, type ThemeColor, Toast, ToastProvider, type TokenValue, Toolbar, ToolbarMenu, ToolbarMenuButton, ToolbarMenuDropdown, ToolbarMenuItem, type ToolbarProps, Tooltip, TreeView, type UseThemeReturnType, UserAvatar, UserPointer, type UserPointerProps, type ValidateDropIndicatorParams, WorkspaceLayout, type WorkspaceLayoutProps, type WorkspaceLayoutRef, acceptsDrop, colorForStringValues, colorFromString, colorSwatchSizeMap, createDragItemKey, createSectionedMenu, createSharedDrag, cssVarNames, cssVars, cx, defaultAcceptsDrop, filterWithGroupedSections, fuzzyFilter, fuzzyScore, fuzzyTokenize, getClosestPortalScope, getFieldSpacing, getGradientBackground, getGridSize, getItemFirstCollisionDetection, getKeyboardShortcutsForMenuItems, getMenuItemKey, getNewValue, getNextIndex, getPipelineResultLink, getThumbnailColors, isMenuItemSectionHeader, isNonSelectableMenuItem, isSelectableMenuItem, isSelectableMenuItemWithScore, labeledFieldStyles, mediaQuery, mergeConflictingClassNames, moveTreeItem, normalizeListTargetIndex, parseDragItemKey, popoverStyle, portalScopeDataSetName, portalScopePropName, portalScopeProps, renderIcon, rgbaToSketchColor, separator, size, sketchColorToHex, sketchColorToRgba, sketchColorToRgbaString, styles, textStyles, updateSelection, useAutoResize, useComboboxState, useCurrentFloatingWindowInternal, useDesignSystemConfiguration, useDialogContainsElement, useDialogContext, useFloatingWindowManager, useGlobalInputBlur, useGlobalInputBlurListener, useGlobalInputBlurTrigger, useHasOpenPortals, useHover, useImageData, useIndent, useInputFieldContext, useLabel, useLabelPosition, useLabelWidth, useOpenConfirmationDialog, useOpenDialog, useOpenInputDialog, useOpenPortalsControls, usePlatform, usePlatformModKey, usePortalScopeId, usePreservePanelSize, useTheme, validateDropIndicator, withDragProvider, withSeparatorElements };