@skyscanner/backpack-web 40.0.3 → 40.1.0

package/bpk-component-table/src/BpkTable.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-table{width:100%;margin-bottom:.5rem;border-collapse:collapse;table-layout:fixed;box-shadow:0 0 0 1px #c1c7cf}.bpk-table__cell{padding:1rem}.bpk-table__cell--head{background-color:#eff3f8;text-align:left;font-size:1rem;line-height:1.5rem;font-weight:700}html[dir=rtl] .bpk-table__cell--head{text-align:right}
+.bpk-table{width:100%;margin-bottom:.5rem;border-collapse:collapse;table-layout:fixed;box-shadow:0 0 0 1px #c1c7cf}.bpk-table__cell{padding:1rem}.bpk-table__cell--head{background-color:#eff3f8;text-align:left;font-size:1rem;line-height:1.5rem;font-weight:700}html[dir=rtl] .bpk-table__cell--head{text-align:right}.bpk-table__cell--wordBreak{white-space:normal;word-break:break-word}

package/bpk-component-table/src/BpkTableCell.js

@@ -22,9 +22,11 @@ const getClassName = cssModules(STYLES);
 const BpkTableCell = ({
   children,
   className = null,
+  wordBreak = false,
   ...rest
 }) => {
-  const classNames = getClassName('bpk-table__cell', className);
+  const classes = ['bpk-table__cell', wordBreak && 'bpk-table__cell--wordBreak', className];
+  const classNames = getClassName(...classes);
   return (
     /*#__PURE__*/
     // $FlowFixMe[cannot-spread-inexact] - inexact rest. See decisions/flowfixme.md
@@ -37,6 +39,7 @@ const BpkTableCell = ({
 };
 BpkTableCell.propTypes = {
   className: PropTypes.string,
-  children: PropTypes.node.isRequired
+  children: PropTypes.node.isRequired,
+  wordBreak: PropTypes.bool
 };
 export default BpkTableCell;

package/bpk-component-table/src/BpkTableHeadCell.js

@@ -22,9 +22,11 @@ const getClassName = cssModules(STYLES);
 const BpkTableHeadCell = ({
   children,
   className = null,
+  wordBreak = false,
   ...rest
 }) => {
-  const classNames = getClassName('bpk-table__cell', 'bpk-table__cell--head', className);
+  const classes = ['bpk-table__cell', 'bpk-table__cell--head', wordBreak && 'bpk-table__cell--wordBreak', className];
+  const classNames = getClassName(...classes);
   return /*#__PURE__*/_jsx("th", {
     className: classNames,
     ...rest,
@@ -33,6 +35,7 @@ const BpkTableHeadCell = ({
 };
 BpkTableHeadCell.propTypes = {
   children: PropTypes.node.isRequired,
-  className: PropTypes.string
+  className: PropTypes.string,
+  wordBreak: PropTypes.bool
 };
 export default BpkTableHeadCell;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skyscanner/backpack-web",
-  "version": "40.0.3",
+  "version": "40.1.0",
   "description": "Backpack Design System web library",
   "repository": {
     "type": "git",