WRP-21128: Fixed components used in enact/ui/Layout/Cell which cannot have their css customized in consumer apps.

packages/ui/CHANGELOG.md

@@ -2,6 +2,12 @@
 
 The following is a curated list of changes in the Enact ui module, newest changes on the top.
 
+## [unreleased]
+
+### Added
+
+- `ui/Layout.Cell` prop `componentCss` in order to pass classes to the `Cell` component
+
 ## [4.7.2] - 2023-07-14
 
 No significant changes.

packages/ui/Layout/Cell.js

@@ -59,6 +59,17 @@ const CellBase = kind({
 		 */
 		component:  EnactPropTypes.renderable,
 
+		/**
+		 * Css that is passed to the component used to render as the `Cell`.
+		 *
+		 * When using {@link ui/Layout.Cell}, the `css` prop is forwarded to this component
+		 * as `componentCss`.
+		 *
+		 * @type {Object}
+		 * @public
+		 */
+		componentCss: PropTypes.object,
+
 		/**
 		 * Called with a reference to the root component.
 		 *
@@ -162,13 +173,13 @@ const CellBase = kind({
 		}
 	},
 
-	render: ({component: Component, componentRef, ...rest}) => {
+	render: ({component: Component, componentCss, componentRef, ...rest}) => {
 		delete rest.align;
 		delete rest.grow;
 		delete rest.shrink;
 		delete rest.size;
 
-		return <Component ref={componentRef} {...rest} />;
+		return <Component css={componentCss} ref={componentRef} {...rest} />;
 	}
 });