@carbon/react 1.50.0-rc.0 → 1.50.0

package/lib/components/DataTable/DataTable.js

@@ -113,6 +113,7 @@ class DataTable extends React__default["default"].Component {
         sortDirection,
         isSortable,
         isSortHeader: sortHeaderKey === header.key,
+        slug: header.slug,
         onClick: event => {
           const nextSortState = sorting.getNextSortState(this.props, this.state, {
             key: header.key
@@ -349,6 +350,23 @@ class DataTable extends React__default["default"].Component {
         useStaticWidth
       };
     });
+    /**
+     * Get the props associated with the given table cell.
+     *
+     * @param {object} config
+     * @param {object} config.cell the cell we want the props for
+     * @returns {object}
+     */
+    _rollupPluginBabelHelpers.defineProperty(this, "getCellProps", _ref4 => {
+      let {
+        cell,
+        ...rest
+      } = _ref4;
+      return {
+        ...rest,
+        hasSlugHeader: cell.hasSlugHeader
+      };
+    });
     /**
      * Helper utility to get all the currently selected rows
      * @returns {Array<string>} the array of rowIds that are currently selected
@@ -622,6 +640,7 @@ class DataTable extends React__default["default"].Component {
       getBatchActionProps: this.getBatchActionProps,
       getTableProps: this.getTableProps,
       getTableContainerProps: this.getTableContainerProps,
+      getCellProps: this.getCellProps,
       // Custom event handlers
       onInputChange: this.handleOnInputValueChange,
       // Expose internal state change actions

package/lib/components/DataTable/TableCell.d.ts

@@ -4,7 +4,32 @@
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { TdHTMLAttributes } from 'react';
-export type TableCellProps = TdHTMLAttributes<HTMLTableCellElement>;
-declare const TableCell: React.FC<TableCellProps>;
+import React from 'react';
+import { ReactAttr } from '../../types/common';
+interface TableCellProps extends ReactAttr<HTMLTableCellElement> {
+    /**
+     * Pass in children that will be embedded in the table header label
+     */
+    children?: React.ReactNode;
+    /**
+     * Specify an optional className to be applied to the container node
+     */
+    className?: string;
+    /**
+     * The width of the expanded row's internal cell
+     */
+    colSpan?: number;
+    /**
+     * Specify if the table cell is in an AI column
+     */
+    hasSlugHeader?: boolean;
+    /**
+     * The id of the matching th node in the table head. Addresses a11y concerns outlined here: https://www.ibm.com/able/guidelines/ci162/info_and_relationships.html and https://www.w3.org/TR/WCAG20-TECHS/H43
+     */
+    headers?: string;
+}
+declare const TableCell: {
+    ({ children, className, hasSlugHeader, colSpan, ...rest }: TableCellProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export default TableCell;

package/lib/components/DataTable/TableCell.js

@@ -9,11 +9,33 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var wrapComponent = require('../../tools/wrapComponent.js');
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var cx = require('classnames');
+var usePrefix = require('../../internal/usePrefix.js');
 
-const TableCell = wrapComponent["default"]({
-  name: 'TableCell',
-  type: 'td'
-});
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+const TableCell = _ref => {
+  let {
+    children,
+    className,
+    hasSlugHeader,
+    colSpan,
+    ...rest
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
+  const tableCellClassNames = cx__default["default"](className, {
+    [`${prefix}--table-cell--column-slug`]: hasSlugHeader
+  });
+  return /*#__PURE__*/React__default["default"].createElement("td", _rollupPluginBabelHelpers["extends"]({
+    className: tableCellClassNames ? tableCellClassNames : undefined,
+    colSpan: colSpan
+  }, rest), children);
+};
+TableCell.displayName = 'TableCell';
 
 exports["default"] = TableCell;

package/lib/components/DataTable/TableExpandRow.js

@@ -58,7 +58,7 @@ const TableExpandRow = /*#__PURE__*/React__default["default"].forwardRef((_ref,
     [`${prefix}--parent-row`]: true,
     [`${prefix}--expandable-row`]: isExpanded,
     [`${prefix}--data-table--selected`]: isSelected,
-    [`${prefix}--parent-row--slug`]: rowHasSlug
+    [`${prefix}--data-table--slug-row`]: rowHasSlug
   }, rowClassName);
   const previousValue = isExpanded ? 'collapsed' : undefined;
   return /*#__PURE__*/React__default["default"].createElement("tr", _rollupPluginBabelHelpers["extends"]({}, rest, {

package/lib/components/DataTable/TableHeader.js

@@ -134,13 +134,13 @@ const TableHeader = /*#__PURE__*/React__default["default"].forwardRef(function T
     className: `${prefix}--table-sort__flex`
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: `${prefix}--table-header-label`
-  }, children), normalizedSlug, /*#__PURE__*/React__default["default"].createElement(iconsReact.ArrowUp, {
+  }, children), /*#__PURE__*/React__default["default"].createElement(iconsReact.ArrowUp, {
     size: 20,
     className: `${prefix}--table-sort__icon`
   }), /*#__PURE__*/React__default["default"].createElement(iconsReact.ArrowsVertical, {
     size: 20,
     className: `${prefix}--table-sort__icon-unsorted`
-  }))));
+  }), normalizedSlug)));
 });
 TableHeader.propTypes = {
   /**

package/lib/components/DataTable/TableRow.js

@@ -24,10 +24,21 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 const TableRow = props => {
   const prefix = usePrefix.usePrefix();
+  let rowHasSlug;
+  if (props?.children) {
+    React__default["default"].Children.toArray(props.children).map(child => {
+      if (child.type?.displayName === 'TableSlugRow') {
+        if (child.props.slug) {
+          rowHasSlug = true;
+        }
+      }
+    });
+  }
   // Remove unnecessary props if provided to this component, these are
   // only useful in `TableExpandRow`
   const className = cx__default["default"](props.className, {
-    [`${prefix}--data-table--selected`]: props.isSelected
+    [`${prefix}--data-table--selected`]: props.isSelected,
+    [`${prefix}--data-table--slug-row`]: rowHasSlug
   });
   const cleanProps = {
     ...omit__default["default"](props, ['ariaLabel', 'aria-label', 'aria-controls', 'onExpand', 'isExpanded', 'isSelected']),

package/lib/components/DataTable/tools/normalize.js

@@ -52,7 +52,8 @@ const normalize = function (rows, headers) {
     }
     headers.forEach((_ref, i) => {
       let {
-        key
+        key,
+        slug
       } = _ref;
       const id = cells.getCellId(row.id, key);
       // Initialize the cell info and state values, namely for editing
@@ -63,6 +64,7 @@ const normalize = function (rows, headers) {
         isEditing: false,
         isValid: true,
         errors: null,
+        hasSlugHeader: !!slug,
         info: {
           header: key
         }

package/lib/index.d.ts

@@ -115,6 +115,7 @@ export { PageSelector as unstable_PageSelector, Pagination as unstable_Paginatio
 export * from './components/Popover';
 export * from './components/ProgressBar';
 export { Slug as unstable__Slug, SlugContent as unstable__SlugContent, SlugActions as unstable__SlugActions, } from './components/Slug';
+export { ChatButton as unstable__ChatButton, ChatButtonSkeleton as unstable__ChatButtonSkeleton, } from './components/ChatButton';
 export * from './components/Stack';
 export * from './components/Tooltip';
 export { Text as unstable_Text, TextDirection as unstable_TextDirection, } from './components/Text';

package/lib/index.js

@@ -193,6 +193,8 @@ var FluidTimePicker_Skeleton = require('./components/FluidTimePicker/FluidTimePi
 var FluidTimePickerSelect = require('./components/FluidTimePickerSelect/FluidTimePickerSelect.js');
 var LayoutDirection = require('./components/LayoutDirection/LayoutDirection.js');
 var useLayoutDirection = require('./components/LayoutDirection/useLayoutDirection.js');
+var ChatButton = require('./components/ChatButton/ChatButton.js');
+var ChatButton_Skeleton = require('./components/ChatButton/ChatButton.Skeleton.js');
 var Text = require('./components/Text/Text.js');
 var TextDirection = require('./components/Text/TextDirection.js');
 var DataTable = require('./components/DataTable/DataTable.js');
@@ -457,6 +459,8 @@ exports.unstable__FluidTimePickerSkeleton = FluidTimePicker_Skeleton["default"];
 exports.unstable__FluidTimePickerSelect = FluidTimePickerSelect["default"];
 exports.unstable_LayoutDirection = LayoutDirection.LayoutDirection;
 exports.unstable_useLayoutDirection = useLayoutDirection.useLayoutDirection;
+exports.unstable__ChatButton = ChatButton["default"];
+exports.unstable__ChatButtonSkeleton = ChatButton_Skeleton["default"];
 exports.unstable_Text = Text.Text;
 exports.unstable_TextDirection = TextDirection.TextDirection;
 exports.DataTable = DataTable["default"];

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.50.0-rc.0",
+  "version": "1.50.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -49,9 +49,9 @@
   "dependencies": {
     "@babel/runtime": "^7.18.3",
     "@carbon/feature-flags": "^0.16.0",
-    "@carbon/icons-react": "^11.36.0-rc.0",
+    "@carbon/icons-react": "^11.36.0",
     "@carbon/layout": "^11.20.0",
-    "@carbon/styles": "^1.50.0-rc.0",
+    "@carbon/styles": "^1.50.0",
     "@ibm/telemetry-js": "^1.2.0",
     "classnames": "2.5.1",
     "copy-to-clipboard": "^3.3.1",
@@ -79,7 +79,7 @@
     "@babel/preset-react": "^7.22.3",
     "@babel/preset-typescript": "^7.21.5",
     "@carbon/test-utils": "^10.30.0",
-    "@carbon/themes": "^11.30.0",
+    "@carbon/themes": "^11.31.0",
     "@rollup/plugin-babel": "^6.0.0",
     "@rollup/plugin-commonjs": "^25.0.0",
     "@rollup/plugin-node-resolve": "^15.0.0",
@@ -139,5 +139,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "fbec0e13b29a1c9b19ed22a1ae9b6f87107ba920"
+  "gitHead": "eb7d66891262363368b48211b9fd1caa78fa58f9"
 }

package/scss/components/chat-button/_chat-button.scss

@@ -0,0 +1,9 @@
+// Code generated by @carbon/react. DO NOT EDIT.
+//
+// Copyright IBM Corp. 2018, 2023
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@forward '@carbon/styles/scss/components/chat-button/chat-button';

package/scss/components/chat-button/_index.scss

@@ -0,0 +1,9 @@
+// Code generated by @carbon/react. DO NOT EDIT.
+//
+// Copyright IBM Corp. 2018, 2023
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@forward '@carbon/styles/scss/components/chat-button';