pixelize-design-library 1.1.52 → 1.1.54

package/dist/Components/NoteTextArea/NoteTextArea.d.ts

@@ -1,3 +1,3 @@
 import React from "react";
 import { NoteTextAreaProps } from "./NoteTextAreaProps";
-export default function NoteTextArea({ width, handleSubmit, handleCancel, value, title, file, isEditable, saveButtonLoading, maxFileSize, maxFilesSizeError, maxNoteWordCount, }: NoteTextAreaProps): React.JSX.Element;
+export default function NoteTextArea({ width, handleSubmit, handleCancel, value, title, file, isEditable, saveButtonLoading, maxFileSize, maxFilesSizeError, maxNoteWordCount, onChange, ref, }: NoteTextAreaProps): React.JSX.Element;

package/dist/Components/NoteTextArea/NoteTextArea.js

@@ -98,7 +98,7 @@ var countWords = function (text) {
     return text.trim().split(/\s+/).length;
 };
 function NoteTextArea(_a) {
-    var _b = _a.width, width = _b === void 0 ? "100%" : _b, handleSubmit = _a.handleSubmit, handleCancel = _a.handleCancel, value = _a.value, title = _a.title, file = _a.file, _c = _a.isEditable, isEditable = _c === void 0 ? false : _c, saveButtonLoading = _a.saveButtonLoading, _d = _a.maxFileSize, maxFileSize = _d === void 0 ? 1 * 1024 * 1024 : _d, _e = _a.maxFilesSizeError, maxFilesSizeError = _e === void 0 ? "Some files are too large. Maximum allowed size is" : _e, _f = _a.maxNoteWordCount, maxNoteWordCount = _f === void 0 ? 15 : _f;
+    var _b = _a.width, width = _b === void 0 ? "100%" : _b, handleSubmit = _a.handleSubmit, handleCancel = _a.handleCancel, value = _a.value, title = _a.title, file = _a.file, _c = _a.isEditable, isEditable = _c === void 0 ? false : _c, saveButtonLoading = _a.saveButtonLoading, _d = _a.maxFileSize, maxFileSize = _d === void 0 ? 1 * 1024 * 1024 : _d, _e = _a.maxFilesSizeError, maxFilesSizeError = _e === void 0 ? "Some files are too large. Maximum allowed size is" : _e, _f = _a.maxNoteWordCount, maxNoteWordCount = _f === void 0 ? 15 : _f, onChange = _a.onChange, ref = _a.ref;
     var theme = (0, useCustomTheme_1.useCustomTheme)();
     var noteAreaRef = (0, react_1.useRef)(null);
     var _g = (0, react_1.useState)(false), isActive = _g[0], setIsActive = _g[1];
@@ -169,6 +169,7 @@ function NoteTextArea(_a) {
     };
     var handleNoteChange = function (event) {
         setNoteValue(event.target.value);
+        onChange === null || onChange === void 0 ? void 0 : onChange(event.target.value);
         adjustHeight();
     };
     (0, react_1.useEffect)(function () {
@@ -209,7 +210,7 @@ function NoteTextArea(_a) {
         var start = nameWithoutExtension.substring(0, maxLength - extension.length - 3);
         return "".concat(start, "...").concat(extension, " ");
     };
-    return (react_1.default.createElement(Container, { style: { width: width }, isActive: isActive },
+    return (react_1.default.createElement(Container, { style: { width: width }, isActive: isActive, ref: ref },
         react_1.default.createElement(PlaceholderText, { isActive: !isActive, onClick: handleTextArea },
             react_1.default.createElement("span", null, "Add a note...")),
         react_1.default.createElement(TextAreaContainer, { isActive: isActive },

package/dist/Components/NoteTextArea/NoteTextAreaProps.d.ts

@@ -1,3 +1,4 @@
+import { LegacyRef } from "react";
 export type NoteTextAreaProps = {
     width: number | string;
     handleSubmit: (noteValue: string, titleValue: string, file: File[], resetState: void) => void;
@@ -10,4 +11,6 @@ export type NoteTextAreaProps = {
     maxFileSize?: number;
     maxFilesSizeError?: string;
     maxNoteWordCount?: number;
+    onChange?: (value: string) => void;
+    ref?: LegacyRef<HTMLDivElement>;
 };

package/dist/Components/Table/Components/TableBody.js

@@ -102,20 +102,37 @@ var TableBody = function (_a) {
                             backgroundColor: theme.colors.gray[100],
                         },
                     }
-                    : {}, _hover: {
-                    "& > td": {
-                        backgroundColor: theme.colors.gray[100],
-                    },
-                } },
+                    : {} },
                 isContent && (react_2.default.createElement(RenderContent, { rowIndex: rowIndex, isExpanded: isExpanded, isContent: !!row.content })),
                 isCheckbox && react_2.default.createElement(RenderCheckbox, { row: row, isChecked: isChecked }),
                 columns.map(function (header, headerIndex) {
-                    var _a;
+                    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
                     var isFrozen = header.isFreeze;
                     var leftOffset = isFrozen
                         ? (0, table_1.calculateLeftOffset)(columnWidths, headerIndex) +
                             (isCheckbox ? 50 : 0)
                         : 0;
+                    var cellBgColor = undefined;
+                    var cellTextColor = undefined;
+                    if ((_a = row.cellStyle) === null || _a === void 0 ? void 0 : _a[header.id]) {
+                        cellBgColor =
+                            (_d = (_c = (_b = row.cellStyle) === null || _b === void 0 ? void 0 : _b[header.id]) === null || _c === void 0 ? void 0 : _c.bg) !== null && _d !== void 0 ? _d : theme.colors.backgroundColor.light;
+                        cellTextColor =
+                            (_g = (_f = (_e = row.cellStyle) === null || _e === void 0 ? void 0 : _e[header.id]) === null || _f === void 0 ? void 0 : _f.color) !== null && _g !== void 0 ? _g : undefined;
+                    }
+                    else if (isFrozen) {
+                        cellBgColor = freezedBgColor !== null && freezedBgColor !== void 0 ? freezedBgColor : undefined;
+                        cellTextColor = freezedBgColor !== null && freezedBgColor !== void 0 ? freezedBgColor : undefined;
+                    }
+                    else if (index % 2 === 1) {
+                        cellBgColor = theme.colors.backgroundColor.light;
+                    }
+                    var rowBgColor = undefined;
+                    var rowTextColor = undefined;
+                    if (row.rowStyle) {
+                        rowBgColor = (_h = row.rowStyle) === null || _h === void 0 ? void 0 : _h.bg;
+                        rowTextColor = (_j = row.rowStyle) === null || _j === void 0 ? void 0 : _j.color;
+                    }
                     return (visibleColumns[header.label] && (react_2.default.createElement(react_1.Td, { maxWidth: 500, minWidth: 120, key: headerIndex + 1, onClick: function () {
                             return !header.node
                                 ? handleRowClick(row, {
@@ -123,13 +140,13 @@ var TableBody = function (_a) {
                                     id: header.id,
                                 })
                                 : null;
-                        }, fontSize: 14, fontWeight: 400, position: isFrozen ? "sticky" : undefined, left: isFrozen ? leftOffset : undefined, zIndex: isFrozen ? 1 : 0, backgroundColor: isFrozen
-                            ? freezedBgColor
-                            : index % 2 === 1
-                                ? theme.colors.backgroundColor.light
-                                : "white", textOverflow: "ellipsis", border: noBorders
+                        }, fontSize: 14, fontWeight: 400, position: isFrozen ? "sticky" : undefined, left: isFrozen ? leftOffset : undefined, zIndex: isFrozen ? 1 : 0, backgroundColor: cellBgColor !== null && cellBgColor !== void 0 ? cellBgColor : rowBgColor, textOverflow: "ellipsis", border: noBorders
                             ? "none"
-                            : "1px solid ".concat((_a = theme.colors) === null || _a === void 0 ? void 0 : _a.gray[isFrozen || isChecked ? 300 : 200]), className: "columns ".concat(isFrozen ? "sticky-columns" : "scrollable-columns"), boxSizing: "border-box", color: isFrozen ? freezedTextColor : undefined },
+                            : "1px solid ".concat((_k = theme.colors) === null || _k === void 0 ? void 0 : _k.gray[isFrozen || isChecked ? 300 : 200]), className: "columns ".concat(isFrozen ? "sticky-columns" : "scrollable-columns"), boxSizing: "border-box", color: cellTextColor !== null && cellTextColor !== void 0 ? cellTextColor : rowTextColor, _hover: ((_l = row.cellStyle) === null || _l === void 0 ? void 0 : _l[header.id]) || row.rowStyle
+                            ? {}
+                            : {
+                                backgroundColor: theme.colors.gray[100],
+                            } },
                         react_2.default.createElement(react_1.Box, { textOverflow: "ellipsis", whiteSpace: "nowrap", display: "block", overflow: "hidden" }, header.node ? header.node(row) : row[header.id]))));
                 }),
                 isLink && react_2.default.createElement(RenderView, { row: row, bgcolor: freezeViewColor })),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "1.1.52",
+  "version": "1.1.54",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",