@noya-app/noya-designsystem 0.1.6 → 0.1.7

package/.turbo/turbo-build.log

@@ -5,13 +5,13 @@
 CLI Target: esnext
 CJS Build start
 ESM Build start
-ESM dist/index.mjs     183.12 KB
-ESM dist/index.mjs.map 404.00 KB
-ESM ⚡️ Build success in 111ms
-CJS dist/index.js     199.40 KB
-CJS dist/index.js.map 404.28 KB
-CJS ⚡️ Build success in 112ms
 DTS Build start
-DTS ⚡️ Build success in 6149ms
-DTS dist/index.d.ts  54.18 KB
-DTS dist/index.d.mts 54.18 KB
+CJS dist/index.js     199.65 KB
+CJS dist/index.js.map 404.79 KB
+CJS ⚡️ Build success in 185ms
+ESM dist/index.mjs     183.34 KB
+ESM dist/index.mjs.map 404.50 KB
+ESM ⚡️ Build success in 190ms
+DTS ⚡️ Build success in 6688ms
+DTS dist/index.d.ts  54.34 KB
+DTS dist/index.d.mts 54.34 KB

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @noya-app/noya-designsystem
 
+## 0.1.7
+
+### Patch Changes
+
+- 6a13e8b: Improve multiplayer and design system
+- Updated dependencies [6a13e8b]
+  - @noya-app/noya-colorpicker@0.1.5
+  - @noya-app/noya-geometry@0.1.2
+  - @noya-app/noya-icons@0.1.2
+
 ## 0.1.6
 
 ### Patch Changes

package/dist/index.d.mts

@@ -283,8 +283,8 @@ declare const DividerVertical: (props: DividerProps) => React__default.ReactElem
  * A button that opens a menu when clicked, but also allows dragging the
  */
 declare const DraggableMenuButton: <T extends string>(props: {
-    items: MenuItem<T>[];
-    onSelect: (value: T) => void;
+    items?: MenuItem<T>[] | undefined;
+    onSelect?: ((value: T) => void) | undefined;
     isVisible?: boolean | undefined;
 }) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
@@ -621,6 +621,7 @@ interface ListViewRowProps<MenuItemType extends string = string> {
     onContextMenu?: () => void;
     onMenuOpenChange?: (isOpen: boolean) => void;
     onKeyDown?: (event: React__default.KeyboardEvent) => void;
+    style?: CSSProperties;
 }
 interface IVirtualizedList {
     scrollToIndex(index: number): void;
@@ -636,7 +637,9 @@ type RenderProps<T> = {
     renderItem: (item: T, index: number, info: ListViewItemInfo) => ReactNode;
     keyExtractor: (item: T, index: number) => string;
     /**
-     * Each item must have an `id` in order to be sortable
+     * Each item must have an `id` in order to be sortable.
+     *
+     * Additionally, the key extracted with `keyExtractor` must match the ListItem.Row `id`.
      */
     sortable?: boolean;
     virtualized?: Size;
@@ -795,7 +798,7 @@ declare const SelectOption: <T extends string>(props: SelectOptionProps<T>) => R
 type ChildrenProps<T> = {
     children: ReactNode;
 } | {
-    options: T[];
+    options: readonly T[];
     getTitle?: (option: T, index: number) => string;
     onChange: (value: T) => void;
 };

package/dist/index.d.ts

@@ -283,8 +283,8 @@ declare const DividerVertical: (props: DividerProps) => React__default.ReactElem
  * A button that opens a menu when clicked, but also allows dragging the
  */
 declare const DraggableMenuButton: <T extends string>(props: {
-    items: MenuItem<T>[];
-    onSelect: (value: T) => void;
+    items?: MenuItem<T>[] | undefined;
+    onSelect?: ((value: T) => void) | undefined;
     isVisible?: boolean | undefined;
 }) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
@@ -621,6 +621,7 @@ interface ListViewRowProps<MenuItemType extends string = string> {
     onContextMenu?: () => void;
     onMenuOpenChange?: (isOpen: boolean) => void;
     onKeyDown?: (event: React__default.KeyboardEvent) => void;
+    style?: CSSProperties;
 }
 interface IVirtualizedList {
     scrollToIndex(index: number): void;
@@ -636,7 +637,9 @@ type RenderProps<T> = {
     renderItem: (item: T, index: number, info: ListViewItemInfo) => ReactNode;
     keyExtractor: (item: T, index: number) => string;
     /**
-     * Each item must have an `id` in order to be sortable
+     * Each item must have an `id` in order to be sortable.
+     *
+     * Additionally, the key extracted with `keyExtractor` must match the ListItem.Row `id`.
      */
     sortable?: boolean;
     virtualized?: Size;
@@ -795,7 +798,7 @@ declare const SelectOption: <T extends string>(props: SelectOptionProps<T>) => R
 type ChildrenProps<T> = {
     children: ReactNode;
 } | {
-    options: T[];
+    options: readonly T[];
     getTitle?: (option: T, index: number) => string;
     onChange: (value: T) => void;
 };

package/dist/index.js

@@ -2435,7 +2435,7 @@ var DraggableMenuButton = (0, import_react36.memo)(function DraggableMenuButton2
         event.preventDefault();
       }
     },
-    /* @__PURE__ */ import_react36.default.createElement(
+    items && onSelect ? /* @__PURE__ */ import_react36.default.createElement(
       DropdownMenu,
       {
         open,
@@ -2450,6 +2450,11 @@ var DraggableMenuButton = (0, import_react36.memo)(function DraggableMenuButton2
           color: isVisible || open ? color : "transparent"
         }
       ))
+    ) : /* @__PURE__ */ import_react36.default.createElement(
+      import_noya_icons5.DragHandleDots2Icon,
+      {
+        color: isVisible || open ? color : "transparent"
+      }
     )
   );
 });
@@ -3900,7 +3905,8 @@ var ListViewRow = (0, import_react45.forwardRef)(function ListViewRow2({
   onContextMenu,
   onSelectMenuItem,
   onMenuOpenChange,
-  onKeyDown
+  onKeyDown,
+  style: style3
 }, forwardedRef) {
   depth = Math.max(0, depth);
   const {
@@ -3934,13 +3940,14 @@ var ListViewRow = (0, import_react45.forwardRef)(function ListViewRow2({
     },
     [onDoubleClick]
   );
-  const isDraggingStyle = (0, import_react45.useMemo)(() => {
+  const mergedStyle = (0, import_react45.useMemo)(() => {
     return isDragging ? {
       // TODO: Where do these offsets actually come from?
       transform: `translate3d(-36px, -6px, 0)`,
-      width: `calc(100% + 48px)`
-    } : void 0;
-  }, [isDragging]);
+      width: `calc(100% + 48px)`,
+      ...style3
+    } : style3;
+  }, [isDragging, style3]);
   const renderContent = ({
     relativeDropPosition,
     ...renderProps
@@ -3968,7 +3975,7 @@ var ListViewRow = (0, import_react45.forwardRef)(function ListViewRow2({
         "aria-selected": selected,
         divider: !isDragging && divider,
         onKeyDown,
-        style: isDraggingStyle,
+        style: mergedStyle,
         ...renderProps,
         ...mergeEventHandlers(
           { onPointerDown: renderProps.onPointerDown },
@@ -5684,8 +5691,9 @@ var RowLabel = import_styled_components35.default.span(({ theme, textStyle }) =>
     color: theme.colors.textSubtle,
     fontWeight: "bold"
   },
-  lineHeight: "19px"
+  lineHeight: "19px",
   // Button height
+  alignItems: "center"
 }));
 var LabeledRow = (0, import_react56.memo)(function LabeledRow2({
   id,