@vidispine/vdt-materialui 22.2.0 → 22.3.0-pre.3

package/dist/index.es.js

@@ -47,7 +47,7 @@ import Paper from '@material-ui/core/Paper';
 import { parseFacetType, parseNowDate, formatSeconds, roles, parseShapeType, parseTranscodePreset, parseTimespan, formatTimeBase, formatSmpte, createMetadataType, formatTimeCodeText, formatTimeCodeType, parseMetadataType, parseAudioComponent, parseContainerComponent, parseVideoComponent, parseSimpleMetadataType, findNearestThumbnail, parseHighlightTimespanList, metadataTypeToWebVtt, filterShapeSource, getShapeMediaType, getDocumentType } from '@vidispine/vdt-js';
 import IconButton from '@material-ui/core/IconButton';
 import CancelIcon from '@material-ui/icons/Cancel';
-import { Cancel, CheckCircle, Replay, ExpandLess, Label, Search, Delete, Block, ExpandMore, Folder, Wallpaper, Add, Visibility as Visibility$1, VisibilityOff as VisibilityOff$1 } from '@material-ui/icons';
+import { Cancel, CheckCircle, Replay, ExpandLess, Label, Search, Delete, Block, ExpandMore, Folder, ArrowDropUp, ArrowDropDown, Wallpaper, Add, Visibility as Visibility$1, VisibilityOff as VisibilityOff$1 } from '@material-ui/icons';
 import moment from 'moment';
 import { red, green, grey as grey$1 } from '@material-ui/core/colors';
 import Chip$1 from '@material-ui/core/Chip';
@@ -9274,6 +9274,8 @@ var toCapsCase$1 = function toCapsCase(string) {
 function EntityAccessMenu(_ref) {
   var _ref$className = _ref.className,
       className = _ref$className === void 0 ? 'VdtEntityAccessMenu-root' : _ref$className,
+      _ref$classes = _ref.classes,
+      classes = _ref$classes === void 0 ? {} : _ref$classes,
       onRemove = _ref.onRemove,
       accessType = _ref.accessType,
       entityType = _ref.entityType,
@@ -9314,16 +9316,19 @@ function EntityAccessMenu(_ref) {
       keepMounted: true,
       open: Boolean(anchorEl),
       onClose: onClose,
-      children: /*#__PURE__*/jsxs(MenuItem, {
-        onClick: handleRemove,
-        children: [/*#__PURE__*/jsx(ListItemIcon$1, {
-          children: /*#__PURE__*/jsx(DeleteIcon, {})
-        }), /*#__PURE__*/jsx(ListItemText, {
-          primary: entityAccessMenuText,
-          primaryTypographyProps: {
-            color: 'secondary'
-          }
-        })]
+      children: /*#__PURE__*/jsx("div", {
+        className: classes.entityAccessMenuContext,
+        children: /*#__PURE__*/jsxs(MenuItem, {
+          onClick: handleRemove,
+          children: [/*#__PURE__*/jsx(ListItemIcon$1, {
+            children: /*#__PURE__*/jsx(DeleteIcon, {})
+          }), /*#__PURE__*/jsx(ListItemText, {
+            primary: entityAccessMenuText,
+            primaryTypographyProps: {
+              color: 'secondary'
+            }
+          })]
+        })
       })
     })]
   });
@@ -20621,6 +20626,8 @@ function SearchInput(_ref2) {
       onChange = _ref2.onChange,
       SuggestionsComponent = _ref2.SuggestionsComponent,
       SuggestionsProps = _ref2.SuggestionsProps,
+      TopSearchesComponent = _ref2.TopSearchesComponent,
+      TopSearchesProps = _ref2.TopSearchesProps,
       ButtonProps = _ref2.ButtonProps,
       InputBaseProps = _ref2.InputBaseProps,
       SearchIconComponent = _ref2.SearchIconComponent,
@@ -20641,6 +20648,12 @@ function SearchInput(_ref2) {
       canClear = _useState6[0],
       setCanClear = _useState6[1];
 
+  useEffect(function () {
+    if (defaultValue !== '') {
+      setCanClear(true);
+    }
+  }, [defaultValue]);
+
   var handleOnChange = function handleOnChange(val) {
     onChange(val);
     setCanClear(inputRef.current.value.length > 0);
@@ -20678,7 +20691,17 @@ function SearchInput(_ref2) {
       anchorEl = _useState8[0],
       setAnchorEl = _useState8[1];
 
+  var _useState9 = useState(false),
+      _useState10 = _slicedToArray(_useState9, 2),
+      isTopSearchesOpen = _useState10[0],
+      setIsTopSearchesOpen = _useState10[1];
+
   var suggestionsVisible = Boolean(anchorEl) && isFocused && canClear;
+  var topSearchesVisible = Boolean(anchorEl) && isTopSearchesOpen;
+
+  var onOpenTopSearch = function onOpenTopSearch() {
+    setIsTopSearchesOpen(!isTopSearchesOpen);
+  };
 
   var _useSuggestionsNaviga = useSuggestionsNavigation({
     suggestions: suggestions,
@@ -20715,6 +20738,16 @@ function SearchInput(_ref2) {
         children: [/*#__PURE__*/jsx(CloseIconComponent, {
           className: canClear ? classes.closeButton : classes.closeButtonHidden,
           onClick: onClear
+        }), TopSearchesComponent && /*#__PURE__*/jsx(IconButton$1, {
+          onClick: onOpenTopSearch,
+          style: {
+            borderRadius: '50%'
+          },
+          children: topSearchesVisible ? /*#__PURE__*/jsx(ArrowDropUp, {
+            fontSize: "small"
+          }) : /*#__PURE__*/jsx(ArrowDropDown, {
+            fontSize: "small"
+          })
         }), /*#__PURE__*/jsx(Button$1, _objectSpread$1w(_objectSpread$1w({
           size: "small",
           type: "submit",
@@ -20737,7 +20770,9 @@ function SearchInput(_ref2) {
       onHover: onHoverSuggestion,
       focused: focusedSuggestion,
       anchorEl: anchorEl
-    }, SuggestionsProps))]
+    }, SuggestionsProps)), topSearchesVisible && TopSearchesComponent && /*#__PURE__*/jsx(TopSearchesComponent, _objectSpread$1w({
+      anchorEl: anchorEl
+    }, TopSearchesProps))]
   });
 }
 SearchInput.propTypes = {
@@ -20754,6 +20789,8 @@ SearchInput.propTypes = {
   onChange: PropTypes$1.func,
   SuggestionsComponent: PropTypes$1.elementType,
   SuggestionsProps: PropTypes$1.objectOf(PropTypes$1.any),
+  TopSearchesComponent: PropTypes$1.elementType,
+  TopSearchesProps: PropTypes$1.objectOf(PropTypes$1.any),
   ButtonProps: PropTypes$1.objectOf(PropTypes$1.any),
   InputBaseProps: PropTypes$1.objectOf(PropTypes$1.any),
   SearchIconComponent: PropTypes$1.elementType,
@@ -20775,6 +20812,8 @@ SearchInput.defaultProps = {
   onChange: function onChange() {},
   SuggestionsComponent: null,
   SuggestionsProps: {},
+  TopSearchesComponent: null,
+  TopSearchesProps: {},
   ButtonProps: {},
   InputBaseProps: {},
   SearchIconComponent: SearchIcon,
@@ -28746,6 +28785,7 @@ var styles$10 = function styles(theme) {
     disabled: {
       opacity: 1
     },
+    menuContext: {},
     menuExpand: {
       minWidth: theme.breakpoints.values.sm / 2
     },
@@ -28778,6 +28818,8 @@ function SavedSearchRow(_ref) {
       disableDeletion = _ref.disableDeletion,
       type = _ref.type,
       accessTranslate = _ref.accessTranslate,
+      _ref$extraMenuItems = _ref.extraMenuItems,
+      extraMenuItems = _ref$extraMenuItems === void 0 ? [] : _ref$extraMenuItems,
       _ref$isFolderRow = _ref.isFolderRow,
       isFolderRow = _ref$isFolderRow === void 0 ? false : _ref$isFolderRow,
       _ref$hideSubFolderSha = _ref.hideSubFolderSharing,
@@ -28917,6 +28959,11 @@ function SavedSearchRow(_ref) {
     return handleMenuAction(onAddRow, fieldType);
   };
 
+  var handleExtraMenuOnClick = function handleExtraMenuOnClick(menuFunction, id) {
+    menuFunction(id);
+    setAnchorEl(null);
+  };
+
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsxs(ListItem$1, {
       disableGutters: true,
@@ -29010,6 +29057,7 @@ function SavedSearchRow(_ref) {
         horizontal: 'right'
       },
       children: /*#__PURE__*/jsxs("div", {
+        className: classes.menuContext,
         children: [allowListAccess(searchMetadata) && type === 'folder' && /*#__PURE__*/jsxs(MenuItem, {
           dense: true,
           onClick: handleNewField({
@@ -29069,7 +29117,19 @@ function SavedSearchRow(_ref) {
           }) : null, /*#__PURE__*/jsx(ListItemText, {
             primary: deleteText
           })]
-        }, 6)]
+        }, 6), extraMenuItems.map(function (item) {
+          return /*#__PURE__*/jsxs(MenuItem, {
+            dense: true,
+            onClick: function onClick() {
+              return handleExtraMenuOnClick(item["function"], searchMetadata.collectionId);
+            },
+            children: [/*#__PURE__*/jsx(ListItemIcon$1, {
+              children: /*#__PURE__*/jsx(item.icon, {})
+            }), /*#__PURE__*/jsx(ListItemText, {
+              primary: item.name
+            })]
+          }, "extraMenu".concat(item.id));
+        })]
       })
     }), /*#__PURE__*/jsx(Popover, {
       open: expandedView !== null,
@@ -29116,7 +29176,7 @@ var SavedSearchRow$1 = withStyles(styles$10, {
   name: 'VdtSavedSearchRow'
 })(SavedSearchRow);
 
-var _excluded$t = ["searchProps", "searchPlaceholderText", "onSelect", "onDelete", "onUpdateSearchMetadata", "RowComponent", "RowProps", "accessTranslate"];
+var _excluded$t = ["searchProps", "searchPlaceholderText", "onSelect", "onDelete", "onUpdateSearchMetadata", "RowComponent", "RowProps", "accessTranslate", "extraMenuItems"];
 
 function ownKeys$V(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -29135,6 +29195,7 @@ function SavedSearchList(_ref) {
       _ref$RowProps = _ref.RowProps,
       RowProps = _ref$RowProps === void 0 ? {} : _ref$RowProps,
       accessTranslate = _ref.accessTranslate,
+      extraMenuItems = _ref.extraMenuItems,
       props = _objectWithoutProperties(_ref, _excluded$t);
 
   return /*#__PURE__*/jsx(Component$A, _objectSpread$V({
@@ -29165,7 +29226,8 @@ function SavedSearchList(_ref) {
                 metadataDocument: metadataDocument
               }).then(onRefresh));
             },
-            accessTranslate: accessTranslate
+            accessTranslate: accessTranslate,
+            extraMenuItems: extraMenuItems
           }, RowProps), collectionType.id);
         })
       });
@@ -29285,7 +29347,8 @@ function SavedSearch(_ref) {
       SearchFormComponent = _ref$SearchFormCompon === void 0 ? SaveSearchForm$1 : _ref$SearchFormCompon,
       _ref$SearchFormProps = _ref.SearchFormProps,
       SearchFormProps = _ref$SearchFormProps === void 0 ? {} : _ref$SearchFormProps,
-      accessTranslate = _ref.accessTranslate;
+      accessTranslate = _ref.accessTranslate,
+      extraMenuItems = _ref.extraMenuItems;
 
   var _useSavedSearch = useSavedSearch({
     markerField: markerField,
@@ -29321,7 +29384,8 @@ function SavedSearch(_ref) {
       onDelete: onDeleteSearch,
       onUpdateSearchMetadata: onUpdateSearchMetadata,
       searchProps: searchProps,
-      accessTranslate: accessTranslate
+      accessTranslate: accessTranslate,
+      extraMenuItems: extraMenuItems
     }, SearchListProps))]
   });
 }

package/dist/index.js

@@ -9463,6 +9463,8 @@ var toCapsCase$1 = function toCapsCase(string) {
 function EntityAccessMenu(_ref) {
   var _ref$className = _ref.className,
       className = _ref$className === void 0 ? 'VdtEntityAccessMenu-root' : _ref$className,
+      _ref$classes = _ref.classes,
+      classes = _ref$classes === void 0 ? {} : _ref$classes,
       onRemove = _ref.onRemove,
       accessType = _ref.accessType,
       entityType = _ref.entityType,
@@ -9503,16 +9505,19 @@ function EntityAccessMenu(_ref) {
       keepMounted: true,
       open: Boolean(anchorEl),
       onClose: onClose,
-      children: /*#__PURE__*/jsxRuntime.jsxs(MenuItem__default["default"], {
-        onClick: handleRemove,
-        children: [/*#__PURE__*/jsxRuntime.jsx(ListItemIcon__default["default"], {
-          children: /*#__PURE__*/jsxRuntime.jsx(DeleteIcon__default["default"], {})
-        }), /*#__PURE__*/jsxRuntime.jsx(ListItemText__default["default"], {
-          primary: entityAccessMenuText,
-          primaryTypographyProps: {
-            color: 'secondary'
-          }
-        })]
+      children: /*#__PURE__*/jsxRuntime.jsx("div", {
+        className: classes.entityAccessMenuContext,
+        children: /*#__PURE__*/jsxRuntime.jsxs(MenuItem__default["default"], {
+          onClick: handleRemove,
+          children: [/*#__PURE__*/jsxRuntime.jsx(ListItemIcon__default["default"], {
+            children: /*#__PURE__*/jsxRuntime.jsx(DeleteIcon__default["default"], {})
+          }), /*#__PURE__*/jsxRuntime.jsx(ListItemText__default["default"], {
+            primary: entityAccessMenuText,
+            primaryTypographyProps: {
+              color: 'secondary'
+            }
+          })]
+        })
       })
     })]
   });
@@ -20810,6 +20815,8 @@ function SearchInput(_ref2) {
       onChange = _ref2.onChange,
       SuggestionsComponent = _ref2.SuggestionsComponent,
       SuggestionsProps = _ref2.SuggestionsProps,
+      TopSearchesComponent = _ref2.TopSearchesComponent,
+      TopSearchesProps = _ref2.TopSearchesProps,
       ButtonProps = _ref2.ButtonProps,
       InputBaseProps = _ref2.InputBaseProps,
       SearchIconComponent = _ref2.SearchIconComponent,
@@ -20830,6 +20837,12 @@ function SearchInput(_ref2) {
       canClear = _useState6[0],
       setCanClear = _useState6[1];
 
+  React.useEffect(function () {
+    if (defaultValue !== '') {
+      setCanClear(true);
+    }
+  }, [defaultValue]);
+
   var handleOnChange = function handleOnChange(val) {
     onChange(val);
     setCanClear(inputRef.current.value.length > 0);
@@ -20867,7 +20880,17 @@ function SearchInput(_ref2) {
       anchorEl = _useState8[0],
       setAnchorEl = _useState8[1];
 
+  var _useState9 = React.useState(false),
+      _useState10 = _slicedToArray__default["default"](_useState9, 2),
+      isTopSearchesOpen = _useState10[0],
+      setIsTopSearchesOpen = _useState10[1];
+
   var suggestionsVisible = Boolean(anchorEl) && isFocused && canClear;
+  var topSearchesVisible = Boolean(anchorEl) && isTopSearchesOpen;
+
+  var onOpenTopSearch = function onOpenTopSearch() {
+    setIsTopSearchesOpen(!isTopSearchesOpen);
+  };
 
   var _useSuggestionsNaviga = useSuggestionsNavigation({
     suggestions: suggestions,
@@ -20904,6 +20927,16 @@ function SearchInput(_ref2) {
         children: [/*#__PURE__*/jsxRuntime.jsx(CloseIconComponent, {
           className: canClear ? classes.closeButton : classes.closeButtonHidden,
           onClick: onClear
+        }), TopSearchesComponent && /*#__PURE__*/jsxRuntime.jsx(core.IconButton, {
+          onClick: onOpenTopSearch,
+          style: {
+            borderRadius: '50%'
+          },
+          children: topSearchesVisible ? /*#__PURE__*/jsxRuntime.jsx(icons.ArrowDropUp, {
+            fontSize: "small"
+          }) : /*#__PURE__*/jsxRuntime.jsx(icons.ArrowDropDown, {
+            fontSize: "small"
+          })
         }), /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], _objectSpread$1w(_objectSpread$1w({
           size: "small",
           type: "submit",
@@ -20926,7 +20959,9 @@ function SearchInput(_ref2) {
       onHover: onHoverSuggestion,
       focused: focusedSuggestion,
       anchorEl: anchorEl
-    }, SuggestionsProps))]
+    }, SuggestionsProps)), topSearchesVisible && TopSearchesComponent && /*#__PURE__*/jsxRuntime.jsx(TopSearchesComponent, _objectSpread$1w({
+      anchorEl: anchorEl
+    }, TopSearchesProps))]
   });
 }
 SearchInput.propTypes = {
@@ -20943,6 +20978,8 @@ SearchInput.propTypes = {
   onChange: PropTypes$1.func,
   SuggestionsComponent: PropTypes$1.elementType,
   SuggestionsProps: PropTypes$1.objectOf(PropTypes$1.any),
+  TopSearchesComponent: PropTypes$1.elementType,
+  TopSearchesProps: PropTypes$1.objectOf(PropTypes$1.any),
   ButtonProps: PropTypes$1.objectOf(PropTypes$1.any),
   InputBaseProps: PropTypes$1.objectOf(PropTypes$1.any),
   SearchIconComponent: PropTypes$1.elementType,
@@ -20964,6 +21001,8 @@ SearchInput.defaultProps = {
   onChange: function onChange() {},
   SuggestionsComponent: null,
   SuggestionsProps: {},
+  TopSearchesComponent: null,
+  TopSearchesProps: {},
   ButtonProps: {},
   InputBaseProps: {},
   SearchIconComponent: SearchIcon__default["default"],
@@ -28935,6 +28974,7 @@ var styles$10 = function styles(theme) {
     disabled: {
       opacity: 1
     },
+    menuContext: {},
     menuExpand: {
       minWidth: theme.breakpoints.values.sm / 2
     },
@@ -28967,6 +29007,8 @@ function SavedSearchRow(_ref) {
       disableDeletion = _ref.disableDeletion,
       type = _ref.type,
       accessTranslate = _ref.accessTranslate,
+      _ref$extraMenuItems = _ref.extraMenuItems,
+      extraMenuItems = _ref$extraMenuItems === void 0 ? [] : _ref$extraMenuItems,
       _ref$isFolderRow = _ref.isFolderRow,
       isFolderRow = _ref$isFolderRow === void 0 ? false : _ref$isFolderRow,
       _ref$hideSubFolderSha = _ref.hideSubFolderSharing,
@@ -29106,6 +29148,11 @@ function SavedSearchRow(_ref) {
     return handleMenuAction(onAddRow, fieldType);
   };
 
+  var handleExtraMenuOnClick = function handleExtraMenuOnClick(menuFunction, id) {
+    menuFunction(id);
+    setAnchorEl(null);
+  };
+
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/*#__PURE__*/jsxRuntime.jsxs(ListItem__default["default"], {
       disableGutters: true,
@@ -29199,6 +29246,7 @@ function SavedSearchRow(_ref) {
         horizontal: 'right'
       },
       children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: classes.menuContext,
         children: [allowListAccess(searchMetadata) && type === 'folder' && /*#__PURE__*/jsxRuntime.jsxs(MenuItem__default["default"], {
           dense: true,
           onClick: handleNewField({
@@ -29258,7 +29306,19 @@ function SavedSearchRow(_ref) {
           }) : null, /*#__PURE__*/jsxRuntime.jsx(ListItemText__default["default"], {
             primary: deleteText
           })]
-        }, 6)]
+        }, 6), extraMenuItems.map(function (item) {
+          return /*#__PURE__*/jsxRuntime.jsxs(MenuItem__default["default"], {
+            dense: true,
+            onClick: function onClick() {
+              return handleExtraMenuOnClick(item["function"], searchMetadata.collectionId);
+            },
+            children: [/*#__PURE__*/jsxRuntime.jsx(ListItemIcon__default["default"], {
+              children: /*#__PURE__*/jsxRuntime.jsx(item.icon, {})
+            }), /*#__PURE__*/jsxRuntime.jsx(ListItemText__default["default"], {
+              primary: item.name
+            })]
+          }, "extraMenu".concat(item.id));
+        })]
       })
     }), /*#__PURE__*/jsxRuntime.jsx(Popover__default["default"], {
       open: expandedView !== null,
@@ -29305,7 +29365,7 @@ var SavedSearchRow$1 = styles$2B.withStyles(styles$10, {
   name: 'VdtSavedSearchRow'
 })(SavedSearchRow);
 
-var _excluded$t = ["searchProps", "searchPlaceholderText", "onSelect", "onDelete", "onUpdateSearchMetadata", "RowComponent", "RowProps", "accessTranslate"];
+var _excluded$t = ["searchProps", "searchPlaceholderText", "onSelect", "onDelete", "onUpdateSearchMetadata", "RowComponent", "RowProps", "accessTranslate", "extraMenuItems"];
 
 function ownKeys$V(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -29324,6 +29384,7 @@ function SavedSearchList(_ref) {
       _ref$RowProps = _ref.RowProps,
       RowProps = _ref$RowProps === void 0 ? {} : _ref$RowProps,
       accessTranslate = _ref.accessTranslate,
+      extraMenuItems = _ref.extraMenuItems,
       props = _objectWithoutProperties__default["default"](_ref, _excluded$t);
 
   return /*#__PURE__*/jsxRuntime.jsx(Component$A, _objectSpread$V({
@@ -29354,7 +29415,8 @@ function SavedSearchList(_ref) {
                 metadataDocument: metadataDocument
               }).then(onRefresh));
             },
-            accessTranslate: accessTranslate
+            accessTranslate: accessTranslate,
+            extraMenuItems: extraMenuItems
           }, RowProps), collectionType.id);
         })
       });
@@ -29474,7 +29536,8 @@ function SavedSearch(_ref) {
       SearchFormComponent = _ref$SearchFormCompon === void 0 ? SaveSearchForm$1 : _ref$SearchFormCompon,
       _ref$SearchFormProps = _ref.SearchFormProps,
       SearchFormProps = _ref$SearchFormProps === void 0 ? {} : _ref$SearchFormProps,
-      accessTranslate = _ref.accessTranslate;
+      accessTranslate = _ref.accessTranslate,
+      extraMenuItems = _ref.extraMenuItems;
 
   var _useSavedSearch = vdtReact.useSavedSearch({
     markerField: markerField,
@@ -29510,7 +29573,8 @@ function SavedSearch(_ref) {
       onDelete: onDeleteSearch,
       onUpdateSearchMetadata: onUpdateSearchMetadata,
       searchProps: searchProps,
-      accessTranslate: accessTranslate
+      accessTranslate: accessTranslate,
+      extraMenuItems: extraMenuItems
     }, SearchListProps))]
   });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vidispine/vdt-materialui",
-  "version": "22.2.0",
+  "version": "22.3.0-pre.3",
   "license": "SEE LICENSE IN LICENSE.md",
   "private": false,
   "publishConfig": {
@@ -27,10 +27,10 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.17.0",
-    "@vidispine/vdt-api": "22.2.0",
-    "@vidispine/vdt-js": "22.2.0",
-    "@vidispine/vdt-react": "22.2.0",
-    "@vidispine/vdt-videojs-react": "22.2.0",
+    "@vidispine/vdt-api": "22.3.0-pre.3",
+    "@vidispine/vdt-js": "22.3.0-pre.3",
+    "@vidispine/vdt-react": "22.3.0-pre.3",
+    "@vidispine/vdt-videojs-react": "22.3.0-pre.3",
     "clsx": "^1.1.1",
     "core-js": "^3.8.3",
     "filesize": "^6.1.0",
@@ -72,10 +72,10 @@
     "@rollup/plugin-commonjs": "^21.0.1",
     "@rollup/plugin-node-resolve": "^13.1.3",
     "@svgr/rollup": "^6.2.1",
-    "@vidispine/eslint-config-react": "22.2.0",
-    "@vidispine/eslint-config-storybook": "22.2.0",
-    "@vidispine/prettier-config": "22.2.0",
-    "@vidispine/proptypes": "22.2.0",
+    "@vidispine/eslint-config-react": "22.3.0-pre.3",
+    "@vidispine/eslint-config-storybook": "22.3.0-pre.3",
+    "@vidispine/prettier-config": "22.3.0-pre.3",
+    "@vidispine/proptypes": "22.3.0-pre.3",
     "@wojtekmaj/enzyme-adapter-react-17": "^0.6.6",
     "axios-mock-adapter": "^1.20.0",
     "enzyme": "^3.11.0",
@@ -110,5 +110,5 @@
     }
   },
   "prettier": "@vidispine/prettier-config",
-  "gitHead": "9873cf54bedeb5a1ee4c396eb9f101f3915ca1d1"
+  "gitHead": "9819429aa7af26cf9a1be230b50c66acd9d721f2"
 }