@valu/block-components 0.4.0 → 0.5.1

package/dist/components/document-picker/index.cjs

@@ -59,6 +59,7 @@ var tokens = {
   transitionFast: "120ms ease-out",
   fontSizeBody: "13px",
   fontSizeSmall: "11px",
+  fontWeightRegular: 400,
   fontWeightMedium: 500,
   fontWeightBold: 600
 };
@@ -75,6 +76,8 @@ react.css`
 	white-space: nowrap;
 `;
 styled__default.default.div`
+	width: 100%;
+	min-width: 0;
 	color: ${tokens.fg};
 	font-size: ${tokens.fontSizeBody};
 
@@ -197,6 +200,11 @@ var PrimaryText = styled__default.default.span`
 	line-height: 1.3;
 	transition: color ${tokens.transitionFast};
 `;
+var SelectedTitle = styled__default.default(PrimaryText)`
+	font-weight: ${tokens.fontWeightRegular};
+	white-space: normal;
+	overflow-wrap: anywhere;
+`;
 styled__default.default.li`
 	display: flex;
 	align-items: center;
@@ -306,6 +314,10 @@ var ActionColumn = styled__default.default.div`
 	gap: ${tokens.spaceXs};
 	margin-left: auto;
 `;
+styled__default.default.span`
+	display: flex;
+	flex-direction: column;
+`;
 var SelectedListEl = styled__default.default.ul`
 	list-style: none;
 	margin: ${tokens.spaceSm} 0 0;
@@ -317,8 +329,8 @@ var SelectedListEl = styled__default.default.ul`
 styled__default.default.li`
 	display: flex;
 	align-items: center;
-	gap: ${tokens.spaceSm};
-	padding: 2px ${tokens.spaceSm};
+	gap: ${tokens.spaceXs};
+	padding: 6px ${tokens.spaceXs};
 	background: ${({ missing }) => missing ? tokens.dangerSoft : tokens.bg};
 	border: 1px solid ${({ missing }) => missing ? tokens.dangerLine : tokens.gray300};
 	border-radius: ${tokens.radiusMd};
@@ -466,8 +478,8 @@ var SelectedRow2 = styled__default.default.li`
 	container-name: valu-dp-row;
 	display: flex;
 	align-items: center;
-	gap: ${tokens.spaceSm};
-	padding: 2px ${tokens.spaceSm};
+	gap: ${tokens.spaceXs};
+	padding: 6px ${tokens.spaceXs};
 	background: ${({ missing }) => missing ? tokens.dangerSoft : tokens.bg};
 	border: 1px solid ${({ missing }) => missing ? tokens.dangerLine : tokens.gray300};
 	border-radius: ${tokens.radiusMd};
@@ -607,6 +619,8 @@ var LabelEditBody = styled__default.default.div`
 	}
 `;
 var Root2 = styled__default.default.div`
+	width: 100%;
+	min-width: 0;
 	color: ${tokens.fg};
 	font-size: ${tokens.fontSizeBody};
 
@@ -1885,7 +1899,7 @@ var SelectedItem = ({
           /* @__PURE__ */ jsxRuntime.jsx(FilenameText, { title: item.filename, children: metaParts.join(" \xB7 ") })
         ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
           /* @__PURE__ */ jsxRuntime.jsxs(DocRowBody, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(PrimaryText, { muted: isMissing, title: displayName, children: isMissing ? missingLabel : displayName }),
+            /* @__PURE__ */ jsxRuntime.jsx(SelectedTitle, { muted: isMissing, title: displayName, children: isMissing ? missingLabel : displayName }),
             !isMissing ? /* @__PURE__ */ jsxRuntime.jsx(FilenameText, { title: item.filename, children: item.filename }) : null
           ] }),
           !isMissing && (showFileSize || modified) ? /* @__PURE__ */ jsxRuntime.jsxs(DocMetaInline, { children: [
@@ -1950,7 +1964,7 @@ var useResolvedDocuments = (value) => {
           "attachment",
           item.id
         ]);
-        out[item.id] = { record: record ?? null, resolved };
+        out[item.id] = resolved ? record ?? null : void 0;
       }
       return out;
     },
@@ -1958,10 +1972,8 @@ var useResolvedDocuments = (value) => {
   );
   return react$1.useMemo(
     () => value.map((item) => {
-      const entry = records[item.id];
-      if (!entry) return item;
-      const { record, resolved } = entry;
-      if (!resolved) return item;
+      const record = records[item.id];
+      if (record === void 0) return item;
       if (!record) return { ...item, missing: "deleted" };
       const fresh = mapMediaToDocumentItem(
         record