@carbon/ibm-products 1.20.2 → 1.22.0

package/lib/components/Datagrid/useColumnCenterAlign.js

@@ -0,0 +1,59 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _settings = require("../../settings");
+
+function ownKeys(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; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var blockClass = "".concat(_settings.pkg.prefix, "--datagrid");
+
+var useColumnCenterAlign = function useColumnCenterAlign(hooks) {
+  var centerAlignRenderer = function centerAlignRenderer(tableProps, column) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _classnames.default)("".concat(blockClass, "__center-align-cell-renderer"), {
+        sortDisabled: !tableProps.isTableSortable || tableProps.column.disableSortBy === true
+      })
+    }, column.Cell(tableProps));
+  };
+
+  var centerAlignHeader = function centerAlignHeader(headerProp, column) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(blockClass, "__center-align-header")
+    }, typeof column.Header === 'function' ? column.Header(headerProp) : column.Header);
+  };
+
+  var centerAlignedColumns = function centerAlignedColumns(columns) {
+    var columnsWithDefaultCells = columns.map(function (column) {
+      return _objectSpread(_objectSpread({}, column), {}, {
+        Cell: column.centerAlignedColumn ? function (tableProp) {
+          return centerAlignRenderer(tableProp, column);
+        } : column.Cell,
+        Header: column.centerAlignedColumn ? function (headerProp) {
+          return centerAlignHeader(headerProp, column);
+        } : column.Header
+      });
+    });
+    return (0, _toConsumableArray2.default)(columnsWithDefaultCells);
+  };
+
+  hooks.visibleColumns.push(centerAlignedColumns);
+};
+
+var _default = useColumnCenterAlign;
+exports.default = _default;

package/lib/components/Datagrid/utils/makeData.js

@@ -0,0 +1,167 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.range = exports.newPersonWithTwoLines = exports.makeData = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _namor = _interopRequireDefault(require("namor"));
+
+function ownKeys(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; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var makeData = function makeData() {
+  for (var _len = arguments.length, lens = new Array(_len), _key = 0; _key < _len; _key++) {
+    lens[_key] = arguments[_key];
+  }
+
+  var makeDataLevel = function makeDataLevel() {
+    var depth = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+    var len = lens[depth];
+    return range(len).map(function () {
+      return _objectSpread(_objectSpread({}, newPerson()), {}, {
+        subRows: lens[depth + 1] ? makeDataLevel(depth + 1) : undefined
+      });
+    });
+  };
+
+  return makeDataLevel();
+};
+
+exports.makeData = makeData;
+
+var range = function range(len) {
+  var arr = [];
+
+  for (var i = 0; i < len; i++) {
+    arr.push(i);
+  }
+
+  return arr;
+};
+
+exports.range = range;
+
+var newPerson = function newPerson() {
+  var statusChance = Math.random();
+  return {
+    firstName: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    lastName: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    age: Math.floor(Math.random() * 30),
+    visits: Math.floor(Math.random() * 100),
+    progress: Math.floor(Math.random() * 100),
+    someone1: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone2: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone3: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone4: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone5: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone6: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone7: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone8: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone9: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone10: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone11: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone12: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone13: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone14: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone15: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone16: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone17: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone18: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone19: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    someone20: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    status: statusChance > 0.66 ? 'relationship' : statusChance > 0.33 ? 'complicated' : 'single'
+  };
+};
+
+var newPersonWithTwoLines = function newPersonWithTwoLines() {
+  return {
+    firstName: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, _namor.default.generate({
+      words: 1,
+      numbers: 0
+    })), /*#__PURE__*/_react.default.createElement("div", null, _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }))),
+    lastName: _namor.default.generate({
+      words: 1,
+      numbers: 0
+    }),
+    age: Math.floor(Math.random() * 30)
+  };
+};
+
+exports.newPersonWithTwoLines = newPersonWithTwoLines;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "1.20.2",
+  "version": "1.22.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -93,5 +93,5 @@
     "react": "^16.8.6 || ^17.0.1",
     "react-dom": "^16.8.6 || ^17.0.1"
   },
-  "gitHead": "84bc700f2b70f195de681c50c6a35af56ca9b831"
+  "gitHead": "08c7c9d86e1242499004fc8f6bfcb59c5af9ea7b"
 }

package/scss/components/Datagrid/styles/index.scss

@@ -10,6 +10,7 @@
 @import './useNestedTable';
 @import './useSortableColumns';
 @import './useColumnRightAlign';
+@import './useColumnCenterAlign';
 @import './useStickyColumn';
 @import './useActionsColumn';
 @import './addons/CustomizeColumnsModal';

package/scss/components/Datagrid/styles/useColumnCenterAlign.scss

@@ -0,0 +1,19 @@
+/*
+* Licensed Materials - Property of IBM
+* 5724-Q36
+* (c) Copyright IBM Corp. 2020
+* US Government Users Restricted Rights - Use, duplication or disclosure
+* restricted by GSA ADP Schedule Contract with IBM Corp.
+*/
+
+@import './variables';
+
+.#{$block-class}__center-align-header {
+  width: 100%;
+  text-align: center;
+}
+
+.#{$block-class}__center-align-cell-renderer.sortDisabled {
+  margin-right: auto;
+  margin-left: auto;
+}

package/scss/components/Tearsheet/_tearsheet.scss

@@ -151,6 +151,7 @@
 
     &.#{$block-class}--narrow .#{$block-class}__header {
       padding: $spacing-05;
+      border-bottom: 1px solid $ui-03;
       margin: 0;
     }
 
@@ -207,6 +208,10 @@
       margin-top: $spacing-03;
     }
 
+    &.#{$block-class}--narrow .#{$block-class}__header-description {
+      margin-top: $spacing-03;
+    }
+
     .#{$block-class}__header-navigation {
       margin: $spacing-04 0 0;
     }

package/scss/components/WebTerminal/_web-terminal.scss

@@ -1,7 +1,7 @@
 // Standard imports.
 @import '../../global/styles/project-settings';
 
-$web-terminal-width: 36.5rem;
+$web-terminal-width: 40rem; // 640px
 $block-class: #{$pkg-prefix}--web-terminal;
 
 @keyframes web-terminal-entrance {