@desynova-digital/components 9.3.9 → 9.3.11

package/atoms/icon/icons.json

@@ -1,17 +1,13 @@
 {
   "icons": {
     "right-arrow-chevron": {
-      "paths": [
-        "M3.33398 2L8.66732 6L3.33398 10"
-      ],
+      "paths": ["M3.33398 2L8.66732 6L3.33398 10"],
       "width": 12,
       "height": 12,
       "strokeWidth": 1.5
     },
     "down-arrow-chevron": {
-      "paths": [
-        "M10 3.33594L6 8.66927L2 3.33594"
-      ],
+      "paths": ["M10 3.33594L6 8.66927L2 3.33594"],
       "width": 12,
       "height": 12,
       "strokeWidth": 1.5
@@ -177,7 +173,7 @@
       "width": 16,
       "height": 16
     },
-     "search_filter": {
+    "search_filter": {
       "paths": [
         "M9.6224 2.33594H6.41406",
         "M4.58333 2.33594H1.375",
@@ -2027,7 +2023,7 @@
       "width": 12,
       "height": 11
     },
-    "notes-comment":{
+    "notes-comment": {
       "paths": [
         "M0 10V1C0 0.725 0.0979167 0.489583 0.29375 0.29375C0.489583 0.0979167 0.725 0 1 0H9C9.275 0 9.51042 0.0979167 9.70625 0.29375C9.90208 0.489583 10 0.725 10 1V7C10 7.275 9.90208 7.51042 9.70625 7.70625C9.51042 7.90208 9.275 8 9 8H2L0 10ZM2 6H6V5H2V6ZM2 4.5H8V3.5H2V4.5ZM2 3H8V2H2V3Z"
       ],
@@ -2050,13 +2046,21 @@
       "width": 14,
       "height": 14
     },
-     "unsupportedFile-icon": {
+    "unsupportedFile-icon": {
       "viewBox": "0 -960 960 960",
       "paths": [
         "M160-160q-33 0-56.5-23.5T80-240v-120h360q33 0 56.5-23.5T520-440v-360h280q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160ZM80-400v-240q0-33 23.5-56.5T160-720h240L80-400Zm153-40 207-207v207H233Z"
       ],
       "width": 24,
       "height": 24
+    },
+    "unsupported-video": {
+      "viewBox": "0 0 66 66",
+      "paths": [
+        "M13 18H8V53C8 55.75 10.25 58 13 58H48V53H13V18ZM53 8H23C20.25 8 18 10.25 18 13V43C18 45.75 20.25 48 23 48H53C55.75 48 58 45.75 58 43V13C58 10.25 55.75 8 53 8ZM53 43H23V13H53V43ZM33 16.75V39.25L48 28L33 16.75ZM4.4246 1.9234L1.9234 4.4246L60.9932 63.4944L63.4944 60.9932L4.4246 1.9234Z"
+      ],
+      "width": 66,
+      "height": 66
     }
   }
-}
+}

package/molecules/table/table.js

@@ -1183,24 +1183,11 @@ var Table = /*#__PURE__*/function (_Component) {
      * Widen a column to its longest rendered value (double-click on the header).
      * @param {object} column the column definition to fit
      */
-    (0, _defineProperty2["default"])(_this, "autofitColumn", function (column) {
-      if (!column || !_this.props.resizableColumns || _this.props.tableLoading) {
-        return;
-      }
-      var field = column.field;
-      if (!field || FIXED_COLUMN_WIDTHS[field]) {
-        return;
-      }
+    (0, _defineProperty2["default"])(_this, "measureColumnFitWidths", function (columns) {
+      var widths = {};
       var table = _this.tableElementRef.current;
-      if (!table) {
-        return;
-      }
-      var escaped = window.CSS && window.CSS.escape ? window.CSS.escape(field) : field;
-      var cells;
-      try {
-        cells = table.querySelectorAll('tbody > tr > td[data-field="' + escaped + '"]');
-      } catch (err) {
-        return;
+      if (!table || !columns || !columns.length) {
+        return widths;
       }
       var probe = document.createElement("span");
       probe.setAttribute("aria-hidden", "true");
@@ -1211,62 +1198,134 @@ var Table = /*#__PURE__*/function (_Component) {
           return 0;
         }
         var width = 0;
-        var text = el.textContent || "";
-        if (text.trim()) {
-          var cs = window.getComputedStyle(el);
-          probe.style.fontStyle = cs.fontStyle;
-          probe.style.fontVariant = cs.fontVariant;
-          probe.style.fontWeight = cs.fontWeight;
-          probe.style.fontSize = cs.fontSize;
-          probe.style.fontFamily = cs.fontFamily;
-          probe.style.letterSpacing = cs.letterSpacing;
-          probe.style.wordSpacing = cs.wordSpacing;
-          probe.style.textTransform = cs.textTransform;
-          probe.textContent = text;
-          width = probe.getBoundingClientRect().width;
+        if (el.children && el.children.length) {
+          var origin = el.getBoundingClientRect().left;
+          var right = origin;
+          for (var i = 0; i < el.children.length; i += 1) {
+            var childRight = el.children[i].getBoundingClientRect().right;
+            if (childRight > right) {
+              right = childRight;
+            }
+          }
+          width = Math.max(width, right - origin);
+        } else {
+          var text = el.textContent || "";
+          if (text.trim()) {
+            var cs = window.getComputedStyle(el);
+            probe.style.fontStyle = cs.fontStyle;
+            probe.style.fontVariant = cs.fontVariant;
+            probe.style.fontWeight = cs.fontWeight;
+            probe.style.fontSize = cs.fontSize;
+            probe.style.fontFamily = cs.fontFamily;
+            probe.style.letterSpacing = cs.letterSpacing;
+            probe.style.wordSpacing = cs.wordSpacing;
+            probe.style.textTransform = cs.textTransform;
+            probe.textContent = text;
+            width = probe.getBoundingClientRect().width;
+          }
         }
         if (el.scrollWidth > el.clientWidth) {
           width = Math.max(width, el.scrollWidth);
         }
         return width;
       };
-      var content = 0;
-      var headerNeeds = 0;
+      var tableWidth = _this.state.viewportWidth || table.clientWidth || 0;
+      var ceiling = tableWidth ? Math.min(MAX_AUTOFIT_COLUMN_WIDTH, tableWidth * MAX_AUTOFIT_TABLE_SHARE) : MAX_AUTOFIT_COLUMN_WIDTH;
       try {
-        for (var i = 0; i < cells.length; i += 1) {
-          var cell = cells[i];
-          var width = measure(cell.firstElementChild || cell);
-          if (width > content) {
-            content = width;
+        for (var c = 0; c < columns.length; c += 1) {
+          var column = columns[c];
+          var field = column && column.field;
+          if (!field || FIXED_COLUMN_WIDTHS[field]) {
+            continue;
           }
-        }
-        var headerCell = table.querySelector('thead > tr > th[data-field="' + escaped + '"]');
-        if (headerCell) {
-          var cs = window.getComputedStyle(headerCell);
-          probe.style.fontStyle = cs.fontStyle;
-          probe.style.fontVariant = cs.fontVariant;
-          probe.style.fontWeight = cs.fontWeight;
-          probe.style.fontSize = cs.fontSize;
-          probe.style.fontFamily = cs.fontFamily;
-          probe.style.letterSpacing = cs.letterSpacing;
-          probe.style.wordSpacing = cs.wordSpacing;
-          probe.style.textTransform = cs.textTransform;
-          probe.textContent = column.title || headerCell.textContent || "";
-          headerNeeds = probe.getBoundingClientRect().width + HEADER_CHROME_WIDTH;
+          var escaped = window.CSS && window.CSS.escape ? window.CSS.escape(field) : field;
+          var cells = void 0;
+          try {
+            cells = table.querySelectorAll('tbody > tr > td[data-field="' + escaped + '"]');
+          } catch (err) {
+            continue;
+          }
+          var content = 0;
+          for (var i = 0; i < cells.length; i += 1) {
+            var width = measure(cells[i].firstElementChild || cells[i]);
+            if (width > content) {
+              content = width;
+            }
+          }
+          var headerNeeds = 0;
+          var headerCell = table.querySelector('thead > tr > th[data-field="' + escaped + '"]');
+          if (headerCell) {
+            var cs = window.getComputedStyle(headerCell);
+            probe.style.fontStyle = cs.fontStyle;
+            probe.style.fontVariant = cs.fontVariant;
+            probe.style.fontWeight = cs.fontWeight;
+            probe.style.fontSize = cs.fontSize;
+            probe.style.fontFamily = cs.fontFamily;
+            probe.style.letterSpacing = cs.letterSpacing;
+            probe.style.wordSpacing = cs.wordSpacing;
+            probe.style.textTransform = cs.textTransform;
+            probe.textContent = column.title || headerCell.textContent || "";
+            headerNeeds = probe.getBoundingClientRect().width + HEADER_CHROME_WIDTH;
+          }
+          var desired = Math.max(content, headerNeeds) + CELL_HORIZONTAL_PADDING + 1;
+          var floor = MIN_AUTOFIT_COLUMN_WIDTH;
+          widths[field] = Math.ceil(Math.min(Math.max(desired, floor), Math.max(ceiling, floor)));
         }
       } finally {
         if (probe.parentNode) {
           probe.parentNode.removeChild(probe);
         }
       }
-      var tableWidth = _this.state.viewportWidth || table.clientWidth || 0;
-      var ceiling = tableWidth ? Math.min(MAX_AUTOFIT_COLUMN_WIDTH, tableWidth * MAX_AUTOFIT_TABLE_SHARE) : MAX_AUTOFIT_COLUMN_WIDTH;
-      var desired = Math.max(content, headerNeeds) + CELL_HORIZONTAL_PADDING + 1;
-      var floor = MIN_AUTOFIT_COLUMN_WIDTH;
-      var next = Math.ceil(Math.min(Math.max(desired, floor), Math.max(ceiling, floor)));
+      return widths;
+    });
+    /**
+     * Widen a column to its longest rendered value (double-click on the header).
+     * @param {object} column the column definition to fit
+     */
+    (0, _defineProperty2["default"])(_this, "autofitColumn", function (column) {
+      if (!column || !_this.props.resizableColumns || _this.props.tableLoading) {
+        return;
+      }
+      var widths = _this.measureColumnFitWidths([column]);
+      var next = widths[column.field];
       if (next > 0) {
-        _this.handleColumnResizeEnd(field, next);
+        _this.handleColumnResizeEnd(column.field, next);
+      }
+    });
+    (0, _defineProperty2["default"])(_this, "fitColumnsToContent", function () {
+      if (!_this.props.resizableColumns || _this.props.tableLoading) {
+        return;
+      }
+      var columns = _this.getVisibleColumns() || [];
+      var fitted = _this.measureColumnFitWidths(columns);
+      var next = {};
+      for (var i = 0; i < columns.length; i += 1) {
+        var field = columns[i] && columns[i].field;
+        if (!field || !fitted[field]) {
+          continue;
+        }
+        var current = toPxNumber(_this.getColumnWidth(columns[i])) || 0;
+        if (fitted[field] > current) {
+          next[field] = fitted[field];
+        }
       }
+      if (!Object.keys(next).length) {
+        return;
+      }
+      _this.setState(function (prevState) {
+        return {
+          columnWidths: _objectSpread(_objectSpread({}, prevState.columnWidths), next)
+        };
+      }, function () {
+        if (_this.props.onColumnsResize) {
+          _this.props.onColumnsResize(next);
+        } else if (_this.props.onColumnResize) {
+          var fields = Object.keys(next);
+          for (var _i2 = 0; _i2 < fields.length; _i2 += 1) {
+            _this.props.onColumnResize(fields[_i2], next[fields[_i2]]);
+          }
+        }
+      });
     });
     (0, _defineProperty2["default"])(_this, "getColumnResizeProps", function () {
       return {
@@ -1812,7 +1871,7 @@ var Table = /*#__PURE__*/function (_Component) {
         scrollContentWidth = _this$state3.scrollContentWidth;
       var frozenLeft = this.frozenWidths ? this.frozenWidths.left : 0;
       var frozenRight = this.frozenWidths ? this.frozenWidths.right : 0;
-      var showScrollProxy = !!(viewportWidth && scrollContentWidth && scrollContentWidth > viewportWidth) && this.props.resizableColumns;
+      var showScrollProxy = !!(viewportWidth && scrollContentWidth && scrollContentWidth > viewportWidth);
       var proxyWidth = Math.max(viewportWidth - frozenLeft - frozenRight, 0);
       var proxyContentWidth = Math.max(scrollContentWidth - frozenLeft - frozenRight, 0);
       var rows = this.state.items.map(function (item, index) {
@@ -2300,7 +2359,7 @@ Table.Row = _styledComponents["default"].tr(_templateObject16 || (_templateObjec
 }, Table.Card, function (props) {
   if (typeof props.theme === "string") return "background:" + _tokens.colors[props.theme].table.innerTableBackground;
 });
-Table.Cell = _styledComponents["default"].td(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["\n  font-family: 'SFUIText-Regular';\n  font-size: 12px;\n  letter-spacing: 0.4px;\n  color: ", "; \n  padding: 7px 14px;\n // border-top: 1px solid ", "; \n  text-align: left;\n  vertical-align: middle;\n  line-height: 2;\n  width: ", ";\n  max-width:  ", ";\n\n  &.tableHolder{\n    padding:0px;\n  }\n  &.table-inner-cell {\n    padding: 0;\n  }\n  &.pinned-column {\n    background: ", ";\n    z-index: 1;\n  }\n\n  &.pinned-column:hover {\n    z-index: 3;\n  }\n\n  &.pinned-left-edge {\n    box-shadow: 6px 0 8px -6px rgba(0, 0, 0, 0.55);\n  }\n\n  &.pinned-right-edge {\n    box-shadow: -6px 0 8px -6px rgba(0, 0, 0, 0.55);\n  }\n\n  .asset-play {\n    cursor: pointer;\n    background-color: transparent;\n    border: none;\n    color: #dddddd;\n    &:hover, &:focus {\n      outline: none;\n      color: ", ";\n      text-decoration: underline;\n    }\n  }\n\n  .icon-circle {\n    border-radius: 50%;\n    width: 24px;\n    height: 24px;\n    display: flex;\n    text-align: center;\n    justify-content: center;\n    align-items: center;\n    i {\n      line-height: 0;\n    }\n  }\n\n    // max-width: 0;\n    // overflow: hidden;\n    // text-overflow: ellipsis;\n    // white-space: nowrap;\n\n    & > div.text-box {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      &.text-linkexpired {\n        color: #FF6C56;\n      }\n    }\n  & > div.action-icons-cell{\n    white-space: nowrap;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    .tooltip-block {\n      top: -50px;\n    }\n    \n    .action-item-btn {\n      padding: 0 15px;\n      cursor: pointer;\n      background-color: transparent;\n\n      &.nested {\n        border-bottom: 1px solid #303f51;\n        display: flex;\n        padding: 10px;\n        align-items: center;\n        &>div:first-child{\n          margin-right:10px;\n        }\n        &:last-child{\n          border-bottom: 0px none;\n        }\n      }\n\n      &:hover {\n        transition: color 0.4s ease-out;\n        color: ", ";\n        path{\n          fill: ", ";\n          transition: fill 0.4s ease-out;\n        }\n      }\n    }\n\n\n    &>button{\n      margin-right: 15px;\n      display: inline-flex;\n    }\n    &>button:last-child{\n      margin-right: 0px;\n    }\n\n    .more-action-holder {\n      position: relative;\n\n      &:hover {\n      .more-action-list-box{\n        display:block;\n      }\n      .more-action-icon{\n        transition: all 0.4s ease-out;\n        background: ", ";\n      }\n    }\n\n      .more-action-icon{\n        height: 24px;\n        width: 24px;\n        background: #303f51;\n        border-radius: 50%;\n        padding: 0px 10px;\n        transform: translate(0px, -1px);\n      }\n      .more-action-list-box{\n        position: absolute;\n        z-index:100;\n        display:none;\n        //display:block;\n        padding-top: 11px;\n        transform: translate(-136px,-2px);\n        \n        .more-action-list {\n          box-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.2);\n          background: ", ";\n          min-width: 200px;\n        }\n\n        &:before{\n          content: '';\n          position: absolute;\n          /* left: 42%; */\n          /* top: 100%; */\n          width: 0;\n          height: 0;\n          \n          border-left: 4px solid transparent;\n          border-right: 4px solid transparent;\n          border-bottom: 6px solid ", ";\n          transform: translate(144px,-6px);\n        }\n\n      }\n\n    }\n  }\n\n  .nested-table {\n    background: #182738;\n    border-left: 2px solid ", ";\n  }\n\n\n"])), function (props) {
+Table.Cell = _styledComponents["default"].td(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["\n  font-family: 'SFUIText-Regular';\n  font-size: 12px;\n  letter-spacing: 0.4px;\n  color: ", "; \n  padding: 7px 14px;\n // border-top: 1px solid ", "; \n  text-align: left;\n  vertical-align: middle;\n  line-height: 2;\n  width: ", ";\n  max-width:  ", ";\n\n  &.tableHolder{\n    padding:0px;\n  }\n  &.table-inner-cell {\n    padding: 0;\n  }\n  &.pinned-column {\n    background: ", ";\n    z-index: 1;\n  }\n\n  &.pinned-column:hover {\n    z-index: 3;\n  }\n\n  &.pinned-left-edge {\n    box-shadow: 6px 0 8px -6px rgba(0, 0, 0, 0.55);\n  }\n\n  &.pinned-right-edge {\n    box-shadow: -6px 0 8px -6px rgba(0, 0, 0, 0.55);\n  }\n\n  .asset-play {\n    cursor: pointer;\n    background-color: transparent;\n    border: none;\n    color: #dddddd;\n    &:hover, &:focus {\n      outline: none;\n      color: ", ";\n      text-decoration: underline;\n    }\n  }\n\n  .icon-circle {\n    border-radius: 50%;\n    width: 24px;\n    height: 24px;\n    display: flex;\n    text-align: center;\n    justify-content: center;\n    align-items: center;\n    i {\n      line-height: 0;\n    }\n  }\n\n    // max-width: 0;\n    // overflow: hidden;\n    // text-overflow: ellipsis;\n    // white-space: nowrap;\n\n    & > div.text-box {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      &.text-linkexpired {\n        color: #FF6C56;\n      }\n    }\n  & > div.action-icons-cell{\n    white-space: nowrap;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n\n    .tooltip-block {\n      top: -50px;\n    }\n    \n    .action-item-btn {\n      padding: 0 15px;\n      cursor: pointer;\n      background-color: transparent;\n\n      &.nested {\n        border-bottom: 1px solid #303f51;\n        display: flex;\n        padding: 10px;\n        align-items: center;\n        &>div:first-child{\n          margin-right:10px;\n        }\n        &:last-child{\n          border-bottom: 0px none;\n        }\n      }\n\n      &:hover {\n        transition: color 0.4s ease-out;\n        color: ", ";\n        path{\n          fill: ", ";\n          transition: fill 0.4s ease-out;\n        }\n      }\n    }\n\n\n    &>button{\n      margin-right: 15px;\n      display: inline-flex;\n    }\n    &>button:last-child{\n      margin-right: 0px;\n    }\n\n    .more-action-holder {\n      position: relative;\n\n      &:hover {\n      .more-action-list-box{\n        display:block;\n      }\n      .more-action-icon{\n        transition: all 0.4s ease-out;\n        background: ", ";\n      }\n    }\n\n      .more-action-icon{\n        height: 24px;\n        width: 24px;\n        background: #303f51;\n        border-radius: 50%;\n        padding: 0px 10px;\n        transform: translate(0px, -1px);\n      }\n      .more-action-list-box{\n        position: absolute;\n        z-index:100;\n        display:none;\n        //display:block;\n        padding-top: 11px;\n        transform: translate(-136px,-2px);\n        \n        .more-action-list {\n          box-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.2);\n          background: ", ";\n          min-width: 200px;\n        }\n\n        &:before{\n          content: '';\n          position: absolute;\n          /* left: 42%; */\n          /* top: 100%; */\n          width: 0;\n          height: 0;\n          \n          border-left: 4px solid transparent;\n          border-right: 4px solid transparent;\n          border-bottom: 6px solid ", ";\n          transform: translate(144px,-6px);\n        }\n\n      }\n\n    }\n  }\n\n  .nested-table {\n    background: #182738;\n    border-left: 2px solid ", ";\n  }\n\n\n"])), function (props) {
   return _tokens.colors[props.theme].table.tdColor;
 }, function (props) {
   return _tokens.colors[props.theme].table.border;
@@ -2326,7 +2385,7 @@ Table.Cell = _styledComponents["default"].td(_templateObject17 || (_templateObje
   return _tokens.colors[props.theme].table.CellNestedTableBorderLeft;
 });
 var TableTitleLoadingInitial = _styledComponents["default"].div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["\n  height: 30px;\n  position: absolute;\n  left: -1px;\n  z-index: 2;\n  display: flex;\n  width: 100%;\n  top: -1px;\n"])));
-var DubbingStatusStyles = _styledComponents["default"].div(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  align-items: center;\n  .detail-block {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n\n    &:not(:last-child) {\n      margin-right: 7px;\n    }\n\n    .status-color {\n      width: 7px;\n      height: 7px;\n      margin-right: 6px;\n      border-radius: 100%;\n      background: rgba(255, 255, 255, 0.3);\n      &.approved {\n        background: ", ";\n      }\n      &.rejected {\n        background: #ef5350;\n      }\n    }\n    .language-name {\n      text-transform: capitalize;\n      font-size: 12px;\n      font-family: SFUIText-Regular;\n      color: #fff;\n    }\n  }\n"])), function (props) {
+var DubbingStatusStyles = _styledComponents["default"].div(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2["default"])(["\n  display: block;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  .detail-block {\n    display: inline-flex;\n    vertical-align: middle;\n    justify-content: center;\n    align-items: center;\n\n    &:not(:last-child) {\n      margin-right: 7px;\n    }\n\n    .status-color {\n      width: 7px;\n      height: 7px;\n      margin-right: 6px;\n      border-radius: 100%;\n      background: rgba(255, 255, 255, 0.3);\n      &.approved {\n        background: ", ";\n      }\n      &.rejected {\n        background: #ef5350;\n      }\n    }\n    .language-name {\n      text-transform: capitalize;\n      font-size: 12px;\n      font-family: SFUIText-Regular;\n      color: #fff;\n    }\n  }\n"])), function (props) {
   return _tokens.colors[props.theme].table.ApprovedBackground;
 });
 var SelectAllButton = _styledComponents["default"].div(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2["default"])(["\n  width: 20px;\n  height: 20px;\n  background: transparent;\n  border: ", ";\n  border-radius: 50%;\n  cursor: pointer;\n  position: absolute;\n  left: 14px;\n  z-index: 2;\n  top: 73px;\n  .input-select-all-button {\n    height: 0px;\n    width: 0px;\n    display: none;\n  }\n  .label-select-all-button {\n    position: relative;\n    cursor: pointer;\n    display: flex;\n    margin: 0px;\n    height: 20px;\n    align-items: center;\n    border-radius: 50%;\n    background: ", ";\n    .span-select-all-button {\n      display: ", ";\n      position: absolute;\n      top: 10px;\n      left: 5px;\n      border-right: 2px solid transparent;\n      border-bottom: 2px solid transparent;\n      transform: rotate(45deg);\n      transform-origin: 0 100%;\n      animation: ", ";\n    }\n  }\n"])), function (props) {
@@ -2353,6 +2412,7 @@ Table.propTypes = {
   pageDropdown: _propTypes["default"].instanceOf(Object),
   resizableColumns: _propTypes["default"].bool,
   onColumnResize: _propTypes["default"].func,
+  onColumnsResize: _propTypes["default"].func,
   scrollResetKey: _propTypes["default"].string
 };
 Table.defaultProps = {

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@desynova-digital/components",
-  "version": "9.3.9",
+  "version": "9.3.11",
   "description": "Components for Desynova Digital",
   "main": "index.js",
   "author": "desynova-digital",
   "license": "MIT",
   "repository": "desynova-digital",
   "dependencies": {
-    "@desynova-digital/tokens": "9.3.9",
+    "@desynova-digital/tokens": "9.3.11",
     "prop-types": "^15.7.2",
     "styled-components": "^4.3.2"
   },