@box/metadata-view 0.18.1 → 0.19.0

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

@@ -1,83 +1,86 @@
-import { FilterChip as r } from "@box/blueprint-web";
-import { MetadataBadge as p } from "@box/blueprint-web-assets/icons/Line";
-import { Formik as f, Form as S } from "formik";
-import { useState as g, useRef as v } from "react";
-import b from "./all-filters-chip.js";
-import { StringFilterChip as w } from "./string-filter-chip.js";
-import { jsx as i, jsxs as d } from "react/jsx-runtime";
-const C = (e, s, c) => {
+import { FilterChip as s } from "@box/blueprint-web";
+import { Formik as p, Form as f } from "formik";
+import { useState as S, useRef as g } from "react";
+import v from "./all-filters-chip.js";
+import { StringFilterChip as b } from "./string-filter-chip.js";
+import { jsx as r, jsxs as d } from "react/jsx-runtime";
+const w = (e, c, n) => {
+  const {
+    icon: i
+  } = e;
   switch (e.fieldType) {
     case "float":
     case "string":
-      return /* @__PURE__ */ i(w, {
-        formRef: c,
+      return /* @__PURE__ */ r(b, {
+        formRef: n,
+        icon: i,
         id: e.id,
         name: e.name,
-        selected: s
+        selected: c
       }, e.id);
     case "date":
     case "enum":
     case "multiSelect":
-      return /* @__PURE__ */ d(r.Chip, {
+      return /* @__PURE__ */ d(s.Chip, {
         value: e.id,
-        children: [/* @__PURE__ */ i(r.Icon, {
-          icon: p
-        }), /* @__PURE__ */ i(r.Label, {
+        children: [i && /* @__PURE__ */ r(s.Icon, {
+          icon: i
+        }), /* @__PURE__ */ r(s.Label, {
           children: e.name
         })]
       }, e.id);
     default:
       return null;
   }
-}, G = ({
+}, T = ({
   filterOptions: e,
-  isAllFiltersDisabled: s,
-  onFilterSubmit: c
+  isAllFiltersDisabled: c,
+  onFilterSubmit: n
 }) => {
-  const [n, u] = g([]), o = ([t, l]) => {
-    var a;
-    return ((a = l.value) == null ? void 0 : a.enum) && l.value.enum.length > 0;
+  const [i, u] = S([]), o = ([t, a]) => {
+    var l;
+    return ((l = a.value) == null ? void 0 : l.enum) && a.value.enum.length > 0;
   }, h = ({
     metadata: {
       fields: t
     }
   }) => {
-    const l = Object.entries(t).filter(o).map(([a]) => a);
-    u(l), c(t);
+    const a = Object.entries(t).filter(o).map(([l]) => l);
+    u(a), n(t);
   }, F = {
     metadata: {
-      fields: e.reduce((t, l) => {
-        let a;
-        switch (l.fieldType) {
+      fields: e.reduce((t, a) => {
+        let l;
+        switch (a.fieldType) {
           case "string":
           case "float":
-            a = [""];
+            l = [""];
             break;
           default:
-            a = null;
+            l = null;
         }
-        return t[l.id] = {
-          value: a
+        return t[a.id] = {
+          value: l
         }, t;
       }, {})
     }
-  }, m = v(null);
-  return /* @__PURE__ */ i(f, {
+  }, m = g(null);
+  return /* @__PURE__ */ r(p, {
     initialValues: F,
     onSubmit: h,
-    children: /* @__PURE__ */ i(S, {
+    children: /* @__PURE__ */ r(f, {
       ref: m,
-      children: /* @__PURE__ */ d(r.Group, {
+      children: /* @__PURE__ */ d(s.Group, {
         name: "metadata-view-filters",
         type: "multiple",
-        children: [s ? null : /* @__PURE__ */ i(b, {
-          activeFilterCount: n.length
-        }), e.map((t) => C(t, n.includes(t.id), m))]
+        children: [c ? null : /* @__PURE__ */ r(v, {
+          activeFilterCount: i.length
+        }), e.map((t) => w(t, i.includes(t.id), m))]
       })
     })
   });
 };
 export {
-  G as FilterRow,
-  G as default
+  T as FilterRow,
+  T as default
 };

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

@@ -1,61 +1,61 @@
-import { Popover as o, FilterChip as t, Button as p } from "@box/blueprint-web";
-import { MetadataBadge as u } from "@box/blueprint-web-assets/icons/Line";
-import { MetadataStringField as g } from "@box/metadata-filter";
-import { useState as v } from "react";
+import { Popover as o, FilterChip as t, Button as m } from "@box/blueprint-web";
+import { MetadataStringField as v } from "@box/metadata-filter";
+import { useState as g } from "react";
 import { useIntl as F } from "react-intl";
 import { useFormikContext as C } from "formik";
-import m from "./messages.js";
+import c from "./messages.js";
 import { jsx as e, jsxs as n } from "react/jsx-runtime";
 import '../../../../styles/string-filter-chip.css';const b = "_popoverFooter_1tgko_1", k = {
   popoverFooter: b
-}, _ = ({
-  formRef: c,
+}, P = ({
+  formRef: d,
   id: r,
   name: i,
-  selected: d
+  selected: f,
+  icon: a
 }) => {
   const {
-    formatMessage: a
-  } = F(), [f, l] = v(!1), s = C(), h = () => {
-    s.handleSubmit(), l(!1);
+    formatMessage: l
+  } = F(), [h, s] = g(!1), p = C(), u = () => {
+    p.handleSubmit(), s(!1);
   };
   return /* @__PURE__ */ e("div", {
     children: /* @__PURE__ */ n(o.Root, {
-      onOpenChange: l,
-      open: f,
+      onOpenChange: s,
+      open: h,
       children: [/* @__PURE__ */ e(o.Trigger, {
         children: /* @__PURE__ */ n(t.TriggerChip, {
-          selected: d,
+          selected: f,
           value: r,
-          children: [/* @__PURE__ */ e(t.Icon, {
-            icon: u
+          children: [a && /* @__PURE__ */ e(t.Icon, {
+            icon: a
           }), /* @__PURE__ */ e(t.Label, {
             children: i
           }), /* @__PURE__ */ e(t.DropdownIndicator, {})]
         }, r)
       }), /* @__PURE__ */ n(o.ContentContainer, {
         align: "start",
-        container: c.current,
+        container: d.current,
         children: [/* @__PURE__ */ e(o.MainContent, {
-          children: /* @__PURE__ */ e(g, {
+          children: /* @__PURE__ */ e(v, {
             fieldNamePrefix: `metadata.fields.${r}`,
             label: i
           })
         }), /* @__PURE__ */ n(o.Footer, {
           className: k.popoverFooter,
-          children: [/* @__PURE__ */ e(p, {
+          children: [/* @__PURE__ */ e(m, {
             onClick: () => {
-              s.setFieldValue(`metadata.fields.${r}.value.enum`, []);
+              p.setFieldValue(`metadata.fields.${r}.value.enum`, []);
             },
             size: "small",
             variant: "secondary",
-            children: a(m.clearButton)
-          }), /* @__PURE__ */ e(p, {
-            onClick: h,
+            children: l(c.clearButton)
+          }), /* @__PURE__ */ e(m, {
+            onClick: u,
             size: "small",
             type: "submit",
             variant: "primary",
-            children: a(m.applyButton)
+            children: l(c.applyButton)
           })]
         })]
       })]
@@ -63,5 +63,5 @@ import '../../../../styles/string-filter-chip.css';const b = "_popoverFooter_1tg
   });
 };
 export {
-  _ as StringFilterChip
+  P as StringFilterChip
 };

package/dist/types/lib/components/filter-row/string-filter-chip.d.ts

@@ -1,2 +1,2 @@
 import { FilterChipProps } from './types';
-export declare const StringFilterChip: ({ formRef, id, name, selected }: FilterChipProps) => import("react/jsx-runtime").JSX.Element;
+export declare const StringFilterChip: ({ formRef, id, name, selected, icon }: FilterChipProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/filter-row/types.d.ts

@@ -4,10 +4,12 @@ export interface FilterOption {
     name: string;
     fieldType: MetadataFieldType;
     selected: boolean;
+    icon?: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, 'ref'> & React.RefAttributes<SVGSVGElement>>;
 }
 export interface FilterChipProps {
     formRef: React.RefObject<HTMLFormElement>;
     id: string;
     name: string;
     selected: boolean;
+    icon?: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, 'ref'> & React.RefAttributes<SVGSVGElement>>;
 }

package/dist/types/lib/test-utils/mock-data.d.ts

@@ -5,6 +5,7 @@ export declare const mockActiveFilterIds: string[];
 export declare const mockColumnData: Column[];
 export declare const mockFilterOptions: FilterOption[];
 export declare const mockFilterOptionsNoSelection: FilterOption[];
+export declare const mockFilterOptionsWithCustomFilterChips: FilterOption[];
 export declare const mockFilterOptionsWithInvalidType: FilterOption[];
 export declare const mockMetadata: Item[];
 export declare const mockFilterRowArgs: {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@box/metadata-view",
-    "version": "0.18.1",
+    "version": "0.19.0",
     "license": "SEE LICENSE IN LICENSE",
     "peerDependencies": {
         "@box/blueprint-web": "^11.12.0",