@uniformdev/mesh-sdk-react 19.22.1-alpha.8 → 19.23.0

package/dist/index.d.ts

@@ -766,8 +766,6 @@ type SelectedItemProps<TExtraProps = unknown> = {
     metadata?: Record<string, string>;
     /** allows for child react elements to be nested in the popover */
     popoverData?: ReactNode;
-    /** disable or enable drag and drop functionality */
-    disableDnD?: boolean;
 } & TExtraProps;
 type ItemListProps<TListItemExtraProps = unknown> = {
     items?: Array<SelectedItemProps<TListItemExtraProps>>;

package/dist/index.esm.js

@@ -4548,7 +4548,6 @@ var DataRefreshButton = ({
 
 // src/components/ObjectSearch/ObjectSearchContainer.tsx
 init_emotion_jsx_shim();
-import { css as css28 } from "@emotion/react";
 
 // ../canvas/dist/index.mjs
 init_emotion_jsx_shim();
@@ -5835,19 +5834,7 @@ var ObjectSearchContainer = ({
   const { flatVariables } = useVariables(true);
   const body = /* @__PURE__ */ jsxs29(VerticalRhythm, { children: [
     searchFilters,
-    !resultList ? null : /* @__PURE__ */ jsx49(
-      ScrollableList,
-      {
-        role: "list",
-        css: css28`
-            > div {
-              transition: max-height var(--duration-slow) var(--timing-ease-out);
-              max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
-            }
-          `,
-        children: resultList
-      }
-    )
+    !resultList ? null : /* @__PURE__ */ jsx49(ScrollableList, { role: "list", children: resultList })
   ] });
   const handleSelectedVariableChange = (selectedValue) => {
     var _a2;
@@ -5898,8 +5885,8 @@ import { useState as useState13 } from "react";
 
 // src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
 init_emotion_jsx_shim();
-import { css as css29 } from "@emotion/react";
-var ObjectSearchFilterContainerLabel = css29`
+import { css as css28 } from "@emotion/react";
+var ObjectSearchFilterContainerLabel = css28`
   align-items: center;
   display: flex;
   font-size: var(--fs-sm);
@@ -5907,14 +5894,14 @@ var ObjectSearchFilterContainerLabel = css29`
   line-height: 1rem;
   margin-bottom: var(--spacing-sm);
 `;
-var ObjectSearchFilterContainer = css29`
+var ObjectSearchFilterContainer = css28`
   display: grid;
   gap: var(--spacing-base);
 `;
-var ObjectSearchFilterDropdownAndTextSearch = css29`
+var ObjectSearchFilterDropdownAndTextSearch = css28`
   grid-template-columns: 0.5fr 1fr;
 `;
-var ObjectSearchFilterGrid = (gridColumns) => css29`
+var ObjectSearchFilterGrid = (gridColumns) => css28`
   display: grid;
   grid-template-columns: ${gridColumns};
   gap: var(--spacing-base);
@@ -5984,22 +5971,26 @@ var ObjectSearchFilterContainer2 = ({ label, children }) => {
 
 // src/components/ObjectSearch/ObjectSearchListItem.tsx
 init_emotion_jsx_shim();
-import { Chip, Popover } from "@uniformdev/design-system";
+import { Popover } from "@uniformdev/design-system";
 
 // src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
 init_emotion_jsx_shim();
-import { css as css30 } from "@emotion/react";
+import { css as css29 } from "@emotion/react";
 import { skeletonLoading } from "@uniformdev/design-system";
-var ObjectListItemContainer = css30`
+var ObjectListItemContainer = css29`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
   background: var(--white);
   display: grid;
-  grid-template-columns: 1fr auto;
+  grid-template-columns: 1fr 32px;
   padding: var(--spacing-sm);
+
+  &[hidden] {
+    display: none;
+  }
 `;
-var ObjectListItemLoading = css30`
+var ObjectListItemLoading = css29`
   animation: ${skeletonLoading} 1s linear infinite alternate;
   border-color: transparent;
   min-height: 42px;
@@ -6023,32 +6014,31 @@ var ObjectListItemLoading = css30`
     width: 1rem;
   }
 `;
-var ObjectListItemHeadingGroup = css30`
+var ObjectListItemHeadingGroup = css29`
   align-items: center;
   display: grid;
 `;
-var ObjectListItemTitle = css30`
+var ObjectListItemTitle = css29`
   color: var(--brand-secondary-1);
   display: block;
   font-size: var(--fs-sm);
 `;
-var ObjectListItemSubtitle = css30`
+var ObjectListItemSubtitle = css29`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectListItemInfoContainer = css30`
+var ObjectListItemInfoContainer = css29`
   align-items: center;
   display: flex;
-  gap: var(--spacing-sm);
   justify-content: center;
 `;
-var ObjectListItemControlledContent = css30`
+var ObjectListItemControlledContent = css29`
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectListItemUnControlledContent = css30`
+var ObjectListItemUnControlledContent = css29`
   margin-top: var(--spacing-sm);
   grid-column: 1 / -1;
 `;
@@ -6076,8 +6066,8 @@ var ObjectSearchListItem = ({
     }
     return onSelectItem([selectedItem]);
   };
-  const selected = selectedListItems.some((item) => item.id === id);
-  return /* @__PURE__ */ jsxs32("div", { role: "listitem", css: ObjectListItemContainer, children: [
+  const hideWhenInSelectedList = selectedListItems.some((item) => item.id === id);
+  return /* @__PURE__ */ jsxs32("div", { role: "listitem", hidden: hideWhenInSelectedList, css: ObjectListItemContainer, children: [
     /* @__PURE__ */ jsxs32("div", { role: "button", onClick: handleSelectItem, css: ObjectListItemControlledContent, children: [
       !image ? null : /* @__PURE__ */ jsx52("img", { ...image, loading: (image == null ? void 0 : image.width) && image.height ? "lazy" : "eager" }),
       /* @__PURE__ */ jsxs32("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
@@ -6085,10 +6075,7 @@ var ObjectSearchListItem = ({
         /* @__PURE__ */ jsx52("span", { css: ObjectListItemTitle, children: title })
       ] })
     ] }),
-    !popoverData ? null : /* @__PURE__ */ jsxs32("div", { css: ObjectListItemInfoContainer, children: [
-      selected ? /* @__PURE__ */ jsx52(Chip, { text: "selected", size: "xs" }) : null,
-      /* @__PURE__ */ jsx52(Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, iconColor: "default", children: popoverData })
-    ] }),
+    !popoverData ? null : /* @__PURE__ */ jsx52("div", { css: ObjectListItemInfoContainer, children: /* @__PURE__ */ jsx52(Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData }) }),
     !children ? null : /* @__PURE__ */ jsx52("div", { css: ObjectListItemUnControlledContent, children })
   ] });
 };
@@ -6106,9 +6093,9 @@ init_emotion_jsx_shim();
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
 init_emotion_jsx_shim();
-import { css as css31 } from "@emotion/react";
+import { css as css30 } from "@emotion/react";
 import { button as button2 } from "@uniformdev/design-system";
-var ButtonStyles = css31`
+var ButtonStyles = css30`
   ${button2}
   background: transparent;
   border: 1px solid var(--brand-secondary-1);
@@ -6135,7 +6122,7 @@ var ButtonStyles = css31`
     text-decoration: none;
   }
 `;
-var ButtonIcon = css31`
+var ButtonIcon = css30`
   width: 1rem;
   height: 1rem;
 `;
@@ -6165,8 +6152,8 @@ var LinkButton = ({
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
 init_emotion_jsx_shim();
-import { css as css32 } from "@emotion/react";
-var ObjectSearchResultItemContainer = css32`
+import { css as css31 } from "@emotion/react";
+var ObjectSearchResultItemContainer = css31`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -6182,7 +6169,7 @@ var ObjectSearchResultItemContainer = css32`
     }
   }
 `;
-var ObjectSearchDragHandle = css32`
+var ObjectSearchDragHandle = css31`
   border-left: 2px dotted var(--gray-300);
   border-right: 2px dotted var(--gray-300);
   position: absolute;
@@ -6191,35 +6178,35 @@ var ObjectSearchDragHandle = css32`
   transition: opacity var(--duration-fast) var(--timing-ease-out);
   opacity: 0;
 `;
-var ObjectSearchResultItemSubtitle = css32`
+var ObjectSearchResultItemSubtitle = css31`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectSearchResultItemTitle = css32`
+var ObjectSearchResultItemTitle = css31`
   align-items: center;
   color: var(--brand-secondary-1);
   display: flex;
   gap: var(--spacing-xs);
 `;
-var ObjectSearchResultItemTimeStamp = css32`
+var ObjectSearchResultItemTimeStamp = css31`
   color: var(--gray-500);
   font-size: var(--fs-xs);
 `;
-var ObjectSearchAuthorStateGroup = css32`
+var ObjectSearchAuthorStateGroup = css31`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchUpdateGroup = css32`
+var ObjectSearchUpdateGroup = css31`
   display: grid;
 `;
-var ObjectSearchContentContainer = css32`
+var ObjectSearchContentContainer = css31`
   display: flex;
   gap: var(--spacing-base);
 `;
-var ObjectSearchImage = css32`
+var ObjectSearchImage = css31`
   width: 56px;
   object-fit: contain;
 `;
@@ -6289,26 +6276,22 @@ import { DragDropContext as DragDropContext3, Draggable as Draggable3, Droppable
 
 // src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
 init_emotion_jsx_shim();
-import { css as css33 } from "@emotion/react";
-var ObjectSearchResultListContainer = css33`
+import { css as css32 } from "@emotion/react";
+var ObjectSearchResultListContainer = css32`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
   justify-content: space-between;
 `;
-var ObjectSearchDragContainer = css33`
+var ObjectSearchDragContainer = css32`
   margin: 0 0 var(--spacing-sm);
 `;
-var ObjectSearchContainerDragging = css33`
-  box-shadow: var(--shadow-base);
-  opacity: var(--opacity-50);
-`;
-var ObjectSearchResultListCounterContainer = css33`
+var ObjectSearchResultListCounterContainer = css32`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchResultListTitle = css33`
+var ObjectSearchResultListTitle = css32`
   font-weight: var(--fw-bold);
   line-height: 1;
 `;
@@ -6321,7 +6304,7 @@ function ObjectSearchResultList({
   onRemoveAllSelected,
   hideRemoveButton = false,
   additionalButtons,
-  renderResultComponent = (value) => /* @__PURE__ */ jsx55(ObjectSearchResultItem, { ...value }),
+  renderResultComponent = (value) => /* @__PURE__ */ jsx55(ObjectSearchResultItem, { ...value, disableDnD }),
   multiSelectId,
   disableDnD = false,
   whenNothingSelected = null
@@ -6364,31 +6347,18 @@ function ObjectSearchResultList({
     ] }),
     !selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ jsx55(DragDropContext3, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx55(Droppable3, { droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select", children: (provided) => /* @__PURE__ */ jsxs35("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
       selectedListItems.map((item, i2) => {
-        const itemValues = selectedListItems.length === 1 ? { ...item, disableDnD: true } : { ...item, disableDnD };
-        const renderListItem = renderResultComponent(itemValues);
-        return /* @__PURE__ */ jsx55(
-          Draggable3,
+        const renderListItem = renderResultComponent(item);
+        return /* @__PURE__ */ jsx55(Draggable3, { draggableId: item.id, index: i2, isDragDisabled: disableDnD, children: (provided2, snapshot) => /* @__PURE__ */ jsx55(
+          "div",
           {
-            draggableId: item.id,
-            index: i2,
-            isDragDisabled: selectedListItems.length === 1 || disableDnD,
-            children: (provided2, snapshot) => /* @__PURE__ */ jsx55(
-              "div",
-              {
-                css: [
-                  ObjectSearchDragContainer,
-                  snapshot.isDragging ? ObjectSearchContainerDragging : void 0
-                ],
-                ref: provided2.innerRef,
-                "data-dragging": snapshot.isDragging,
-                ...provided2.draggableProps,
-                ...provided2.dragHandleProps,
-                children: renderListItem
-              }
-            )
-          },
-          item.id
-        );
+            css: ObjectSearchDragContainer,
+            ref: provided2.innerRef,
+            "data-dragging": snapshot.isDragging,
+            ...provided2.draggableProps,
+            ...provided2.dragHandleProps,
+            children: renderListItem
+          }
+        ) }, item.id);
       }),
       provided.placeholder
     ] }) }) })

package/dist/index.js

@@ -4676,7 +4676,6 @@ var DataRefreshButton = ({
 
 // src/components/ObjectSearch/ObjectSearchContainer.tsx
 init_emotion_jsx_shim();
-var import_react44 = require("@emotion/react");
 
 // ../canvas/dist/index.mjs
 init_emotion_jsx_shim();
@@ -5956,19 +5955,7 @@ var ObjectSearchContainer = ({
   const { flatVariables } = useVariables(true);
   const body = /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_design_system25.VerticalRhythm, { children: [
     searchFilters,
-    !resultList ? null : /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
-      import_design_system25.ScrollableList,
-      {
-        role: "list",
-        css: import_react44.css`
-            > div {
-              transition: max-height var(--duration-slow) var(--timing-ease-out);
-              max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
-            }
-          `,
-        children: resultList
-      }
-    )
+    !resultList ? null : /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_design_system25.ScrollableList, { role: "list", children: resultList })
   ] });
   const handleSelectedVariableChange = (selectedValue) => {
     var _a2;
@@ -6015,12 +6002,12 @@ var ObjectSearchContainer = ({
 // src/components/ObjectSearch/ObjectSearchFilter.tsx
 init_emotion_jsx_shim();
 var import_design_system26 = require("@uniformdev/design-system");
-var import_react46 = require("react");
+var import_react45 = require("react");
 
 // src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
 init_emotion_jsx_shim();
-var import_react45 = require("@emotion/react");
-var ObjectSearchFilterContainerLabel = import_react45.css`
+var import_react44 = require("@emotion/react");
+var ObjectSearchFilterContainerLabel = import_react44.css`
   align-items: center;
   display: flex;
   font-size: var(--fs-sm);
@@ -6028,14 +6015,14 @@ var ObjectSearchFilterContainerLabel = import_react45.css`
   line-height: 1rem;
   margin-bottom: var(--spacing-sm);
 `;
-var ObjectSearchFilterContainer = import_react45.css`
+var ObjectSearchFilterContainer = import_react44.css`
   display: grid;
   gap: var(--spacing-base);
 `;
-var ObjectSearchFilterDropdownAndTextSearch = import_react45.css`
+var ObjectSearchFilterDropdownAndTextSearch = import_react44.css`
   grid-template-columns: 0.5fr 1fr;
 `;
-var ObjectSearchFilterGrid = (gridColumns) => import_react45.css`
+var ObjectSearchFilterGrid = (gridColumns) => import_react44.css`
   display: grid;
   grid-template-columns: ${gridColumns};
   gap: var(--spacing-base);
@@ -6052,7 +6039,7 @@ var ObjectSearchFilter = ({
   selectOptions
 }) => {
   const { query, onSetQuery } = useObjectSearchContext();
-  const [searchState, setSearchState] = (0, import_react46.useState)({
+  const [searchState, setSearchState] = (0, import_react45.useState)({
     contentType: "",
     keyword: ""
   });
@@ -6109,18 +6096,22 @@ var import_design_system28 = require("@uniformdev/design-system");
 
 // src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
 init_emotion_jsx_shim();
-var import_react47 = require("@emotion/react");
+var import_react46 = require("@emotion/react");
 var import_design_system27 = require("@uniformdev/design-system");
-var ObjectListItemContainer = import_react47.css`
+var ObjectListItemContainer = import_react46.css`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
   background: var(--white);
   display: grid;
-  grid-template-columns: 1fr auto;
+  grid-template-columns: 1fr 32px;
   padding: var(--spacing-sm);
+
+  &[hidden] {
+    display: none;
+  }
 `;
-var ObjectListItemLoading = import_react47.css`
+var ObjectListItemLoading = import_react46.css`
   animation: ${import_design_system27.skeletonLoading} 1s linear infinite alternate;
   border-color: transparent;
   min-height: 42px;
@@ -6144,32 +6135,31 @@ var ObjectListItemLoading = import_react47.css`
     width: 1rem;
   }
 `;
-var ObjectListItemHeadingGroup = import_react47.css`
+var ObjectListItemHeadingGroup = import_react46.css`
   align-items: center;
   display: grid;
 `;
-var ObjectListItemTitle = import_react47.css`
+var ObjectListItemTitle = import_react46.css`
   color: var(--brand-secondary-1);
   display: block;
   font-size: var(--fs-sm);
 `;
-var ObjectListItemSubtitle = import_react47.css`
+var ObjectListItemSubtitle = import_react46.css`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectListItemInfoContainer = import_react47.css`
+var ObjectListItemInfoContainer = import_react46.css`
   align-items: center;
   display: flex;
-  gap: var(--spacing-sm);
   justify-content: center;
 `;
-var ObjectListItemControlledContent = import_react47.css`
+var ObjectListItemControlledContent = import_react46.css`
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectListItemUnControlledContent = import_react47.css`
+var ObjectListItemUnControlledContent = import_react46.css`
   margin-top: var(--spacing-sm);
   grid-column: 1 / -1;
 `;
@@ -6197,8 +6187,8 @@ var ObjectSearchListItem = ({
     }
     return onSelectItem([selectedItem]);
   };
-  const selected = selectedListItems.some((item) => item.id === id);
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { role: "listitem", css: ObjectListItemContainer, children: [
+  const hideWhenInSelectedList = selectedListItems.some((item) => item.id === id);
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { role: "listitem", hidden: hideWhenInSelectedList, css: ObjectListItemContainer, children: [
     /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { role: "button", onClick: handleSelectItem, css: ObjectListItemControlledContent, children: [
       !image ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("img", { ...image, loading: (image == null ? void 0 : image.width) && image.height ? "lazy" : "eager" }),
       /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
@@ -6206,10 +6196,7 @@ var ObjectSearchListItem = ({
         /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { css: ObjectListItemTitle, children: title })
       ] })
     ] }),
-    !popoverData ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { css: ObjectListItemInfoContainer, children: [
-      selected ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_design_system28.Chip, { text: "selected", size: "xs" }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_design_system28.Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, iconColor: "default", children: popoverData })
-    ] }),
+    !popoverData ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { css: ObjectListItemInfoContainer, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_design_system28.Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData }) }),
     !children ? null : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { css: ObjectListItemUnControlledContent, children })
   ] });
 };
@@ -6227,9 +6214,9 @@ init_emotion_jsx_shim();
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
 init_emotion_jsx_shim();
-var import_react48 = require("@emotion/react");
+var import_react47 = require("@emotion/react");
 var import_design_system29 = require("@uniformdev/design-system");
-var ButtonStyles = import_react48.css`
+var ButtonStyles = import_react47.css`
   ${import_design_system29.button}
   background: transparent;
   border: 1px solid var(--brand-secondary-1);
@@ -6256,7 +6243,7 @@ var ButtonStyles = import_react48.css`
     text-decoration: none;
   }
 `;
-var ButtonIcon = import_react48.css`
+var ButtonIcon = import_react47.css`
   width: 1rem;
   height: 1rem;
 `;
@@ -6286,8 +6273,8 @@ var LinkButton = ({
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
 init_emotion_jsx_shim();
-var import_react49 = require("@emotion/react");
-var ObjectSearchResultItemContainer = import_react49.css`
+var import_react48 = require("@emotion/react");
+var ObjectSearchResultItemContainer = import_react48.css`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -6303,7 +6290,7 @@ var ObjectSearchResultItemContainer = import_react49.css`
     }
   }
 `;
-var ObjectSearchDragHandle = import_react49.css`
+var ObjectSearchDragHandle = import_react48.css`
   border-left: 2px dotted var(--gray-300);
   border-right: 2px dotted var(--gray-300);
   position: absolute;
@@ -6312,35 +6299,35 @@ var ObjectSearchDragHandle = import_react49.css`
   transition: opacity var(--duration-fast) var(--timing-ease-out);
   opacity: 0;
 `;
-var ObjectSearchResultItemSubtitle = import_react49.css`
+var ObjectSearchResultItemSubtitle = import_react48.css`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectSearchResultItemTitle = import_react49.css`
+var ObjectSearchResultItemTitle = import_react48.css`
   align-items: center;
   color: var(--brand-secondary-1);
   display: flex;
   gap: var(--spacing-xs);
 `;
-var ObjectSearchResultItemTimeStamp = import_react49.css`
+var ObjectSearchResultItemTimeStamp = import_react48.css`
   color: var(--gray-500);
   font-size: var(--fs-xs);
 `;
-var ObjectSearchAuthorStateGroup = import_react49.css`
+var ObjectSearchAuthorStateGroup = import_react48.css`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchUpdateGroup = import_react49.css`
+var ObjectSearchUpdateGroup = import_react48.css`
   display: grid;
 `;
-var ObjectSearchContentContainer = import_react49.css`
+var ObjectSearchContentContainer = import_react48.css`
   display: flex;
   gap: var(--spacing-base);
 `;
-var ObjectSearchImage = import_react49.css`
+var ObjectSearchImage = import_react48.css`
   width: 56px;
   object-fit: contain;
 `;
@@ -6410,26 +6397,22 @@ var import_react_beautiful_dnd3 = require("react-beautiful-dnd");
 
 // src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
 init_emotion_jsx_shim();
-var import_react50 = require("@emotion/react");
-var ObjectSearchResultListContainer = import_react50.css`
+var import_react49 = require("@emotion/react");
+var ObjectSearchResultListContainer = import_react49.css`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
   justify-content: space-between;
 `;
-var ObjectSearchDragContainer = import_react50.css`
+var ObjectSearchDragContainer = import_react49.css`
   margin: 0 0 var(--spacing-sm);
 `;
-var ObjectSearchContainerDragging = import_react50.css`
-  box-shadow: var(--shadow-base);
-  opacity: var(--opacity-50);
-`;
-var ObjectSearchResultListCounterContainer = import_react50.css`
+var ObjectSearchResultListCounterContainer = import_react49.css`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchResultListTitle = import_react50.css`
+var ObjectSearchResultListTitle = import_react49.css`
   font-weight: var(--fw-bold);
   line-height: 1;
 `;
@@ -6442,7 +6425,7 @@ function ObjectSearchResultList({
   onRemoveAllSelected,
   hideRemoveButton = false,
   additionalButtons,
-  renderResultComponent = (value) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ObjectSearchResultItem, { ...value }),
+  renderResultComponent = (value) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ObjectSearchResultItem, { ...value, disableDnD }),
   multiSelectId,
   disableDnD = false,
   whenNothingSelected = null
@@ -6485,31 +6468,18 @@ function ObjectSearchResultList({
     ] }),
     !selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react_beautiful_dnd3.DragDropContext, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react_beautiful_dnd3.Droppable, { droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select", children: (provided) => /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
       selectedListItems.map((item, i2) => {
-        const itemValues = selectedListItems.length === 1 ? { ...item, disableDnD: true } : { ...item, disableDnD };
-        const renderListItem = renderResultComponent(itemValues);
-        return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-          import_react_beautiful_dnd3.Draggable,
+        const renderListItem = renderResultComponent(item);
+        return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react_beautiful_dnd3.Draggable, { draggableId: item.id, index: i2, isDragDisabled: disableDnD, children: (provided2, snapshot) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+          "div",
           {
-            draggableId: item.id,
-            index: i2,
-            isDragDisabled: selectedListItems.length === 1 || disableDnD,
-            children: (provided2, snapshot) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-              "div",
-              {
-                css: [
-                  ObjectSearchDragContainer,
-                  snapshot.isDragging ? ObjectSearchContainerDragging : void 0
-                ],
-                ref: provided2.innerRef,
-                "data-dragging": snapshot.isDragging,
-                ...provided2.draggableProps,
-                ...provided2.dragHandleProps,
-                children: renderListItem
-              }
-            )
-          },
-          item.id
-        );
+            css: ObjectSearchDragContainer,
+            ref: provided2.innerRef,
+            "data-dragging": snapshot.isDragging,
+            ...provided2.draggableProps,
+            ...provided2.dragHandleProps,
+            children: renderListItem
+          }
+        ) }, item.id);
       }),
       provided.placeholder
     ] }) }) })
@@ -6519,7 +6489,7 @@ function ObjectSearchResultList({
 // src/components/ObjectSearch/QueryFilter.tsx
 init_emotion_jsx_shim();
 var import_design_system32 = require("@uniformdev/design-system");
-var import_react51 = require("react");
+var import_react50 = require("react");
 var import_jsx_runtime56 = require("@emotion/react/jsx-runtime");
 var QueryFilter = ({
   requireContentType,
@@ -6551,7 +6521,7 @@ var QueryFilter = ({
 }) => {
   var _a, _b, _c, _d;
   const { query, onSetQuery } = useObjectSearchContext();
-  const [queryState, setQueryState] = (0, import_react51.useState)({
+  const [queryState, setQueryState] = (0, import_react50.useState)({
     contentType: "",
     keyword: "",
     count: countValue != null ? countValue : 5,
@@ -6562,7 +6532,7 @@ var QueryFilter = ({
     setQueryState((prev) => ({ ...prev, ...value }));
     onSetQuery({ ...query, ...value });
   };
-  (0, import_react51.useEffect)(() => {
+  (0, import_react50.useEffect)(() => {
     onSetQuery(queryState);
   }, [onSetQuery, queryState]);
   return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("fieldset", { children: [

package/dist/index.mjs

@@ -4548,7 +4548,6 @@ var DataRefreshButton = ({
 
 // src/components/ObjectSearch/ObjectSearchContainer.tsx
 init_emotion_jsx_shim();
-import { css as css28 } from "@emotion/react";
 
 // ../canvas/dist/index.mjs
 init_emotion_jsx_shim();
@@ -5835,19 +5834,7 @@ var ObjectSearchContainer = ({
   const { flatVariables } = useVariables(true);
   const body = /* @__PURE__ */ jsxs29(VerticalRhythm, { children: [
     searchFilters,
-    !resultList ? null : /* @__PURE__ */ jsx49(
-      ScrollableList,
-      {
-        role: "list",
-        css: css28`
-            > div {
-              transition: max-height var(--duration-slow) var(--timing-ease-out);
-              max-height: ${selectedListItems.length === 0 ? "50vh" : "184px"};
-            }
-          `,
-        children: resultList
-      }
-    )
+    !resultList ? null : /* @__PURE__ */ jsx49(ScrollableList, { role: "list", children: resultList })
   ] });
   const handleSelectedVariableChange = (selectedValue) => {
     var _a2;
@@ -5898,8 +5885,8 @@ import { useState as useState13 } from "react";
 
 // src/components/ObjectSearch/styles/ObjectSearchFilterContainer.styles.ts
 init_emotion_jsx_shim();
-import { css as css29 } from "@emotion/react";
-var ObjectSearchFilterContainerLabel = css29`
+import { css as css28 } from "@emotion/react";
+var ObjectSearchFilterContainerLabel = css28`
   align-items: center;
   display: flex;
   font-size: var(--fs-sm);
@@ -5907,14 +5894,14 @@ var ObjectSearchFilterContainerLabel = css29`
   line-height: 1rem;
   margin-bottom: var(--spacing-sm);
 `;
-var ObjectSearchFilterContainer = css29`
+var ObjectSearchFilterContainer = css28`
   display: grid;
   gap: var(--spacing-base);
 `;
-var ObjectSearchFilterDropdownAndTextSearch = css29`
+var ObjectSearchFilterDropdownAndTextSearch = css28`
   grid-template-columns: 0.5fr 1fr;
 `;
-var ObjectSearchFilterGrid = (gridColumns) => css29`
+var ObjectSearchFilterGrid = (gridColumns) => css28`
   display: grid;
   grid-template-columns: ${gridColumns};
   gap: var(--spacing-base);
@@ -5984,22 +5971,26 @@ var ObjectSearchFilterContainer2 = ({ label, children }) => {
 
 // src/components/ObjectSearch/ObjectSearchListItem.tsx
 init_emotion_jsx_shim();
-import { Chip, Popover } from "@uniformdev/design-system";
+import { Popover } from "@uniformdev/design-system";
 
 // src/components/ObjectSearch/styles/ObjectSearchListItem.styles.ts
 init_emotion_jsx_shim();
-import { css as css30 } from "@emotion/react";
+import { css as css29 } from "@emotion/react";
 import { skeletonLoading } from "@uniformdev/design-system";
-var ObjectListItemContainer = css30`
+var ObjectListItemContainer = css29`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
   background: var(--white);
   display: grid;
-  grid-template-columns: 1fr auto;
+  grid-template-columns: 1fr 32px;
   padding: var(--spacing-sm);
+
+  &[hidden] {
+    display: none;
+  }
 `;
-var ObjectListItemLoading = css30`
+var ObjectListItemLoading = css29`
   animation: ${skeletonLoading} 1s linear infinite alternate;
   border-color: transparent;
   min-height: 42px;
@@ -6023,32 +6014,31 @@ var ObjectListItemLoading = css30`
     width: 1rem;
   }
 `;
-var ObjectListItemHeadingGroup = css30`
+var ObjectListItemHeadingGroup = css29`
   align-items: center;
   display: grid;
 `;
-var ObjectListItemTitle = css30`
+var ObjectListItemTitle = css29`
   color: var(--brand-secondary-1);
   display: block;
   font-size: var(--fs-sm);
 `;
-var ObjectListItemSubtitle = css30`
+var ObjectListItemSubtitle = css29`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectListItemInfoContainer = css30`
+var ObjectListItemInfoContainer = css29`
   align-items: center;
   display: flex;
-  gap: var(--spacing-sm);
   justify-content: center;
 `;
-var ObjectListItemControlledContent = css30`
+var ObjectListItemControlledContent = css29`
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectListItemUnControlledContent = css30`
+var ObjectListItemUnControlledContent = css29`
   margin-top: var(--spacing-sm);
   grid-column: 1 / -1;
 `;
@@ -6076,8 +6066,8 @@ var ObjectSearchListItem = ({
     }
     return onSelectItem([selectedItem]);
   };
-  const selected = selectedListItems.some((item) => item.id === id);
-  return /* @__PURE__ */ jsxs32("div", { role: "listitem", css: ObjectListItemContainer, children: [
+  const hideWhenInSelectedList = selectedListItems.some((item) => item.id === id);
+  return /* @__PURE__ */ jsxs32("div", { role: "listitem", hidden: hideWhenInSelectedList, css: ObjectListItemContainer, children: [
     /* @__PURE__ */ jsxs32("div", { role: "button", onClick: handleSelectItem, css: ObjectListItemControlledContent, children: [
       !image ? null : /* @__PURE__ */ jsx52("img", { ...image, loading: (image == null ? void 0 : image.width) && image.height ? "lazy" : "eager" }),
       /* @__PURE__ */ jsxs32("div", { role: "heading", css: ObjectListItemHeadingGroup, children: [
@@ -6085,10 +6075,7 @@ var ObjectSearchListItem = ({
         /* @__PURE__ */ jsx52("span", { css: ObjectListItemTitle, children: title })
       ] })
     ] }),
-    !popoverData ? null : /* @__PURE__ */ jsxs32("div", { css: ObjectListItemInfoContainer, children: [
-      selected ? /* @__PURE__ */ jsx52(Chip, { text: "selected", size: "xs" }) : null,
-      /* @__PURE__ */ jsx52(Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, iconColor: "default", children: popoverData })
-    ] }),
+    !popoverData ? null : /* @__PURE__ */ jsx52("div", { css: ObjectListItemInfoContainer, children: /* @__PURE__ */ jsx52(Popover, { baseId: title, ariaLabel: title, buttonText: `See ${title} details`, children: popoverData }) }),
     !children ? null : /* @__PURE__ */ jsx52("div", { css: ObjectListItemUnControlledContent, children })
   ] });
 };
@@ -6106,9 +6093,9 @@ init_emotion_jsx_shim();
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItemButton.styles.ts
 init_emotion_jsx_shim();
-import { css as css31 } from "@emotion/react";
+import { css as css30 } from "@emotion/react";
 import { button as button2 } from "@uniformdev/design-system";
-var ButtonStyles = css31`
+var ButtonStyles = css30`
   ${button2}
   background: transparent;
   border: 1px solid var(--brand-secondary-1);
@@ -6135,7 +6122,7 @@ var ButtonStyles = css31`
     text-decoration: none;
   }
 `;
-var ButtonIcon = css31`
+var ButtonIcon = css30`
   width: 1rem;
   height: 1rem;
 `;
@@ -6165,8 +6152,8 @@ var LinkButton = ({
 
 // src/components/ObjectSearch/styles/ObjectSearchResultItem.styles.ts
 init_emotion_jsx_shim();
-import { css as css32 } from "@emotion/react";
-var ObjectSearchResultItemContainer = css32`
+import { css as css31 } from "@emotion/react";
+var ObjectSearchResultItemContainer = css31`
   align-items: center;
   border: 1px solid var(--gray-300);
   border-radius: var(--rounded-base);
@@ -6182,7 +6169,7 @@ var ObjectSearchResultItemContainer = css32`
     }
   }
 `;
-var ObjectSearchDragHandle = css32`
+var ObjectSearchDragHandle = css31`
   border-left: 2px dotted var(--gray-300);
   border-right: 2px dotted var(--gray-300);
   position: absolute;
@@ -6191,35 +6178,35 @@ var ObjectSearchDragHandle = css32`
   transition: opacity var(--duration-fast) var(--timing-ease-out);
   opacity: 0;
 `;
-var ObjectSearchResultItemSubtitle = css32`
+var ObjectSearchResultItemSubtitle = css31`
   color: var(--gray-500);
   display: block;
   font-size: var(--fs-xs);
   line-height: 1;
 `;
-var ObjectSearchResultItemTitle = css32`
+var ObjectSearchResultItemTitle = css31`
   align-items: center;
   color: var(--brand-secondary-1);
   display: flex;
   gap: var(--spacing-xs);
 `;
-var ObjectSearchResultItemTimeStamp = css32`
+var ObjectSearchResultItemTimeStamp = css31`
   color: var(--gray-500);
   font-size: var(--fs-xs);
 `;
-var ObjectSearchAuthorStateGroup = css32`
+var ObjectSearchAuthorStateGroup = css31`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchUpdateGroup = css32`
+var ObjectSearchUpdateGroup = css31`
   display: grid;
 `;
-var ObjectSearchContentContainer = css32`
+var ObjectSearchContentContainer = css31`
   display: flex;
   gap: var(--spacing-base);
 `;
-var ObjectSearchImage = css32`
+var ObjectSearchImage = css31`
   width: 56px;
   object-fit: contain;
 `;
@@ -6289,26 +6276,22 @@ import { DragDropContext as DragDropContext3, Draggable as Draggable3, Droppable
 
 // src/components/ObjectSearch/styles/ObjectSearchResultList.styles.ts
 init_emotion_jsx_shim();
-import { css as css33 } from "@emotion/react";
-var ObjectSearchResultListContainer = css33`
+import { css as css32 } from "@emotion/react";
+var ObjectSearchResultListContainer = css32`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
   justify-content: space-between;
 `;
-var ObjectSearchDragContainer = css33`
+var ObjectSearchDragContainer = css32`
   margin: 0 0 var(--spacing-sm);
 `;
-var ObjectSearchContainerDragging = css33`
-  box-shadow: var(--shadow-base);
-  opacity: var(--opacity-50);
-`;
-var ObjectSearchResultListCounterContainer = css33`
+var ObjectSearchResultListCounterContainer = css32`
   align-items: center;
   display: flex;
   gap: var(--spacing-sm);
 `;
-var ObjectSearchResultListTitle = css33`
+var ObjectSearchResultListTitle = css32`
   font-weight: var(--fw-bold);
   line-height: 1;
 `;
@@ -6321,7 +6304,7 @@ function ObjectSearchResultList({
   onRemoveAllSelected,
   hideRemoveButton = false,
   additionalButtons,
-  renderResultComponent = (value) => /* @__PURE__ */ jsx55(ObjectSearchResultItem, { ...value }),
+  renderResultComponent = (value) => /* @__PURE__ */ jsx55(ObjectSearchResultItem, { ...value, disableDnD }),
   multiSelectId,
   disableDnD = false,
   whenNothingSelected = null
@@ -6364,31 +6347,18 @@ function ObjectSearchResultList({
     ] }),
     !selectedListItems.length ? whenNothingSelected : /* @__PURE__ */ jsx55(DragDropContext3, { onDragEnd: (res) => onDragEnd(res), children: /* @__PURE__ */ jsx55(Droppable3, { droppableId: multiSelectId != null ? multiSelectId : "canvas-multi-select", children: (provided) => /* @__PURE__ */ jsxs35("div", { ...provided.droppableProps, ref: provided.innerRef, children: [
       selectedListItems.map((item, i2) => {
-        const itemValues = selectedListItems.length === 1 ? { ...item, disableDnD: true } : { ...item, disableDnD };
-        const renderListItem = renderResultComponent(itemValues);
-        return /* @__PURE__ */ jsx55(
-          Draggable3,
+        const renderListItem = renderResultComponent(item);
+        return /* @__PURE__ */ jsx55(Draggable3, { draggableId: item.id, index: i2, isDragDisabled: disableDnD, children: (provided2, snapshot) => /* @__PURE__ */ jsx55(
+          "div",
           {
-            draggableId: item.id,
-            index: i2,
-            isDragDisabled: selectedListItems.length === 1 || disableDnD,
-            children: (provided2, snapshot) => /* @__PURE__ */ jsx55(
-              "div",
-              {
-                css: [
-                  ObjectSearchDragContainer,
-                  snapshot.isDragging ? ObjectSearchContainerDragging : void 0
-                ],
-                ref: provided2.innerRef,
-                "data-dragging": snapshot.isDragging,
-                ...provided2.draggableProps,
-                ...provided2.dragHandleProps,
-                children: renderListItem
-              }
-            )
-          },
-          item.id
-        );
+            css: ObjectSearchDragContainer,
+            ref: provided2.innerRef,
+            "data-dragging": snapshot.isDragging,
+            ...provided2.draggableProps,
+            ...provided2.dragHandleProps,
+            children: renderListItem
+          }
+        ) }, item.id);
       }),
       provided.placeholder
     ] }) }) })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/mesh-sdk-react",
-  "version": "19.22.1-alpha.8+a8f730b12",
+  "version": "19.23.0",
   "description": "Uniform Mesh Framework SDK for React",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -44,8 +44,8 @@
   },
   "dependencies": {
     "@hookform/resolvers": "^3.0.1",
-    "@uniformdev/design-system": "19.22.1-alpha.8+a8f730b12",
-    "@uniformdev/mesh-sdk": "19.22.1-alpha.8+a8f730b12",
+    "@uniformdev/design-system": "19.23.0",
+    "@uniformdev/mesh-sdk": "19.23.0",
     "mitt": "^3.0.0",
     "react-beautiful-dnd": "13.1.1",
     "react-hook-form": "^7.43.9",
@@ -77,5 +77,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "a8f730b12035a4d7c2e6a704d3777ff12df52ffc"
+  "gitHead": "35c696a78e1909a73bc290663603d015927bbe28"
 }