define(["require", "exports", "tslib", "react", "../../Utilities"], function (require, exports, tslib_1, React, Utilities_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var INNER_PADDING = 16; // Account for padding around the cell.
    var ISPADDED_WIDTH = 24;
    var DetailsRowFields = /** @class */ (function (_super) {
        tslib_1.__extends(DetailsRowFields, _super);
        function DetailsRowFields(props) {
            var _this = _super.call(this, props) || this;
            _this.state = _this._getState(props);
            return _this;
        }
        DetailsRowFields.prototype.componentWillReceiveProps = function (newProps) {
            this.setState(this._getState(newProps));
        };
        DetailsRowFields.prototype.render = function () {
            var _a = this.props, columns = _a.columns, columnStartIndex = _a.columnStartIndex, shimmer = _a.shimmer, rowClassNames = _a.rowClassNames;
            var cellContent = this.state.cellContent;
            return (React.createElement("div", { className: rowClassNames.fields, "data-automationid": "DetailsRowFields", role: "presentation" }, columns.map(function (column, columnIndex) {
                var width = typeof column.calculatedWidth === 'undefined'
                    ? 'auto'
                    : column.calculatedWidth + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0);
                return (React.createElement("div", { key: columnIndex, role: column.isRowHeader ? 'rowheader' : 'gridcell', "aria-colindex": columnIndex + columnStartIndex + 1, className: Utilities_1.css(column.className, column.isMultiline && rowClassNames.isMultiline, column.isRowHeader && rowClassNames.isRowHeader, column.isPadded ? rowClassNames.cellPadded : rowClassNames.cellUnpadded, column.isIconOnly && shimmer && rowClassNames.shimmerIconPlaceholder, shimmer && rowClassNames.shimmer, rowClassNames.cell), style: { width: width }, "data-automationid": "DetailsRowCell", "data-automation-key": column.key }, cellContent[columnIndex]));
            })));
        };
        DetailsRowFields.prototype._getState = function (props) {
            var _this = this;
            var item = props.item, itemIndex = props.itemIndex, onRenderItemColumn = props.onRenderItemColumn, shimmer = props.shimmer;
            return {
                cellContent: props.columns.map(function (column) {
                    var cellContent;
                    try {
                        var render = column.onRender || onRenderItemColumn;
                        cellContent = render && !shimmer ? render(item, itemIndex, column) : _this._getCellText(item, column);
                    }
                    catch (e) {
                        /* no-op */
                    }
                    return cellContent;
                })
            };
        };
        DetailsRowFields.prototype._getCellText = function (item, column) {
            var value = item && column && column.fieldName ? item[column.fieldName] : '';
            if (value === null || value === undefined) {
                value = '';
            }
            return value;
        };
        return DetailsRowFields;
    }(Utilities_1.BaseComponent));
    exports.DetailsRowFields = DetailsRowFields;
});
//# sourceMappingURL=DetailsRowFields.js.map