@luminati-io/uikit 3.5.0 → 3.5.1-beta.1

package/dist/umd/uikit.development.js

@@ -37720,126 +37720,6 @@ var Text = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_typography_
 
 /***/ }),
 
-/***/ "./src/table/cell.js":
-/*!***************************!*\
-  !*** ./src/table/cell.js ***!
-  \***************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   Cell: () => (/* binding */ Cell),
-/* harmony export */   StyledCell: () => (/* binding */ StyledCell)
-/* harmony export */ });
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ "styled-components");
-/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
-/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../constants */ "./src/constants.js");
-/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
-/* harmony import */ var _table_row__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./table_row */ "./src/table/table_row.js");
-// LICENSE_CODE ZON
-
-
-/*jslint react:true*/
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-
-
-
-
-
-
-
-var Cell = function Cell(props) {
-  var className = props.className,
-    rowDensity = props.rowDensity,
-    isLastRow = props.isLastRow,
-    cell = props.cell;
-  var row = cell.row,
-    column = cell.column,
-    isEditing = cell.isEditing;
-  var rowId = row.id;
-  var columnId = column.id,
-    _column$type = column.type,
-    type = _column$type === void 0 ? 'string' : _column$type,
-    canEdit = column.canEdit;
-  var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_5__.useTableContext)(),
-    columnStartEditing = _useTableContext.columnStartEditing,
-    columnDoneEditing = _useTableContext.columnDoneEditing,
-    getColumnProps = _useTableContext.getColumnProps,
-    getCellProps = _useTableContext.getCellProps;
-  var startEditing = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {
-    columnStartEditing(columnId, rowId);
-  }, [columnStartEditing, columnId, rowId]);
-  var doneEditing = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {
-    columnDoneEditing(columnId, rowId);
-  }, [columnDoneEditing, columnId, rowId]);
-  var cellProps = _objectSpread({
-    $type: type,
-    $rowDensity: rowDensity,
-    $canEdit: canEdit,
-    $isEditing: isEditing,
-    $isLastRow: isLastRow
-  }, cell.getCellProps([getColumnProps(column), getCellProps(cell)]));
-  cellProps.className = (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(null, null, (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(column.className, {
-    cell: true
-  }), (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(className, {
-    tableCell: true
-  }), cellProps.className);
-  if (canEdit) {
-    cellProps.onClick = function (e) {
-      e.stopPropagation();
-      startEditing();
-    };
-  }
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(StyledCell, cellProps, cell.render('Cell', {
-    row: row,
-    isEditing: isEditing,
-    startEditing: startEditing,
-    doneEditing: doneEditing
-  }));
-};
-Cell.displayName = 'Cell';
-var StyledCell = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
-  displayName: "StyledCell",
-  componentId: "sc-b034il-0"
-})(["padding:5px 15px;overflow-x:clip;", " background-color:", ";border:1px solid ", ";", ":hover &{background-color:", ";border-left-color:", ";border-right-color:", ";}", " ", " &[data-pinned-last]{", "}", ""], function (props) {
-  return props.$type == 'number' ? 'text-align: right;' : null;
-}, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, _table_row__WEBPACK_IMPORTED_MODULE_6__.TableRow, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_2, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_2, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_2, function (props) {
-  if (props.$isFooter) return "border-top-color: ".concat(_theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_3, ";");
-  if (props.$isLastRow) return "border-bottom-color: ".concat(_theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_3, ";");
-}, function (props) {
-  if (props.$rowDensity == 'diamond_hand') {
-    return (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["padding-top:11px;padding-bottom:11px;"]);
-  }
-  if (props.$rowDensity == 'white_spaced') {
-    return (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["padding-top:25px;padding-bottom:25px;"]);
-  }
-}, function (props) {
-  if (props.$canEdit && props.$isEditing) {
-    return (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["box-shadow:2px 0px 4px -2px rgba(24,39,75,0.12),4px 0px 4px -2px rgba(24,39,75,0.08),inset 0px 0px 0px 3px rgba(0,106,220,0.4);"]);
-  }
-  return (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["box-shadow:2px 0px 4px -2px rgba(24,39,75,0.12),4px 0px 4px -2px rgba(24,39,75,0.08);"]);
-}, function (props) {
-  if (props.$canEdit) {
-    if (props.$isEditing) {
-      return (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["border:1px solid ", " !important;box-shadow:inset 0px 0px 0px 3px rgba(0,106,220,0.4);z-index:", ";"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.blue_11, _constants__WEBPACK_IMPORTED_MODULE_4__.Z_INDEX.editingCell);
-    }
-    return (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["&:hover{border-color:", " !important;}"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_9);
-  }
-});
-StyledCell.displayName = 'StyledCell';
-
-/***/ }),
-
 /***/ "./src/table/context.js":
 /*!******************************!*\
   !*** ./src/table/context.js ***!
@@ -38054,8 +37934,6 @@ Provider.propTypes = {
     Header: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_1___default().node), (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)]),
     Cell: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
     Footer: prop_types__WEBPACK_IMPORTED_MODULE_1___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_1___default().node), (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)]),
-    // can_sort: PT.oneOfType([PT.bool, PT.number]),
-    // on_sort: PT.func,
     canSort: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
     disableHiding: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
     width: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number),
@@ -38067,7 +37945,6 @@ Provider.propTypes = {
     className: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
   })),
   data: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().array),
-  // columnsSort: PT.object,
   columnSort: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().object),
   onColumnSortChanged: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
   pageSize: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().number),
@@ -38084,6 +37961,7 @@ Provider.propTypes = {
   disableResizing: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
   disablePinning: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
   canEdit: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
+  isCellEditable: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
   hideHeader: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
   hideFooter: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
   getHeaderProps: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),
@@ -38623,9 +38501,11 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
-/* harmony import */ var _cell__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./cell */ "./src/table/cell.js");
-/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ "styled-components");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
+/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
+/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
 // LICENSE_CODE ZON
 
 
@@ -38644,11 +38524,12 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 
 
+
 var TableFooter = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forwardRef(function (props, ref) {
   var className = props.className,
     style = props.style,
     rowDensity = props.rowDensity;
-  var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_3__.useTableContext)(),
+  var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_4__.useTableContext)(),
     footerGroups = _useTableContext.footerGroups,
     allColumns = _useTableContext.allColumns,
     hideFooter = _useTableContext.hideFooter;
@@ -38660,7 +38541,7 @@ var TableFooter = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forw
     ref: ref,
     role: "rowgroup",
     "data-rowgroup-type": "footer",
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_1__.classNames)(className, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(className, {
       tableFooter: true
     }),
     style: style
@@ -38668,11 +38549,11 @@ var TableFooter = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forw
     var _group$getFooterGroup = group.getFooterGroupProps(),
       key = _group$getFooterGroup.key,
       rest = _objectWithoutProperties(_group$getFooterGroup, _excluded);
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", _extends({
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(TableFooterRow, _extends({
       key: key,
       role: "row"
     }, rest, {
-      className: (0,_util__WEBPACK_IMPORTED_MODULE_1__.classNames)(className, {
+      className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(className, {
         footerRow: true
       })
     }), group.headers.map(function (column) {
@@ -38680,7 +38561,7 @@ var TableFooter = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forw
         column: column,
         key: column.getFooterProps().key,
         rowDensity: rowDensity,
-        className: (0,_util__WEBPACK_IMPORTED_MODULE_1__.classNames)(className, {
+        className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(className, {
           footerCell: true
         })
       });
@@ -38688,28 +38569,47 @@ var TableFooter = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forw
   }));
 });
 TableFooter.displayName = 'TableFooter';
+var TableFooterRow = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
+  displayName: "TableFooterRow",
+  componentId: "sc-12b7s5j-0"
+})(["border-top:1px solid ", ";"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_3);
 var FooterCell = function FooterCell(props) {
   var className = props.className,
     column = props.column,
     rowDensity = props.rowDensity;
   var _column$type = column.type,
-    type = _column$type === void 0 ? 'string' : _column$type;
-  var _useTableContext2 = (0,_context__WEBPACK_IMPORTED_MODULE_3__.useTableContext)(),
+    type = _column$type === void 0 ? 'string' : _column$type,
+    isLastPinned = column.isLastPinned;
+  var _useTableContext2 = (0,_context__WEBPACK_IMPORTED_MODULE_4__.useTableContext)(),
     getColumnProps = _useTableContext2.getColumnProps,
     getFooterProps = _useTableContext2.getFooterProps;
   var footerProps = _objectSpread({
     $type: type,
-    $rowDensity: rowDensity,
-    $isFooter: true
+    $rowDensity: rowDensity
   }, column.getFooterProps([getColumnProps(column), getFooterProps(column)]));
-  footerProps.className = (0,_util__WEBPACK_IMPORTED_MODULE_1__.classNames)(column.className, {
+  footerProps.className = (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(column.className, {
     footer: true
   }, className, footerProps.className);
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_cell__WEBPACK_IMPORTED_MODULE_2__.StyledCell, _extends({
+  footerProps.$isLastPinned = isLastPinned;
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(FooterCellContent, _extends({
     role: "cell"
   }, footerProps), column.render('Footer'));
 };
-FooterCell.displayName = 'FooterCell';
+var FooterCellContent = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
+  displayName: "FooterCellContent",
+  componentId: "sc-12b7s5j-1"
+})(["padding:5px 15px;overflow-x:clip;", " background-color:", ";", " border-right:", ";"], function (props) {
+  return props.$type == 'number' ? 'text-align: right;' : null;
+}, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, function (props) {
+  if (props.$rowDensity == 'diamond_hand') {
+    return (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["padding-top:11px;padding-bottom:11px;"]);
+  }
+  if (props.$rowDensity == 'white_spaced') {
+    return (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["padding-top:25px;padding-bottom:25px;"]);
+  }
+}, function (props) {
+  return props.$isLastPinned ? "2px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_3) : 'none';
+});
 
 /***/ }),
 
@@ -38743,7 +38643,6 @@ __webpack_require__.r(__webpack_exports__);
 
 /*jslint react:true*/
 
-var _excluded = ["key"];
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -38752,8 +38651,6 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -38772,7 +38669,8 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 var TableHeader = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef(function (props, ref) {
   var className = props.className,
     compact = props.compact,
-    left = props.left;
+    left = props.left,
+    hideLastRowBorder = props.hideLastRowBorder;
   var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_8__.useTableContext)(),
     headerGroups = _useTableContext.headerGroups,
     hideHeader = _useTableContext.hideHeader;
@@ -38790,18 +38688,16 @@ var TableHeader = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forw
       tableHeader: true,
       'tableHeader--is-compact': compact
     })
-  }), headerGroups.map(function (group) {
-    var _group$getHeaderGroup = group.getHeaderGroupProps(),
-      key = _group$getHeaderGroup.key,
-      rest = _objectWithoutProperties(_group$getHeaderGroup, _excluded);
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement("div", _extends({
-      key: key
-    }, rest, {
+  }), headerGroups.map(function (group, n) {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(TableHeaderRow, _extends({
+      key: group.getHeaderGroupProps().key
+    }, group.getHeaderGroupProps(), {
       className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(className, {
         headerRow: true
-      })
-    }), group.headers.map(function (header, i, arr) {
-      var isLast = i == arr.length - 1;
+      }),
+      $isLast: hideLastRowBorder && n == headerGroups.length - 1
+    }), group.headers.map(function (header, i) {
+      var isLast = i == group.length - 1;
       return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(HeaderCell, {
         compact: compact,
         isLast: isLast,
@@ -38825,7 +38721,9 @@ var HeaderCell = function HeaderCell(props) {
   var id = header.id,
     name = header.name,
     isResizing = header.isResizing,
-    getResizerProps = header.getResizerProps;
+    getResizerProps = header.getResizerProps,
+    isPinned = header.isPinned,
+    isLastPinned = header.isLastPinned;
   var _useTableContext2 = (0,_context__WEBPACK_IMPORTED_MODULE_8__.useTableContext)(),
     getColumnProps = _useTableContext2.getColumnProps,
     getHeaderProps = _useTableContext2.getHeaderProps,
@@ -38836,14 +38734,14 @@ var HeaderCell = function HeaderCell(props) {
     onColumnSortChanged = _useTableContext2.onColumnSortChanged;
   var sort = columnSort[id];
   var onSortChanged = (0,_util__WEBPACK_IMPORTED_MODULE_5__.firstDefined)(onColumnSortChanged, header.on_sort);
-  var canSort = (0,_util__WEBPACK_IMPORTED_MODULE_5__.firstDefined)(header.canSort, header.can_sort) && !!onColumnSortChanged;
+  var canSort = (0,_util__WEBPACK_IMPORTED_MODULE_5__.firstDefined)(header.canSort, header.can_sort) && !!onSortChanged;
   var onSort = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function () {
     onSortChanged === null || onSortChanged === void 0 || onSortChanged(id, {
       asc: 'desc',
       desc: undefined,
       none: 'asc'
     }[sort || 'none']);
-  }, [id, sort, onColumnSortChanged]);
+  }, [id, sort, onSortChanged]);
   var canResize = header.canResize && !(fullWidth && isLast) && !compact;
   var _useState = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -38851,6 +38749,12 @@ var HeaderCell = function HeaderCell(props) {
     setHovered = _useState2[1];
   var iconVisible = canSort && (['asc', 'desc'].includes(sort) || hovered);
   var headerCellProps = header.getHeaderProps([getColumnProps(header), getHeaderProps(header)]);
+  if (isPinned) {
+    headerCellProps.style = _objectSpread(_objectSpread({}, headerCellProps.style), {}, {
+      zIndex: _constants__WEBPACK_IMPORTED_MODULE_7__.Z_INDEX.pinnedColumnHeader
+    });
+  }
+  headerCellProps.$isLastPinned = isLastPinned;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(HeaderCellContent, _extends({}, headerCellProps, {
     className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(header.className, {
       header: true
@@ -38884,28 +38788,36 @@ var HeaderCell = function HeaderCell(props) {
     },
     orderLogic: canOrderColumns && orderLogic,
     onSortChanged: onSortChanged
-  }), canResize && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(HeaderCellResizer, _extends({}, getResizerProps(), {
+  })), canResize && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(HeaderCellResizer, _extends({}, getResizerProps(), {
     $isResizing: isResizing
-  }))));
+  })));
 };
+var TableHeaderRow = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
+  displayName: "TableHeaderRow",
+  componentId: "sc-8zg5t0-0"
+})(["border-bottom:", ";"], function (props) {
+  return props.$isLast ? 'none' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_3);
+});
 var HeaderCellContent = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "HeaderCellContent",
-  componentId: "sc-8zg5t0-0"
-})(["background-color:", ";&:hover{background-color:", ";}border-bottom:1px solid ", ";&[data-pinned]{z-index:", " !important;}&[data-pinned-last]{box-shadow:2px 0px 4px -2px rgba(24,39,75,0.12),4px 0px 4px -2px rgba(24,39,75,0.08);}"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.white, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_2, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_3, _constants__WEBPACK_IMPORTED_MODULE_7__.Z_INDEX.pinnedColumnHeader);
+  componentId: "sc-8zg5t0-1"
+})(["background-color:", ";&:hover{background-color:", ";}border-right:", ";"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.white, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_2, function (props) {
+  return props.$isLastPinned ? "2px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_3) : 'none';
+});
 var HeaderCellWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "HeaderCellWrapper",
-  componentId: "sc-8zg5t0-1"
+  componentId: "sc-8zg5t0-2"
 })(["display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:8px 8px 8px 16px;"]);
 var HeaderCellLeft = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "HeaderCellLeft",
-  componentId: "sc-8zg5t0-2"
+  componentId: "sc-8zg5t0-3"
 })(["display:flex;flex-direction:row;align-items:center;padding:0px;gap:4px;min-height:16px;overflow-x:clip;"]);
 var HeaderCellResizer = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "HeaderCellResizer",
-  componentId: "sc-8zg5t0-3"
+  componentId: "sc-8zg5t0-4"
 })(["display:inline-block;width:10px;height:100%;position:absolute;right:0;top:0;transform:translateX(50%);z-index:", ";touch-action:none;", ""], _constants__WEBPACK_IMPORTED_MODULE_7__.Z_INDEX.cellResizer, function (props) {
   if (props.$isResizing) {
-    return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["&:after{content:\" \";display:block;width:2px;height:24px;background:", ";position:absolute;bottom:0;left:4px;}"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.blue_10);
+    return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["&:after{content:\" \";display:block;width:2px;height:100%;background:", ";position:absolute;bottom:0;left:4px;}"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.blue_10);
   }
 });
 var renderCellContent = function renderCellContent(column, type, props) {
@@ -39699,20 +39611,13 @@ var cellStylesPinned = {
 };
 var getPinnedProps = function getPinnedProps(header, instance) {
   var style = {};
-  var dataAttrs = {};
   checkPinnedErrors(instance.columns);
-  if (getPinnedValue(header)) {
-    style = assign({}, cellStylesPinned);
-    dataAttrs['data-pinned'] = true;
-    var headers = findHeadersSameLevel(header, instance.flatHeaders);
-    style = _objectSpread(_objectSpread({}, style), {}, {
-      left: (0,_utils__WEBPACK_IMPORTED_MODULE_2__.toPixel)(header.totalLeft)
-    });
-    if (columnIsLastPinned(header.id, headers)) dataAttrs['data-pinned-last'] = true;
-  }
-  return _objectSpread({
+  if (getPinnedValue(header)) style = assign({}, cellStylesPinned, {
+    left: (0,_utils__WEBPACK_IMPORTED_MODULE_2__.toPixel)(header.totalLeft)
+  });
+  return {
     style: style
-  }, dataAttrs);
+  };
 };
 var usePinnedReducer = function usePinnedReducer(state, action) {
   if (action.type == react_table__WEBPACK_IMPORTED_MODULE_1__.actions.init) return _objectSpread({
@@ -39758,10 +39663,12 @@ var usePinnedInstance = function usePinnedInstance(instance) {
       return col.id;
     }));
   }, [dispatch, columns, setColumnOrder]);
-  flatHeaders.forEach(function (column) {
-    column.togglePinned = function (value) {
-      return togglePinColumn(column.id, value);
+  flatHeaders.forEach(function (header) {
+    header.togglePinned = function (value) {
+      return togglePinColumn(header.id, value);
     };
+    var headers = findHeadersSameLevel(header, flatHeaders);
+    header.isLastPinned = columnIsLastPinned(header.id, headers);
   });
   assign(instance, {
     togglePinColumn: togglePinColumn
@@ -39867,9 +39774,11 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
-/* harmony import */ var _cell__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./cell */ "./src/table/cell.js");
-/* harmony import */ var _table_row__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./table_row */ "./src/table/table_row.js");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ "styled-components");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
+/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
+/* harmony import */ var _table_cell__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./table_cell */ "./src/table/table_cell.js");
 // LICENSE_CODE ZON
 
 
@@ -39879,6 +39788,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 
 
+
 var preventOnClickClass = 'tableCell--preventOnClick';
 var renderRow = function renderRow(opt) {
   var className = opt.className,
@@ -39886,35 +39796,36 @@ var renderRow = function renderRow(opt) {
     onRowClick = opt.onRowClick,
     getRowProps = opt.getRowProps,
     rowDensity = opt.rowDensity,
-    isLastRow = opt.isLastRow,
+    isLast = opt.isLast,
     renderRowSubComponent = opt.renderRowSubComponent;
   var rowProps = row.getRowProps(getRowProps === null || getRowProps === void 0 ? void 0 : getRowProps(row));
   var onClick = onRowClick ? function (evt) {
     if (!evt.target.matches(".".concat(preventOnClickClass, " *"))) onRowClick(row.original, evt);
   } : undefined;
   var cursor = onRowClick ? 'pointer' : undefined;
-  var tableRow = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_table_row__WEBPACK_IMPORTED_MODULE_3__.TableRow, _extends({}, rowProps, {
+  var tableRow = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(TableRow, _extends({}, rowProps, {
     onClick: onClick,
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_1__.classNames)(className, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(className, {
       tableRow: true,
-      'tableRow--is-pinned': row.isPinned
+      'tableRow--is-pinned': row.isPinned,
+      'tableRow--is-last': isLast
     }, rowProps.className),
-    $cursor: cursor
+    $cursor: cursor,
+    $isLast: isLast,
+    $rowDensity: rowDensity
   }), row.cells.map(function (cell) {
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_cell__WEBPACK_IMPORTED_MODULE_2__.Cell, {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_table_cell__WEBPACK_IMPORTED_MODULE_4__.TableCell, {
       key: cell.getCellProps().key,
       cell: cell,
-      className: className,
-      rowDensity: rowDensity,
-      isLastRow: isLastRow
+      className: className
     });
   }));
   if (!row.isExpanded || !renderRowSubComponent) return tableRow;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
     key: "".concat(rowProps.key, "_fragment")
-  }, tableRow, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_table_row__WEBPACK_IMPORTED_MODULE_3__.TableRow, _extends({}, rowProps, {
+  }, tableRow, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(TableRow, _extends({}, rowProps, {
     key: "".concat(rowProps.key, "_subcomponent"),
-    className: (0,_util__WEBPACK_IMPORTED_MODULE_1__.classNames)(className, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(className, {
       rowSubComponent: true
     }, rowProps.className)
   }), renderRowSubComponent({
@@ -39922,6 +39833,19 @@ var renderRow = function renderRow(opt) {
     rowProps: rowProps
   })));
 };
+var TableRow = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
+  displayName: "TableRow",
+  componentId: "sc-vrm5bg-0"
+})(["cursor:", ";border-bottom:", ";& ", "{height:", "px;}&:hover ", "{background-color:", ";}"], function (props) {
+  return props.$cursor;
+}, function (props) {
+  return props.$isLast ? 'none' : "1px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_3);
+}, _table_cell__WEBPACK_IMPORTED_MODULE_4__.CellContent, function (props) {
+  return {
+    diamond_hand: '44',
+    white_spaced: '72'
+  }[props.$rowDensity] || '32';
+}, _table_cell__WEBPACK_IMPORTED_MODULE_4__.TableCellContent, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_2);
 
 /***/ }),
 
@@ -40358,11 +40282,13 @@ var StickyHeader = function StickyHeader(props) {
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_header__WEBPACK_IMPORTED_MODULE_8__.TableHeader, {
     left: left,
     className: className,
-    compact: true
-  }), pinnedRows.map(function (row) {
+    compact: true,
+    hideLastRowBorder: pinnedRows.length == 0
+  }), pinnedRows.map(function (row, i) {
     prepareRow(row);
     return (0,_render_row__WEBPACK_IMPORTED_MODULE_9__.renderRow)({
       row: row,
+      isLast: i == pinnedRows.length - 1,
       columnStartEditing: columnStartEditing,
       columnDoneEditing: columnDoneEditing,
       rowDensity: rowDensity,
@@ -40371,12 +40297,10 @@ var StickyHeader = function StickyHeader(props) {
     });
   }));
 };
-StickyHeader.displayName = 'StickyHeader';
 var StickyHeaderWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "StickyHeaderWrapper",
   componentId: "sc-hh47bp-0"
 })(["position:fixed;z-index:", ";overflow-x:hidden;box-shadow:0px 2px 4px -2px rgba(24,39,75,0.12);"], _constants__WEBPACK_IMPORTED_MODULE_5__.Z_INDEX.stickyHeader);
-StickyHeaderWrapper.displayName = 'StickyHeaderWrapper';
 
 /***/ }),
 
@@ -40630,12 +40554,10 @@ var TableWrapper = styled_components__WEBPACK_IMPORTED_MODULE_3___default().div.
   displayName: "TableWrapper",
   componentId: "sc-ebeoik-0"
 })(["width:100%;border:1px solid ", ";border-radius:4px;overflow-x:auto;", ""], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].color.gray_3, _theme__WEBPACK_IMPORTED_MODULE_4__["default"].scrollbars.thin);
-TableWrapper.displayName = 'TableWrapper';
 var StyledTable = styled_components__WEBPACK_IMPORTED_MODULE_3___default().div.withConfig({
   displayName: "StyledTable",
   componentId: "sc-ebeoik-1"
 })(["min-width:100%;border-spacing:0;border-collapse:separate;"]);
-StyledTable.displayName = 'StyledTable';
 var TableBody = function TableBody(props) {
   var className = props.className,
     rowDensity = props.rowDensity,
@@ -40655,14 +40577,14 @@ var TableBody = function TableBody(props) {
   var body = function () {
     if (isLoading) return (0,_util__WEBPACK_IMPORTED_MODULE_5__.flexRender)(LoadingComp);
     if (!page.length) return (0,_util__WEBPACK_IMPORTED_MODULE_5__.flexRender)(NoDataComp);
-    return page.map(function (row, i, arr) {
+    return page.map(function (row, i) {
       prepareRow(row);
       if (row.isPinned) return null;
       return (0,_render_row__WEBPACK_IMPORTED_MODULE_9__.renderRow)({
         row: row,
         rowDensity: rowDensity,
         onRowClick: onRowClick,
-        isLastRow: i == arr.length - 1,
+        isLast: i == page.length - 1,
         className: className,
         getRowProps: getRowProps,
         renderRowSubComponent: renderRowSubComponent
@@ -40698,29 +40620,107 @@ var TableBodyRowGroup = styled_components__WEBPACK_IMPORTED_MODULE_3___default()
 
 /***/ }),
 
-/***/ "./src/table/table_row.js":
-/*!********************************!*\
-  !*** ./src/table/table_row.js ***!
-  \********************************/
+/***/ "./src/table/table_cell.js":
+/*!*********************************!*\
+  !*** ./src/table/table_cell.js ***!
+  \*********************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   TableRow: () => (/* binding */ TableRow)
+/* harmony export */   CellContent: () => (/* binding */ CellContent),
+/* harmony export */   EditableCellContent: () => (/* binding */ EditableCellContent),
+/* harmony export */   TableCell: () => (/* binding */ TableCell),
+/* harmony export */   TableCellContent: () => (/* binding */ TableCellContent)
 /* harmony export */ });
-/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! styled-components */ "styled-components");
-/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ "styled-components");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
+/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
+/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./context */ "./src/table/context.js");
 // LICENSE_CODE ZON
 
 
 /*jslint react:true*/
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-var TableRow = styled_components__WEBPACK_IMPORTED_MODULE_0___default().div.withConfig({
-  displayName: "TableRow",
-  componentId: "sc-es7xjx-0"
-})(["cursor:", ";"], function (props) {
-  return props.$cursor;
+
+
+
+
+var TableCell = function TableCell(props) {
+  var className = props.className,
+    cell = props.cell;
+  var row = cell.row,
+    column = cell.column,
+    isEditing = cell.isEditing;
+  var rowId = row.id;
+  var columnId = column.id,
+    _column$type = column.type,
+    type = _column$type === void 0 ? 'string' : _column$type,
+    canEdit = column.canEdit,
+    isLastPinned = column.isLastPinned;
+  var _useTableContext = (0,_context__WEBPACK_IMPORTED_MODULE_4__.useTableContext)(),
+    columnStartEditing = _useTableContext.columnStartEditing,
+    columnDoneEditing = _useTableContext.columnDoneEditing,
+    getColumnProps = _useTableContext.getColumnProps,
+    getCellProps = _useTableContext.getCellProps,
+    isCellEditable = _useTableContext.isCellEditable;
+  var cellEditable = canEdit && (isCellEditable ? isCellEditable(cell) : true);
+  var startEditing = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {
+    columnStartEditing(columnId, rowId);
+  }, [columnStartEditing, columnId, rowId]);
+  var doneEditing = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {
+    columnDoneEditing(columnId, rowId);
+  }, [columnDoneEditing, columnId, rowId]);
+  var onClick = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function (evt) {
+    if (cellEditable) {
+      evt.stopPropagation();
+      startEditing();
+    }
+  }, [cellEditable, startEditing]);
+  var cellProps = cell.getCellProps([getColumnProps(column), getCellProps(cell)]);
+  cellProps.className = (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(null, null, (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(column.className, {
+    cell: true
+  }), (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(className, {
+    tableCell: true
+  }), (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(className, {
+    'tableCell--is-editable': cellEditable
+  }), cellProps.className);
+  var Comp = cellEditable ? EditableCellContent : CellContent;
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(TableCellContent, _extends({
+    $isLastPinned: isLastPinned
+  }, cellProps), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Comp, {
+    $type: type,
+    $isEditing: isEditing,
+    onClick: onClick
+  }, cell.render('Cell', {
+    row: row,
+    isEditing: isEditing,
+    startEditing: startEditing,
+    doneEditing: doneEditing
+  })));
+};
+var TableCellContent = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
+  displayName: "TableCellContent",
+  componentId: "sc-1gdt4qg-0"
+})(["background-color:", ";border-right:", ";"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, function (props) {
+  return props.$isLastPinned ? "2px solid ".concat(_theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_3) : 'none';
+});
+var CellContent = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
+  displayName: "CellContent",
+  componentId: "sc-1gdt4qg-1"
+})(["box-sizing:border-box;display:flex;align-items:center;padding:0 15px;overflow:clip;", ""], function (props) {
+  return props.$type == 'number' ? 'text-align: right;' : null;
+});
+var EditableCellContent = styled_components__WEBPACK_IMPORTED_MODULE_1___default()(CellContent).withConfig({
+  displayName: "EditableCellContent",
+  componentId: "sc-1gdt4qg-2"
+})(["padding:0 14px;border:1px solid transparent;&:hover{background-color:", ";border-color:", ";}", ""], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.gray_9, function (props) {
+  return props.$isEditing ? (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.css)(["background-color:", ";border:1px solid ", " !important;box-shadow:inset 0px 0px 0px 3px rgba(0,106,220,0.4);"], _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.white, _theme__WEBPACK_IMPORTED_MODULE_2__["default"].color.blue_11) : undefined;
 });
 
 /***/ }),