@vidispine/vdt-mui 23.3.0-pre.2 → 23.3.0-pre.4

package/dist/es/search/SearchFilterForm/SearchFilterForm.js

@@ -1,120 +1,59 @@
-import { jsx as d } from "react/jsx-runtime";
-import o from "prop-types";
-import x from "@mui/material/Box";
-import l from "@vidispine/proptypes";
-import L from "../../general/Form/index.js";
-import M from "./hooks/UseSearchFilterFormInputs.js";
-import g from "./utils/mapValuesToFilter.js";
-const E = {
-  Root: x,
-  Form: L
-};
-function m({
-  fieldList: u,
-  facetList: h,
-  dataToPropsMap: y,
-  includeFacetsAsOptions: v,
-  inputsProps: O,
-  mapValuesToFilter: r,
-  onClear: i,
-  onReset: p,
-  onChange: s,
-  onSubmit: a,
-  onError: c,
-  components: F,
-  componentsProps: f
-}) {
+import { jsx as l } from "react/jsx-runtime";
+import P from "@mui/material/Box";
+import g from "../../general/Form/index.js";
+import B from "./hooks/UseSearchFilterFormInputs.js";
+import E from "./utils/mapValuesToFilter.js";
+const L = {
+  Root: P,
+  Form: g
+}, M = ({
+  fieldList: s,
+  facetList: m,
+  dataToPropsMap: a,
+  includeFacetsAsOptions: h,
+  inputsProps: u,
+  mapValuesToFilter: n,
+  onClear: r,
+  onReset: i,
+  onChange: d,
+  onSubmit: f,
+  onError: p,
+  components: v,
+  componentsProps: c
+}) => {
   const {
-    Root: b,
-    Form: T
-  } = F, n = M({
-    fieldList: u,
-    facetList: h,
-    dataToPropsMap: y,
-    includeFacetsAsOptions: v,
-    inputsProps: O
-  }), C = typeof i != "function" ? void 0 : (e, t) => {
-    i(e, r(t, n));
-  }, P = typeof p != "function" ? void 0 : (e, t) => {
-    p(e, r(t, n));
-  }, R = typeof s != "function" ? void 0 : (e, t) => {
-    s(e, r(t, n));
-  }, S = typeof a != "function" ? void 0 : (e, t) => {
-    a(e, r(t, n));
-  }, j = typeof c != "function" ? void 0 : (e, t) => {
-    c(e, t);
-  };
-  return /* @__PURE__ */ d(b, { ...f.root, children: /* @__PURE__ */ d(T, { inputs: n, onClear: C, onReset: P, onChange: R, onSubmit: S, onError: j, ...f.form }) });
-}
-m.propTypes = {
-  /**
-   * A VidiCore field definition list to create filter inputs from
-   */
-  fieldList: o.arrayOf(l.MetadataFieldType),
-  /**
-   * A VidiCore facet list to add options and/or count for options for the filter inputs
-   */
-  facetList: o.arrayOf(l.FacetType),
-  /**
-   * Override input props using field __name__ or __type__ as key
-   *
-   * Note: `name` props has precedence if prop is applicable from both name and type
-   *
-   * E.g. `{ 'vdt_stringField': { label: 'String Field', disabled: true, Component: CheckboxGroupInput } }` or `{ 'string-exact': { ...customInputProps } }`
-   */
-  inputsProps: o.instanceOf(Object),
-  /**
-   * Add facets as options (if false, only adds facet count for field value enumerations)
-   */
-  includeFacetsAsOptions: o.bool,
-  /**
-   * Map a field data key to an input prop
-   *
-   * E.g. `{ label: 'displayName' }` would add the value from data key 'displayName' as a label prop
-   */
-  dataToPropsMap: o.instanceOf(Object),
-  /**
-   * Function for mapping values to filter
-   */
-  mapValuesToFilter: o.func,
-  // Callbacks
-  /**
-   * Callback when filters are cleared (doesn't reset default values)
-   */
-  onClear: o.func,
-  /**
-   * Callback when filters are reset (resets to default values)
-   */
-  onReset: o.func,
-  /**
-   * Callback when filters are changed
-   */
-  onChange: o.func,
-  /**
-   * Callback when filters are submitted
-   */
-  onSubmit: o.func,
-  /**
-   * Callback when filters are submitted with errors (invalid values according to form rules)
-   */
-  onError: o.func,
-  // Overrides
-  /**
-   * Replace internal components
-   */
-  components: o.shape({
-    Root: o.elementType,
-    Form: o.elementType
-  }),
-  /**
-   * Add internal component props
-   */
-  componentsProps: o.shape({
-    root: o.instanceOf(Object),
-    form: o.instanceOf(Object)
-  })
+    Root: y,
+    Form: C
+  } = v, e = B({
+    fieldList: s,
+    facetList: m,
+    dataToPropsMap: a,
+    includeFacetsAsOptions: h,
+    inputsProps: u
+  }), F = typeof r != "function" ? void 0 : (t, o) => {
+    r(t, {
+      values: o,
+      filter: n(o, e)
+    });
+  }, x = typeof i != "function" ? void 0 : (t, o) => {
+    i(t, {
+      values: o,
+      filter: n(o, e)
+    });
+  }, S = typeof d != "function" ? void 0 : (t, o) => {
+    d(t, {
+      values: o,
+      filter: n(o, e)
+    });
+  }, b = typeof f != "function" ? void 0 : (t, o) => {
+    f(t, {
+      values: o,
+      filter: n(o, e)
+    });
+  }, R = typeof p != "function" ? void 0 : p;
+  return /* @__PURE__ */ l(y, { ...c.root, children: /* @__PURE__ */ l(C, { inputs: e, onClear: F, onReset: x, onChange: S, onSubmit: b, onError: R, ...c.form }) });
 };
-m.defaultProps = {
+M.defaultProps = {
   fieldList: void 0,
   facetList: void 0,
   includeFacetsAsOptions: !0,
@@ -124,15 +63,15 @@ m.defaultProps = {
     placeholder: "placeholder"
   },
   inputsProps: void 0,
-  mapValuesToFilter: g,
+  mapValuesToFilter: E,
   onClear: void 0,
   onReset: void 0,
   onChange: void 0,
   onSubmit: void 0,
   onError: void 0,
-  components: E,
+  components: L,
   componentsProps: void 0
 };
 export {
-  m as default
+  M as default
 };

package/dist/es/search/SearchFilterForm/hooks/UseSearchFilterFormInputs.d.ts

@@ -0,0 +1,100 @@
+import { FC, SyntheticEvent } from 'react';
+import type { FacetType, MetadataFieldType } from '@vidispine/types';
+declare const useSearchFilterFormInputs: ({ fieldList, facetList, includeFacetsAsOptions, dataToPropsMap, errorMessages, inputsProps, }: {
+    fieldList?: MetadataFieldType[];
+    facetList?: FacetType[];
+    includeFacetsAsOptions?: boolean;
+    dataToPropsMap?: {
+        [propKey: string]: string;
+    };
+    errorMessages?: {
+        [fieldName: string]: string | ((fieldName: string) => string);
+    };
+    inputsProps?: object;
+}) => ({
+    Component: FC<{
+        name?: string;
+        label?: string;
+        value?: any;
+        defaultValue?: any;
+        error?: string;
+        helperText?: string;
+        required?: boolean;
+        disabled?: boolean;
+        onChange?: (event: SyntheticEvent<Element, Event>, payload: {
+            [key: string]: any;
+            value: any;
+        }) => void;
+        onBlur?: (event: SyntheticEvent<Element, Event>, payload: {
+            [key: string]: any;
+            value: any;
+        }) => void;
+        onFocus?: (event: SyntheticEvent<Element, Event>, payload: {
+            [key: string]: any;
+            value: any;
+        }) => void;
+        options?: any[];
+        placeholder?: string;
+        fullWidth?: boolean;
+        variant?: string;
+        size?: string;
+        orientation?: string;
+        multiple?: boolean;
+        labelPlacement?: string;
+        min?: any;
+        max?: any;
+        type?: string;
+        range?: boolean;
+        locale?: string;
+        justifyContent?: string;
+        submitOnChange?: boolean;
+        onSubmit?: (event: SyntheticEvent<Element, Event>, payload: {
+            [key: string]: any;
+            value: any;
+        }) => void;
+    }>;
+    rules?: UseControllerProps;
+} & {
+    name?: string;
+    label?: string;
+    value?: any;
+    defaultValue?: any;
+    error?: string;
+    helperText?: string;
+    required?: boolean;
+    disabled?: boolean;
+    onChange?: (event: SyntheticEvent<Element, Event>, payload: {
+        [key: string]: any;
+        value: any;
+    }) => void;
+    onBlur?: (event: SyntheticEvent<Element, Event>, payload: {
+        [key: string]: any;
+        value: any;
+    }) => void;
+    onFocus?: (event: SyntheticEvent<Element, Event>, payload: {
+        [key: string]: any;
+        value: any;
+    }) => void;
+    options?: any[];
+    placeholder?: string;
+    fullWidth?: boolean;
+    variant?: string;
+    size?: string;
+    orientation?: string;
+    multiple?: boolean;
+    labelPlacement?: string;
+    min?: any;
+    max?: any;
+    type?: string;
+    range?: boolean;
+    locale?: string;
+    justifyContent?: string;
+    submitOnChange?: boolean;
+    onSubmit?: (event: SyntheticEvent<Element, Event>, payload: {
+        [key: string]: any;
+        value: any;
+    }) => void;
+} & {
+    [key: string]: any;
+})[];
+export default useSearchFilterFormInputs;

package/dist/es/search/SearchFilterForm/hooks/UseSearchFilterFormInputs.js

@@ -23,49 +23,49 @@ const Q = "Invalid value", Y = {
     SliderInput: D,
     DateRangeInput: _
   } = Y, a = N(() => X(R), [R]), m = N(() => z(b), [b]), $ = f((e) => {
-    const n = (u) => {
-      const t = e == null ? void 0 : e[u], r = i == null ? void 0 : i[u];
-      if (t !== void 0)
+    const t = (u) => {
+      const n = e == null ? void 0 : e[u], r = i == null ? void 0 : i[u];
+      if (n !== void 0)
         return {
-          value: t,
+          value: n,
           message: (typeof r == "function" ? r(u) : r) || Q
         };
     };
     return {
-      required: n("required"),
-      minLength: n("minLength"),
-      maxLength: n("maxLength"),
-      min: n("minInclusive"),
-      max: n("maxInclusive"),
-      pattern: n("pattern")
+      required: t("required"),
+      minLength: t("minLength"),
+      maxLength: t("maxLength"),
+      min: t("minInclusive"),
+      max: t("maxInclusive"),
+      pattern: t("pattern")
     };
-  }, [i]), C = f((e, n) => n === void 0 ? e : e == null ? void 0 : e.map((u) => {
-    const t = n == null ? void 0 : n[u.value];
+  }, [i]), C = f((e, t) => t === void 0 ? e : e == null ? void 0 : e.map((u) => {
+    const n = t == null ? void 0 : t[u.value];
     return {
       ...u,
-      ...t ? {
-        count: t
+      ...n ? {
+        count: n
       } : {}
     };
   }), []), F = f(({
     count: e,
-    range: n
-  }, u) => e ? [...u, ...Object.entries(e || {}).filter(([t]) => !(u != null && u.some((r) => r.value === t))).map(([t, r] = []) => ({
-    label: t,
-    value: t,
+    range: t
+  }, u) => e ? [...u, ...Object.entries(e || {}).filter(([n]) => !(u != null && u.some((r) => r.value === n))).map(([n, r]) => ({
+    label: n,
+    value: n,
     ...r ? {
       count: r
     } : {}
-  }))] : n ? [...u, ...n.map(({
-    start: t,
+  }))] : t ? [...u, ...t.map(({
+    start: n,
     end: r,
     count: c
   }, S) => {
-    const E = (() => t === "*" && r === "*" ? "*" : t === "*" ? `<= ${r}` : r === "*" ? `>= ${t}` : `${t} - ${r}`)(), v = [t === "*" ? Number.MIN_SAFE_INTEGER : Number(t), r === "*" ? Number.MAX_SAFE_INTEGER : Number(r)];
+    const E = (() => n === "*" && r === "*" ? "*" : n === "*" ? `<= ${r}` : r === "*" ? `>= ${n}` : `${n} - ${r}`)(), v = [n === "*" ? Number.MIN_SAFE_INTEGER : Number(n), r === "*" ? Number.MAX_SAFE_INTEGER : Number(r)];
     return {
       label: E,
       value: S + 1,
-      ...t !== void 0 && r !== void 0 ? {
+      ...n !== void 0 && r !== void 0 ? {
         rangeValues: v
       } : {},
       ...c ? {
@@ -74,7 +74,7 @@ const Q = "Invalid value", Y = {
     };
   })] : u, []), A = (e) => ["float", "integer", "long"].includes(e), I = (e) => ["string", "string-exact"].includes(e), j = (e) => e === "date", G = f(({
     type: e,
-    options: n
+    options: t
   }) => I(e) ? {
     freeSolo: !0,
     multiple: !0,
@@ -84,7 +84,7 @@ const Q = "Invalid value", Y = {
     range: !0,
     valueLabelDisplay: "auto",
     showMarks: !1,
-    ...n != null && n.length ? {} : {
+    ...t != null && t.length ? {} : {
       step: 1,
       infiniteMin: !0,
       infiniteMax: !0
@@ -94,34 +94,38 @@ const Q = "Invalid value", Y = {
   }) => I(e) ? d : A(e) ? D : j(e) ? _ : T, [_, D, d, T]);
   return N(() => a == null ? void 0 : a.map(({
     name: e,
-    restrictions: n,
+    restrictions: t,
     options: u,
-    type: t,
+    type: n,
     data: r,
     defaultValue: c
   }) => {
-    var q, w;
+    var k, q;
     const S = {
-      ...(o == null ? void 0 : o[t]) || {},
+      ...(o == null ? void 0 : o[n]) || {},
       ...(o == null ? void 0 : o[e]) || {}
-    }, E = $(n), v = (q = m == null ? void 0 : m.find((l) => l.fieldName === e)) == null ? void 0 : q.count, V = (w = m == null ? void 0 : m.find((l) => l.fieldName === e)) == null ? void 0 : w.range, M = C(u, v), W = g === !0 ? F({
+    }, E = $(t), v = (k = m == null ? void 0 : m.find((l) => l.fieldName === e)) == null ? void 0 : k.count, x = (q = m == null ? void 0 : m.find((l) => l.fieldName === e)) == null ? void 0 : q.range, M = C(u, v), U = g === !0 ? F({
       count: v,
-      range: V
-    }, M) : M, U = {
-      type: t,
-      defaultValue: c && I(t) ? [c] : void 0,
-      options: W,
+      range: x
+    }, M) : M, V = {
+      defaultValue: c && I(n) ? [c] : void 0,
+      options: U,
       rules: E,
-      ...Object.fromEntries(Object.entries(h).map(([l, x]) => r[x] ? [l, r[x]] : void 0).filter((l) => !!l)),
+      ...Object.fromEntries(Object.entries(h).map(([l, w]) => r[w] ? [l, r[w]] : void 0).filter((l) => !!l)),
       ...S
-    }, k = {
-      ...G(U),
-      ...U
+    }, W = {
+      ...G({
+        type: n,
+        options: U
+      }),
+      ...V
     };
     return {
       name: e,
-      Component: L(k),
-      ...k
+      Component: L({
+        type: n
+      }),
+      ...W
     };
   }), [C, F, h, L, G, $, g, o, m, a]);
 };

package/dist/es/search/SearchFilterForm/index.d.ts

@@ -0,0 +1,3 @@
+import Component from './SearchFilterForm';
+declare const StyledComponent: typeof Component;
+export default StyledComponent;

package/dist/es/search/SearchFilterForm/index.js

@@ -1,12 +1,11 @@
-import { styled as m } from "@mui/material/styles";
-import { withOverrides as n } from "../../_utils/withOverrides.js";
+import { styled as t } from "@mui/material/styles";
+import { withOverrides as m } from "../../_utils/withOverrides.js";
 import i from "./SearchFilterForm.js";
-const e = "SearchFilterForm", o = `Vdt${e}`, s = n(o)(i), r = m(s, {
-  name: o,
-  overridesResolver: (a, t) => t.root
-})(() => ({}));
-r.displayName = e;
-r.name = e;
+const o = "SearchFilterForm", e = `Vdt${o}`, n = m(e)(i), s = t(n, {
+  name: e,
+  overridesResolver: (a, r) => r.root
+})({});
+s.displayName = o;
 export {
-  r as default
+  s as default
 };

package/dist/es/search/SearchFilterForm/utils/mapValuesToFilter.d.ts

@@ -0,0 +1,15 @@
+import type { SearchFilterType } from '@vidispine/types';
+type MapValuesToFilterValues = {
+    [key: string]: any;
+};
+type MapValuesToFilterInput = {
+    name?: string;
+    options?: {
+        rangeValues: {
+            value: any;
+        }[];
+    }[];
+    [key: string]: any;
+};
+declare const mapValuesToFilter: (values: MapValuesToFilterValues, inputs: MapValuesToFilterInput[]) => SearchFilterType[];
+export default mapValuesToFilter;

package/dist/es/search/SearchFilterForm/utils/mapValuesToFilter.js

@@ -2,26 +2,26 @@ import "react/jsx-runtime";
 import "react";
 import "clsx";
 import "@mui/material/styles";
-import { isDefinedValue as N } from "../../../_utils/isDefinedValue.js";
-const w = (a, i) => {
+import { isDefinedValue as V } from "../../../_utils/isDefinedValue.js";
+const E = (c, i) => {
   const d = i == null ? void 0 : i.filter(({
     options: t
-  }) => t == null ? void 0 : t.some((r) => !!(r != null && r.rangeValues))), g = (t) => t.every((r) => typeof r == "number"), f = (t) => {
+  }) => t == null ? void 0 : t.some((e) => !!(e != null && e.rangeValues))), g = (t) => t.every((e) => typeof e == "number"), s = (t) => {
     if (!t)
       return !1;
-    const r = new Date(t);
-    return r instanceof Date && !Number.isNaN(r.getTime());
-  }, S = (t) => f(t == null ? void 0 : t.start) || f(t == null ? void 0 : t.end), o = (t, r, m, s) => {
-    var c, D;
+    const e = new Date(t);
+    return e instanceof Date && !Number.isNaN(e.getTime());
+  }, S = (t) => s(t == null ? void 0 : t.start) || s(t == null ? void 0 : t.end), N = (t, e, m, a) => {
+    var f, D;
     if (Array.isArray(t))
       return g(t) ? {
         range: [{
-          value: [((c = r == null ? void 0 : r.find((e) => e.value === t[0])) == null ? void 0 : c.rangeValues[0]) || t[0], ((D = r == null ? void 0 : r.find((e) => e.value === t[1])) == null ? void 0 : D.rangeValues[1]) || t[1]].map((e) => e === Number.MIN_SAFE_INTEGER && {
+          value: [((f = e == null ? void 0 : e.find((r) => r.value === t[0])) == null ? void 0 : f.rangeValues[0]) || t[0], ((D = e == null ? void 0 : e.find((r) => r.value === t[1])) == null ? void 0 : D.rangeValues[1]) || t[1]].map((r) => r === Number.MIN_SAFE_INTEGER && {
             minimum: !0
-          } || e === Number.MAX_SAFE_INTEGER && {
+          } || r === Number.MAX_SAFE_INTEGER && {
             maximum: !0
           } || {
-            value: e
+            value: r
           })
         }]
       } : {
@@ -30,27 +30,27 @@ const w = (a, i) => {
         }))
       };
     if (m) {
-      const n = new Date(t), e = new Date(t);
-      return e.setDate(e.getDate() + 1), {
+      const n = new Date(t), r = new Date(t);
+      return r.setDate(r.getDate() + 1), {
         range: [{
           value: [{
             value: n.toISOString()
           }, {
-            value: e.toISOString()
+            value: r.toISOString()
           }]
         }]
       };
     }
-    if (s) {
-      const n = (t == null ? void 0 : t.start) && new Date(t == null ? void 0 : t.start), e = (t == null ? void 0 : t.end) && new Date(t == null ? void 0 : t.end);
-      return e && e.setDate(e.getDate() + 1), {
+    if (a) {
+      const n = (t == null ? void 0 : t.start) && new Date(t == null ? void 0 : t.start), r = (t == null ? void 0 : t.end) && new Date(t == null ? void 0 : t.end);
+      return r && r.setDate(r.getDate() + 1), {
         range: [{
           value: [n ? {
             value: n.toISOString()
           } : {
             minimum: !0
-          }, e ? {
-            value: e.toISOString()
+          }, r ? {
+            value: r.toISOString()
           } : {
             maximum: !0
           }]
@@ -63,22 +63,19 @@ const w = (a, i) => {
       }]
     };
   };
-  return {
-    filter: Object.entries(a).filter(([, t]) => N(t, {
-      includeDateRange: !0
-    })).map(([t, r]) => {
-      var m;
-      return {
+  return Object.entries(c).filter(([, t]) => V(t, {
+    includeDateRange: !0
+  })).map(([t, e]) => {
+    var m;
+    return {
+      name: t,
+      field: [{
         name: t,
-        field: [{
-          name: t,
-          ...o(r, (m = d.find((s) => s.name === t)) == null ? void 0 : m.options, f(r), S(r))
-        }]
-      };
-    }),
-    values: a
-  };
+        ...N(e, (m = d.find((a) => a.name === t)) == null ? void 0 : m.options, s(e), S(e))
+      }]
+    };
+  });
 };
 export {
-  w as default
+  E as default
 };

package/dist/es/search/index.d.ts

@@ -0,0 +1 @@
+export { default as SearchFilterForm } from './SearchFilterForm';

package/dist/es/shape/ShapeMediaBadges/ShapeMediaBadges.d.ts

@@ -0,0 +1,35 @@
+/// <reference types="react" />
+import { Stack as MuiStack } from '@mui/material';
+import type { ShapeType } from '@vidispine/types';
+import { ParsedShapeType } from '@vidispine/vdt-js';
+import VdtCompactBadge from '../../general/CompactBadge';
+import type { WithOverrideProps } from '../../_types';
+declare const StyledMuiStack: typeof MuiStack;
+declare const defaultComponents: {
+    Root: typeof StyledMuiStack;
+    CompactBadge: typeof VdtCompactBadge;
+};
+export interface ShapeMediaBadgesProps extends WithOverrideProps<typeof defaultComponents> {
+    /**
+     * A shape type to generate badges from
+     */
+    shape?: ShapeType;
+    /**
+     * Direction the badges should be displayed
+     */
+    direction?: 'column' | 'row';
+    /**
+     * Defines the space between immediate children.
+     */
+    spacing?: number;
+    /**
+     * Add a divider component between badges
+     */
+    dividerSlot?: JSX.Element;
+    /**
+     * Replace the function that generates the badges
+     */
+    generateBadges?: (input: ParsedShapeType) => string[];
+}
+declare const ShapeMediaBadges: React.FC<ShapeMediaBadgesProps>;
+export default ShapeMediaBadges;