@box/metadata-view 1.26.1 → 1.27.0

package/dist/chunks/index.js

@@ -1,21 +1,21 @@
-import { Row as y, Cell as s, Text as d, ActionCell as U } from "@box/blueprint-web";
-import h from "lodash/get";
-import { ItemTypeIcon as p } from "@box/item-icon";
-import C from "clsx";
+import { Row as k, Cell as s, Text as r, ActionCell as y } from "@box/blueprint-web";
+import C from "lodash/get";
+import { ItemTypeIcon as h } from "@box/item-icon";
+import p from "clsx";
 import { I as n } from "./types.js";
-import { THUMBNAIL_LIST_VIEW_HEIGHTS as k } from "../esm/lib/components/constants.js";
-import { jsxs as _, jsx as e } from "react/jsx-runtime";
-import { ItemActionMenu as B } from "../esm/lib/components/item-action-menu/item-action-menu.js";
-import '../styles/index.css';const W = "_tableHeaderActionsWrapper_1sntd_1", g = "_tableHeaderActions_1sntd_1", j = "_tableRow_1sntd_33", M = "_isClickable_1sntd_41", $ = "_selectAllCheckbox_1sntd_45", v = "_tableNameCell_1sntd_50", O = "_tableNameCellTitle_1sntd_56", R = "_hasSubtitle_1sntd_60", w = "_tableNameCellText_1sntd_65", D = "_tableNameCellIconInline_1sntd_70", G = "_iconCell_1sntd_74", t = {
-  tableHeaderActionsWrapper: W,
-  tableHeaderActions: g,
-  tableRow: j,
-  isClickable: M,
-  selectAllCheckbox: $,
-  tableNameCell: v,
-  tableNameCellTitle: O,
-  hasSubtitle: R,
-  tableNameCellText: w,
+import { THUMBNAIL_LIST_VIEW_HEIGHTS as R } from "../esm/lib/components/constants.js";
+import { jsxs as d, jsx as e } from "react/jsx-runtime";
+import { ItemActionMenu as w } from "../esm/lib/components/item-action-menu/item-action-menu.js";
+import '../styles/index.css';const U = "_tableHeaderActionsWrapper_1sntd_1", B = "_tableHeaderActions_1sntd_1", W = "_tableRow_1sntd_33", g = "_isClickable_1sntd_41", j = "_selectAllCheckbox_1sntd_45", M = "_tableNameCell_1sntd_50", $ = "_tableNameCellTitle_1sntd_56", v = "_hasSubtitle_1sntd_60", O = "_tableNameCellText_1sntd_65", D = "_tableNameCellIconInline_1sntd_70", G = "_iconCell_1sntd_74", t = {
+  tableHeaderActionsWrapper: U,
+  tableHeaderActions: B,
+  tableRow: W,
+  isClickable: g,
+  selectAllCheckbox: j,
+  tableNameCell: M,
+  tableNameCellTitle: $,
+  hasSubtitle: v,
+  tableNameCellText: O,
   tableNameCellIconInline: D,
   iconCell: G
 }, Z = ({
@@ -24,52 +24,52 @@ import '../styles/index.css';const W = "_tableHeaderActionsWrapper_1sntd_1", g =
   iconColumnVariant: a,
   item: l,
   itemActionMenuProps: b,
-  onTableRowClick: c,
+  onTableRowClick: _,
   shouldRenderActionColumn: u,
   zoomLevel: f = 0
-}) => /* @__PURE__ */ _(y, {
-  className: C(t.tableRow, {
-    [t.isClickable]: c
+}) => /* @__PURE__ */ d(k, {
+  className: p(t.tableRow, {
+    [t.isClickable]: _
   }),
   id: l.id,
-  onAction: () => c == null ? void 0 : c(l),
+  onAction: () => _?.(l),
   children: [a === n.COLUMN ? /* @__PURE__ */ e(s, {
     style: {
-      height: k[f]
+      height: R[f]
     },
-    children: /* @__PURE__ */ e(p, {
+    children: /* @__PURE__ */ e(h, {
       className: t.iconCell,
       item: l
     })
-  }, `item-type-icon-${l.id}`) : null, x.map((o) => {
+  }, `item-type-icon-${l.id}`) : null, x.map((c) => {
     const {
       cellRenderer: m,
-      id: r,
+      id: o,
       isItemMetadata: A,
       subtitle: L,
       textValue: S,
       type: E
-    } = o, i = `${S}-${l.id}`;
+    } = c, i = `${S}-${l.id}`;
     if (m)
       return /* @__PURE__ */ e(s, {
-        children: m(l, o)
+        children: m(l, c)
       }, i);
-    const H = A ? r.split(".")[1] : r, N = h(l, H);
-    if (r === "name" && (a === n.INLINE || a === n.INLINE_SUBTITLE))
+    const H = A ? o.split(".")[1] : o, N = C(l, H);
+    if (o === "name" && (a === n.INLINE || a === n.INLINE_SUBTITLE))
       return /* @__PURE__ */ e(s, {
-        children: /* @__PURE__ */ _("div", {
+        children: /* @__PURE__ */ d("div", {
           className: t.tableNameCell,
-          children: [/* @__PURE__ */ e(p, {
+          children: [/* @__PURE__ */ e(h, {
             item: l
-          }), /* @__PURE__ */ _("div", {
-            className: C(t.tableNameCellTitle, {
+          }), /* @__PURE__ */ d("div", {
+            className: p(t.tableNameCellTitle, {
               [t.hasSubtitle]: a === n.INLINE_SUBTITLE
             }),
-            children: [/* @__PURE__ */ e(d, {
+            children: [/* @__PURE__ */ e(r, {
               as: "span",
               className: t.tableNameCellText,
               children: N
-            }), a === n.INLINE_SUBTITLE ? /* @__PURE__ */ e(d, {
+            }), a === n.INLINE_SUBTITLE ? /* @__PURE__ */ e(r, {
               as: "span",
               className: t.tableNameCellText,
               color: "textOnLightSecondary",
@@ -79,23 +79,23 @@ import '../styles/index.css';const W = "_tableHeaderActionsWrapper_1sntd_1", g =
         })
       }, i);
     if (E === "multiSelect") {
-      const I = h(l, r);
+      const I = C(l, o);
       return /* @__PURE__ */ e(s, {
         children: I ? I.join(" ") : ""
       }, i);
     }
     return /* @__PURE__ */ e(s, {
-      children: /* @__PURE__ */ e(d, {
+      children: /* @__PURE__ */ e(r, {
         as: "span",
         children: N
       })
     }, i);
-  }), u && /* @__PURE__ */ e(U, {
+  }), u && /* @__PURE__ */ e(y, {
     isCheckboxDisabled: T,
-    children: (o) => b ? /* @__PURE__ */ e(B, {
+    children: (c) => b ? /* @__PURE__ */ e(w, {
       ...b,
       item: l,
-      onOpenChange: o
+      onOpenChange: c
     }) : null
   })]
 }, l.id);

package/dist/chunks/types.js

@@ -1,8 +1,8 @@
-let e = /* @__PURE__ */ function(t) {
+let e = /* @__PURE__ */ (function(t) {
   return t.INLINE = "inline", t.COLUMN = "column", t.INLINE_SUBTITLE = "inline-subtitle", t;
-}({}), i = /* @__PURE__ */ function(t) {
+})({}), i = /* @__PURE__ */ (function(t) {
   return t.GRID = "grid", t.LIST = "list", t;
-}({});
+})({});
 export {
   e as I,
   i as V

package/dist/esm/lib/components/filter-row/initial-field-values.js

@@ -1,10 +1,10 @@
-const l = (e) => ({
+const i = (e) => ({
   key: e,
   id: e
 }), d = ({
   fieldType: e,
-  options: t
-}) => ["enum", "multiSelect"].includes(e) ? (t || []).map(l) : [], o = (e) => e === "date" ? {
+  options: u
+}) => ["enum", "multiSelect"].includes(e) ? (u || []).map(i) : [], s = (e) => e === "date" ? {
   customType: "anyTime",
   range: {
     gt: "",
@@ -17,20 +17,19 @@ const l = (e) => ({
   }
 } : {
   enum: []
-}, g = (e, t) => ({
+}, o = (e, u) => ({
   metadata: {
-    fields: e.reduce((a, n) => {
-      var u;
-      const i = (u = t == null ? void 0 : t[n.id]) == null ? void 0 : u.value, r = o(n.fieldType);
-      return a[n.id] = {
-        value: i ?? r,
-        fieldType: n.fieldType,
-        options: d(n)
+    fields: e.reduce((a, t) => {
+      const n = u?.[t.id]?.value, l = s(t.fieldType);
+      return a[t.id] = {
+        value: n ?? l,
+        fieldType: t.fieldType,
+        options: d(t)
       }, a;
     }, {})
   }
 });
 export {
-  o as getDefaultFieldValue,
-  g as getInitialFieldValues
+  s as getDefaultFieldValue,
+  o as getInitialFieldValues
 };

package/dist/esm/lib/components/filter-row/metadata-filter-chip.js

@@ -64,6 +64,7 @@ const w = ({
         return /* @__PURE__ */ t(b, {
           id: e
         });
+    // Non file variant multiselects falls through as enum
     case "enum":
       return /* @__PURE__ */ t(v, {
         fieldNamePrefix: r,

package/dist/esm/lib/components/filter-row/predefinedFilters/index.js

@@ -1,6 +1,6 @@
-let o = /* @__PURE__ */ function(r) {
+let o = /* @__PURE__ */ (function(r) {
   return r.KeywordSearchFilterGroup = "KeywordSearchFilterGroup", r.FileTypeFilterGroup = "FileTypeFilterGroup", r.LocationFilterGroup = "LocationFilterGroup", r;
-}({});
+})({});
 export {
   o as PredefinedFilterName
 };

package/dist/esm/lib/components/filter-row/select-filter-chip.js

@@ -1,60 +1,59 @@
-import { DropdownMenu as s, FilterChip as a } from "@box/blueprint-web";
-import { useFormikContext as V } from "formik";
-import { useState as j } from "react";
-import { useIntl as D } from "react-intl";
-import L from "./messages.js";
-import { jsxs as m, jsx as t } from "react/jsx-runtime";
-const W = ({
-  fieldNamePrefix: v,
-  formRef: x,
-  icon: h,
+import { DropdownMenu as o, FilterChip as c } from "@box/blueprint-web";
+import { useFormikContext as z } from "formik";
+import { useState as A } from "react";
+import { useIntl as O } from "react-intl";
+import S from "./messages.js";
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+const R = ({
+  fieldNamePrefix: p,
+  formRef: C,
+  icon: m,
   id: i,
-  name: l,
-  options: o,
-  type: u,
+  name: h,
+  options: f,
+  type: l,
   placeholder: n
 }) => {
-  var f, p, g, k;
   const {
-    formatMessage: b
-  } = D(), [w, F] = j(!1), {
-    values: I,
-    setFieldValue: y,
-    submitForm: z
-  } = V(), d = (k = (g = (p = (f = I.metadata) == null ? void 0 : f.fields) == null ? void 0 : p[i]) == null ? void 0 : g.value) == null ? void 0 : k.enum, A = Array.isArray(d) ? d : [], e = new Set(A), O = e.size > 0 ? b(L.chipNameWithCount, {
-    name: l,
+    formatMessage: g
+  } = O(), [k, v] = A(!1), {
+    values: x,
+    setFieldValue: b,
+    submitForm: w
+  } = z(), u = x.metadata?.fields?.[i]?.value?.enum, F = Array.isArray(u) ? u : [], e = new Set(F), I = e.size > 0 ? g(S.chipNameWithCount, {
+    name: h,
     count: e.size
-  }) : l, S = !!n && u !== "multiSelect", C = async (r, c) => {
-    u === "enum" ? e.clear() : e.delete(c), r && c !== n && e.add(c), await y(`${v}.value.enum`, Array.from(e)), z();
+  }) : h, y = !!n && l !== "multiSelect", d = async (r, s) => {
+    l === "enum" ? e.clear() : e.delete(s), r && s !== n && e.add(s), await b(`${p}.value.enum`, Array.from(e)), w();
   };
-  return /* @__PURE__ */ m(s.Root, {
-    onOpenChange: F,
-    open: w,
-    children: [/* @__PURE__ */ t(s.Trigger, {
+  return /* @__PURE__ */ a(o.Root, {
+    onOpenChange: v,
+    open: k,
+    children: [/* @__PURE__ */ t(o.Trigger, {
       asChild: !0,
-      children: /* @__PURE__ */ m(a.TriggerChip, {
+      children: /* @__PURE__ */ a(c.TriggerChip, {
         selected: e.size > 0,
         value: i,
-        children: [h && /* @__PURE__ */ t(a.Icon, {
-          icon: h
-        }), /* @__PURE__ */ t(a.Label, {
-          children: O
-        }), /* @__PURE__ */ t(a.DropdownIndicator, {})]
+        children: [m && /* @__PURE__ */ t(c.Icon, {
+          icon: m
+        }), /* @__PURE__ */ t(c.Label, {
+          children: I
+        }), /* @__PURE__ */ t(c.DropdownIndicator, {})]
       }, i)
-    }), /* @__PURE__ */ m(s.Content, {
-      container: x.current,
-      children: [S && /* @__PURE__ */ t(s.CheckboxItem, {
+    }), /* @__PURE__ */ a(o.Content, {
+      container: C.current,
+      children: [y && /* @__PURE__ */ t(o.CheckboxItem, {
         checked: e.size === 0,
-        onCheckedChange: (r) => C(r, n),
+        onCheckedChange: (r) => d(r, n),
         children: n
-      }, n), o == null ? void 0 : o.map((r) => /* @__PURE__ */ t(s.CheckboxItem, {
+      }, n), f?.map((r) => /* @__PURE__ */ t(o.CheckboxItem, {
         checked: e.has(r),
-        onCheckedChange: (c) => C(c, r),
+        onCheckedChange: (s) => d(s, r),
         children: r
       }, r))]
     })]
   });
 };
 export {
-  W as SelectFilterChip
+  R as SelectFilterChip
 };

package/dist/esm/lib/components/filter-sidepanel/filter-side-panel.js

@@ -1,82 +1,82 @@
 import { Filter as x } from "./filter.js";
-import { SidePanel as t, Accordion as u } from "@box/blueprint-web";
+import { SidePanel as t, Accordion as d } from "@box/blueprint-web";
 import { useIntl as j } from "react-intl";
 import { useFormikContext as B } from "formik";
-import k from "lodash/noop";
-import { useState as p } from "react";
-import l from "./messages.js";
-import { jsx as e, jsxs as h } from "react/jsx-runtime";
-import '../../../../styles/filter-side-panel.css';const A = "_sidePanelContent_1j6pr_1", N = "_staticPosition_1j6pr_1", a = {
-  sidePanelContent: A,
-  staticPosition: N
-}, q = ({
-  containerRef: s,
+import R from "lodash/noop";
+import { useState as u } from "react";
+import i from "./messages.js";
+import { jsx as e, jsxs as p } from "react/jsx-runtime";
+import '../../../../styles/filter-side-panel.css';const k = "_sidePanelContent_1j6pr_1", A = "_staticPosition_1j6pr_1", a = {
+  sidePanelContent: k,
+  staticPosition: A
+}, M = ({
+  containerRef: h,
   filterGroups: r,
   isOpen: C,
-  onIsOpenChange: c = k,
-  getInitialFormValues: P
+  onIsOpenChange: s = R,
+  getInitialFormValues: f
 }) => {
   const {
     formatMessage: o
   } = j(), {
-    handleSubmit: F,
-    resetForm: m,
-    values: f
-  } = B(), [S] = p(f), [v, y] = p(null), _ = () => {
-    m({
-      values: P()
+    handleSubmit: P,
+    resetForm: c,
+    values: F
+  } = B(), [S] = u(F), [v, y] = u(null), _ = () => {
+    c({
+      values: f()
     });
   }, b = (n) => {
-    m({
+    c({
       values: S
-    }), c(n);
+    }), s(n);
   }, g = () => {
-    F(), c(!1);
+    P(), s(!1);
   };
   return /* @__PURE__ */ e(t, {
     onOpenChange: b,
     open: C,
     variant: "overlay",
     children: /* @__PURE__ */ e(t.Overlay, {
-      container: s == null ? void 0 : s.current,
-      children: /* @__PURE__ */ h(t.Content, {
+      container: h?.current,
+      children: /* @__PURE__ */ p(t.Content, {
         className: a.sidePanelContent,
         children: [/* @__PURE__ */ e(t.Header, {
           className: a.staticPosition,
-          children: o(l.filtersHeader)
+          children: o(i.filtersHeader)
         }), /* @__PURE__ */ e(t.ScrollableContainer, {
           ref: y,
-          children: /* @__PURE__ */ e(u, {
-            defaultValue: r.map((n, i) => `item-${i}`),
+          children: /* @__PURE__ */ e(d, {
+            defaultValue: r.map((n, l) => `item-${l}`),
             type: "multiple",
-            children: r.map((n, i) => /* @__PURE__ */ e(u.Item, {
+            children: r.map((n, l) => /* @__PURE__ */ e(d.Item, {
               ...n.toggleable ? {} : {
                 fixed: "true"
               },
               title: n.title,
-              value: `item-${i}`,
-              children: n.filters.map((d) => /* @__PURE__ */ e(x, {
-                ...d,
+              value: `item-${l}`,
+              children: n.filters.map((m) => /* @__PURE__ */ e(x, {
+                ...m,
                 parentRef: v
-              }, d.id))
+              }, m.id))
             }, `accordion-item-${n.title || "unnamed"}`))
           })
-        }), /* @__PURE__ */ h(t.Footer, {
+        }), /* @__PURE__ */ p(t.Footer, {
           className: a.staticPosition,
           children: [/* @__PURE__ */ e(t.Footer.SecondaryButton, {
             onClick: _,
-            children: o(l.clearAllButton)
+            children: o(i.clearAllButton)
           }), /* @__PURE__ */ e(t.Footer.PrimaryButton, {
             onClick: g,
-            children: o(l.showResultsButton)
+            children: o(i.showResultsButton)
           })]
         }), /* @__PURE__ */ e(t.Close, {
-          "aria-label": o(l.closeAriaLabel)
+          "aria-label": o(i.closeAriaLabel)
         })]
       })
     })
   });
 };
 export {
-  q as FilterSidePanel
+  M as FilterSidePanel
 };

package/dist/esm/lib/components/filter-sidepanel/filter.js

@@ -1,4 +1,4 @@
-import { MetadataStringField as f, MetadataMultiSelectField as m, MetadataEnumField as s, MetadataFloatField as F, MetadataDateField as M } from "@box/metadata-filter";
+import { MetadataEnumField as f, MetadataMultiSelectField as m, MetadataDateField as s, MetadataFloatField as F, MetadataStringField as M } from "@box/metadata-filter";
 import { useIntl as o } from "react-intl";
 import { MetadataFileField as x } from "../metadata-value/metadata-file-field.js";
 import { MetadataLocationField as b } from "../metadata-value/metadata-location-field.js";
@@ -19,9 +19,10 @@ const i = (e) => `metadata.fields.${e}`, g = ({
         name: t,
         placeholder: l
       });
+    // default case should act same as no variant defined
     case "default":
     default:
-      return /* @__PURE__ */ a(f, {
+      return /* @__PURE__ */ a(M, {
         fieldNamePrefix: i(e),
         label: t || "",
         placeholder: l
@@ -43,6 +44,7 @@ const i = (e) => `metadata.fields.${e}`, g = ({
         id: e,
         name: t
       });
+    // default case should act same as no variant defined
     case "default":
     default:
       return /* @__PURE__ */ a(m, {
@@ -70,6 +72,7 @@ const i = (e) => `metadata.fields.${e}`, g = ({
         renderer: c,
         triggerSetValueCallback: n
       });
+    // default case should act same as no variant defined
     case "radio":
       return /* @__PURE__ */ a(S, {
         id: e,
@@ -78,7 +81,7 @@ const i = (e) => `metadata.fields.${e}`, g = ({
       });
     case "default":
     default:
-      return /* @__PURE__ */ a(s, {
+      return /* @__PURE__ */ a(f, {
         fieldNamePrefix: i(e),
         label: t || "",
         locale: u,
@@ -102,7 +105,7 @@ const i = (e) => `metadata.fields.${e}`, g = ({
   const {
     locale: n
   } = o();
-  return /* @__PURE__ */ a(M, {
+  return /* @__PURE__ */ a(s, {
     canUseRelativeDates: t,
     customDateFilterOptions: l,
     customFieldLabels: e,