@box/metadata-view 1.26.1 → 1.28.0

package/dist/esm/lib/components/item-action-menu/item-action-menu.js

@@ -1,127 +1,127 @@
-import T, { useMemo as j } from "react";
-import { useIntl as y } from "react-intl";
-import { IconButton as I, Tooltip as z, DropdownMenu as r, GridList as f } from "@box/blueprint-web";
-import { Ellipsis as W } from "@box/blueprint-web-assets/icons/Fill";
-import { V as h } from "../../../../chunks/types.js";
-import { getDataTargetId as l } from "./identifier.js";
-import $ from "./messages.js";
-import { jsxs as i, jsx as n } from "react/jsx-runtime";
-import '../../../../styles/item-action-menu.css';const G = "_tableActionBar_akgtp_1", V = "_actionItemIcon_akgtp_6", g = {
-  tableActionBar: G,
-  actionItemIcon: V
+import x, { useMemo as N } from "react";
+import { useIntl as j } from "react-intl";
+import { IconButton as p, Tooltip as y, DropdownMenu as e, GridList as I } from "@box/blueprint-web";
+import { Ellipsis as T } from "@box/blueprint-web-assets/icons/Fill";
+import { V as b } from "../../../../chunks/types.js";
+import { getDataTargetId as r } from "./identifier.js";
+import _ from "./messages.js";
+import { jsxs as l, jsx as t } from "react/jsx-runtime";
+import '../../../../styles/item-action-menu.css';const z = "_tableActionBar_akgtp_1", G = "_actionItemIcon_akgtp_6", A = {
+  tableActionBar: z,
+  actionItemIcon: G
 };
-function A(c) {
-  return (t) => {
-    t.stopPropagation(), c();
+function R(a) {
+  return (i) => {
+    i.stopPropagation(), a();
   };
 }
-function x({
-  item: c,
-  label: t,
-  onClick: m,
-  icon: o,
+function L({
+  item: a,
+  label: i,
+  onClick: s,
+  icon: n,
   isDisabled: d
 }) {
-  const p = A(() => {
-    m(c);
-  }), s = j(() => (d == null ? void 0 : d(c)) ?? !1, [d, c]);
-  return /* @__PURE__ */ i(r.Item, {
-    "data-target-id": l(r.Item, t),
-    disabled: s,
-    onClick: p,
-    children: [/* @__PURE__ */ n(o, {
-      className: g.actionItemIcon
-    }), t]
-  }, t);
+  const u = R(() => {
+    s(a);
+  }), m = N(() => d?.(a) ?? !1, [d, a]);
+  return /* @__PURE__ */ l(e.Item, {
+    "data-target-id": r(e.Item, i),
+    disabled: m,
+    onClick: u,
+    children: [/* @__PURE__ */ t(n, {
+      className: A.actionItemIcon
+    }), i]
+  }, i);
 }
-function O({
-  actions: c,
-  inlineActions: t,
-  isDisabled: m,
-  item: o,
+function K({
+  actions: a,
+  inlineActions: i,
+  isDisabled: s,
+  item: n,
   onOpenChange: d,
-  subMenuActions: p,
-  subMenuTrigger: s,
-  viewMode: b = h.LIST
+  subMenuActions: u,
+  subMenuTrigger: m,
+  viewMode: g = b.LIST
 }) {
   const {
-    formatMessage: k
-  } = y(), {
-    label: N,
-    icon: _
-  } = s || {};
-  return /* @__PURE__ */ i("div", {
-    className: g.tableActionBar,
-    children: [b === h.LIST && (t == null ? void 0 : t.map(({
-      onClick: a,
-      label: e,
-      icon: M,
-      isDisabled: u,
-      getTooltipContent: B
+    formatMessage: B
+  } = j(), {
+    label: W,
+    icon: S
+  } = m || {};
+  return /* @__PURE__ */ l("div", {
+    className: A.tableActionBar,
+    children: [g === b.LIST && i?.map(({
+      onClick: o,
+      label: c,
+      icon: f,
+      isDisabled: h,
+      getTooltipContent: $
     }) => {
-      const S = B == null ? void 0 : B(o), L = `${o.id}-${e}`, C = (u == null ? void 0 : u(o)) ?? !1, R = /* @__PURE__ */ n(I, {
-        accessibleWhenDisabled: C && !!S || void 0,
-        "aria-label": e,
-        "data-target-id": l(I, e),
+      const M = $?.(n), k = `${n.id}-${c}`, C = h?.(n) ?? !1, D = /* @__PURE__ */ t(p, {
+        accessibleWhenDisabled: C && !!M || void 0,
+        "aria-label": c,
+        "data-target-id": r(p, c),
         disabled: C,
-        icon: M,
-        onClick: A(() => a(o)),
+        icon: f,
+        onClick: R(() => o(n)),
         size: "large"
       });
-      return S ? /* @__PURE__ */ n(z, {
-        content: S,
-        children: R
-      }, L) : /* @__PURE__ */ n(T.Fragment, {
-        children: R
-      }, L);
-    })), c ? /* @__PURE__ */ i(r.Root, {
+      return M ? /* @__PURE__ */ t(y, {
+        content: M,
+        children: D
+      }, k) : /* @__PURE__ */ t(x.Fragment, {
+        children: D
+      }, k);
+    }), a ? /* @__PURE__ */ l(e.Root, {
       onOpenChange: d,
-      children: [/* @__PURE__ */ n(r.Trigger, {
-        children: b === h.LIST ? /* @__PURE__ */ n(I, {
-          "aria-label": k($.actionMenu),
-          "data-target-id": l(I, "openActionMenu"),
-          disabled: m,
-          icon: W,
+      children: [/* @__PURE__ */ t(e.Trigger, {
+        children: g === b.LIST ? /* @__PURE__ */ t(p, {
+          "aria-label": B(_.actionMenu),
+          "data-target-id": r(p, "openActionMenu"),
+          disabled: s,
+          icon: T,
           size: "large"
-        }) : /* @__PURE__ */ n(f.ActionIconButton, {
-          "aria-label": k($.actionMenu),
-          "data-target-id": l(f.ActionIconButton, "openActionMenu"),
-          disabled: m,
-          icon: W
+        }) : /* @__PURE__ */ t(I.ActionIconButton, {
+          "aria-label": B(_.actionMenu),
+          "data-target-id": r(I.ActionIconButton, "openActionMenu"),
+          disabled: s,
+          icon: T
         })
-      }), /* @__PURE__ */ i(r.Content, {
+      }), /* @__PURE__ */ l(e.Content, {
         align: "start",
-        children: [c.map((a) => /* @__PURE__ */ n(x, {
-          item: o,
-          ...a
-        }, a.label)), p && s && /* @__PURE__ */ i(r.SubMenuRoot, {
-          children: [/* @__PURE__ */ i(r.SubMenuTrigger, {
-            "data-target-id": l(r.SubMenuTrigger, "openActionSubmenu"),
-            children: [_ && /* @__PURE__ */ n(_, {
-              className: g.actionItemIcon
-            }), N]
-          }), /* @__PURE__ */ n(r.SubMenuContent, {
-            children: p.map((a) => /* @__PURE__ */ n(x, {
-              item: o,
-              ...a
-            }, a.label))
+        children: [a.map((o) => /* @__PURE__ */ t(L, {
+          item: n,
+          ...o
+        }, o.label)), u && m && /* @__PURE__ */ l(e.SubMenuRoot, {
+          children: [/* @__PURE__ */ l(e.SubMenuTrigger, {
+            "data-target-id": r(e.SubMenuTrigger, "openActionSubmenu"),
+            children: [S && /* @__PURE__ */ t(S, {
+              className: A.actionItemIcon
+            }), W]
+          }), /* @__PURE__ */ t(e.SubMenuContent, {
+            children: u.map((o) => /* @__PURE__ */ t(L, {
+              item: n,
+              ...o
+            }, o.label))
           })]
         })]
       })]
-    }) : null, b === h.GRID && (t == null ? void 0 : t.map(({
-      onClick: a,
-      label: e,
-      icon: M,
-      isDisabled: u
-    }) => /* @__PURE__ */ n(f.ActionIconButton, {
-      "aria-label": e,
-      "data-target-id": l(f.ActionIconButton, e),
-      disabled: (u == null ? void 0 : u(o)) ?? !1,
-      icon: M,
-      onClick: () => a(o)
-    }, `${o.id}-${e}`)))]
+    }) : null, g === b.GRID && i?.map(({
+      onClick: o,
+      label: c,
+      icon: f,
+      isDisabled: h
+    }) => /* @__PURE__ */ t(I.ActionIconButton, {
+      "aria-label": c,
+      "data-target-id": r(I.ActionIconButton, c),
+      disabled: h?.(n) ?? !1,
+      icon: f,
+      onClick: () => o(n)
+    }, `${n.id}-${c}`))]
   });
 }
 export {
-  O as ItemActionMenu
+  K as ItemActionMenu
 };

package/dist/esm/lib/components/metadata-grid/metadata-grid.js

@@ -1,57 +1,56 @@
 import { GridList as i } from "@box/blueprint-web";
-import { ItemTypeIcon as T } from "@box/item-icon";
-import { useIntl as b } from "react-intl";
-import { V as E } from "../../../../chunks/types.js";
-import { THUMBNAIL_GRID_VIEW_SIZES as p } from "../constants.js";
-import R from "./messages.js";
-import { jsx as t, jsxs as f } from "react/jsx-runtime";
-import { ItemActionMenu as L } from "../item-action-menu/item-action-menu.js";
-import '../../../../styles/metadata-grid.css';const M = "_itemThumbnail_93ess_1", A = {
-  itemThumbnail: M
-}, G = 188, g = 250, x = 8, D = 5, S = (r) => G + g * (x - r) / D, N = ({
+import { ItemTypeIcon as u } from "@box/item-icon";
+import { useIntl as I } from "react-intl";
+import { V as h } from "../../../../chunks/types.js";
+import { THUMBNAIL_GRID_VIEW_SIZES as T } from "../constants.js";
+import b from "./messages.js";
+import { jsx as t, jsxs as E } from "react/jsx-runtime";
+import { ItemActionMenu as p } from "../item-action-menu/item-action-menu.js";
+import '../../../../styles/metadata-grid.css';const R = "_itemThumbnail_93ess_1", f = {
+  itemThumbnail: R
+}, L = 188, M = 250, A = 8, G = 5, g = (r) => L + M * (A - r) / G, O = ({
   items: r,
   itemActionMenuProps: n,
-  zoomLevel: c,
-  areSelectionCheckboxesDisabled: _,
-  ...d
+  zoomLevel: o,
+  areSelectionCheckboxesDisabled: l,
+  ...a
 }) => {
   const {
-    formatMessage: u
-  } = b();
+    formatMessage: c
+  } = I();
   return /* @__PURE__ */ t(i, {
-    "aria-label": u(R.gridView),
+    "aria-label": c(b.gridView),
     items: r,
     style: {
-      gridTemplateColumns: `repeat(auto-fit, minmax(${S(p[c])}px, 1fr))`
+      gridTemplateColumns: `repeat(auto-fit, minmax(${g(T[o])}px, 1fr))`
     },
-    ...d,
+    ...a,
     children: (e) => {
-      var o, l, a;
       const {
         name: m,
-        createdAt: I
-      } = e, s = "thumbnailURLs" in e ? ((o = e.thumbnailURLs) == null ? void 0 : o.large) || ((l = e.thumbnailURLs) == null ? void 0 : l.medium) || ((a = e.thumbnailURLs) == null ? void 0 : a.small) : void 0;
-      return /* @__PURE__ */ f(i.Item, {
+        createdAt: _
+      } = e, s = "thumbnailURLs" in e ? e.thumbnailURLs?.large || e.thumbnailURLs?.medium || e.thumbnailURLs?.small : void 0;
+      return /* @__PURE__ */ E(i.Item, {
         textValue: m,
         children: [/* @__PURE__ */ t(i.Thumbnail, {
-          className: A.itemThumbnail,
+          className: f.itemThumbnail,
           children: s ? /* @__PURE__ */ t("img", {
             alt: m,
             src: s
-          }) : /* @__PURE__ */ t(T, {
+          }) : /* @__PURE__ */ t(u, {
             item: e
           })
         }), /* @__PURE__ */ t(i.Header, {
           children: m
         }), /* @__PURE__ */ t(i.Subtitle, {
-          children: I
+          children: _
         }), /* @__PURE__ */ t(i.Actions, {
-          isSelectionCheckboxDisabled: _,
-          children: n ? (h) => /* @__PURE__ */ t(L, {
+          isSelectionCheckboxDisabled: l,
+          children: n ? (d) => /* @__PURE__ */ t(p, {
             ...n,
             item: e,
-            onOpenChange: h,
-            viewMode: E.GRID
+            onOpenChange: d,
+            viewMode: h.GRID
           }) : null
         })]
       });
@@ -59,5 +58,5 @@ import '../../../../styles/metadata-grid.css';const M = "_itemThumbnail_93ess_1"
   });
 };
 export {
-  N as MetadataGrid
+  O as MetadataGrid
 };

package/dist/esm/lib/components/metadata-table/actionColumn.js

@@ -1,6 +1,6 @@
-function e(n) {
-  return !!n.HeaderActions || (n == null ? void 0 : n.selectionMode) && n.selectionMode !== "none";
+function n(e) {
+  return !!e.HeaderActions || e?.selectionMode && e.selectionMode !== "none";
 }
 export {
-  e as getShouldRenderActionColumn
+  n as getShouldRenderActionColumn
 };

package/dist/esm/lib/components/metadata-table/hooks/useInfiniteScrollTableItems.js

@@ -1,33 +1,30 @@
-import { useRef as S, useMemo as h, useEffect as z } from "react";
-import { useVirtualizer as T } from "@tanstack/react-virtual";
-import { Size14 as p } from "@box/blueprint-web-assets/tokens/px-tokens";
-const b = parseInt(p, 10), _ = ({
+import { useRef as g, useMemo as S, useEffect as h } from "react";
+import { useVirtualizer as z } from "@tanstack/react-virtual";
+import { Size14 as T } from "@box/blueprint-web-assets/tokens/px-tokens";
+const p = parseInt(T, 10), K = ({
   items: t,
   hasNextPage: e = !1,
   isLoading: r = !1,
   parentRef: l,
-  approximateRowHeight: a = b,
+  approximateRowHeight: m = p,
   onGetNextPage: o,
   placeholderRowsCount: c = 20
 }) => {
-  const s = S(0), f = h(() => t.length + (r || e ? c : 0), [t, e, r, c]), u = T({
-    count: f,
+  const s = g(0), a = S(() => t.length + (r || e ? c : 0), [t, e, r, c]), u = z({
+    count: a,
     getScrollElement: () => l.current,
-    getItemKey: (I) => {
-      var m;
-      return ((m = t[I]) == null ? void 0 : m.id) || `table-item-${I}`;
-    },
-    estimateSize: () => a
+    getItemKey: (I) => t[I]?.id || `table-item-${I}`,
+    estimateSize: () => m
   }), n = u.getVirtualItems();
-  z(() => {
+  h(() => {
     s.current = t.length;
   }, [t.length]), (t.length === 0 || t.length > 0 && s.current === 0) && l.current && (l.current.scrollTop = 0);
-  const i = n[n.length - 1], g = !!i && i.index >= t.length - 1;
-  return !r && g && e && o && o(), {
+  const i = n[n.length - 1], f = !!i && i.index >= t.length - 1;
+  return !r && f && e && o && o(), {
     totalVirtualSize: u.getTotalSize(),
     virtualItemsToDisplay: n
   };
 };
 export {
-  _ as useInfiniteScrollTableItems
+  K as useInfiniteScrollTableItems
 };